Resilient-Labs · Fadma1234 · Oct 5, 2025 · Oct 5, 2025 · Oct 7, 2025 · Oct 7, 2025
diff --git a/README.md b/README.md
@@ -1,22 +1,16 @@
-# 📊 Project: Complex API 
+### ** Project: Get News from TechCrunch**
+<img width="1920" alt="image" src="https://github.com/user-attachments/assets/f647d93e-f374-4ff9-ab83-fe659e9cabe4" />
 
-### Goal: Use data returned from one api to make a request to another api and display the data returned
+### **Goal:**
+ Use data returned from one api to make a request to another api and display the data returned
 
-### How to submit your code for review:
+### Tech Stack
+- HTML
 
-- Fork and clone this repo
-- Create a new branch called answer
-- Checkout answer branch
-- Push to your fork
-- Issue a pull request
-- Your pull request description should contain the following:
-  - (1 to 5 no 3) I completed the challenge
-  - (1 to 5 no 3) I feel good about my code
-  - Anything specific on which you want feedback!
+- CSS
+
+- JavaScript
+
+### Live Demo
+Click the link on the right under About to see the live demo.
 
-Example:
-```
-I completed the challenge: 5
-I feel good about my code: 4
-I'm not sure if my constructors are setup cleanly...
-```
diff --git a/complex-api-bootcamp b/complex-api-bootcamp
diff --git a/debug.log b/debug.log
@@ -0,0 +1,15 @@
+[1005/154841.815:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1005/154844.548:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1005/154847.843:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1005/154850.336:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1005/154946.850:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1005/155118.267:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/125617.049:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/125621.299:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/125622.978:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/130224.797:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/130226.501:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/130234.658:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/130255.990:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/130300.128:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/130302.408:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
diff --git a/index.html b/index.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta charset="utf-8">
+	<meta name="description" content="This is where your description goes">
+	<meta name="keywords" content="one, two, three">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<title>complexapi</title>
+
+	<!-- external CSS link -->
+	<!-- <link rel="stylesheet" href="css/normalize.css"> -->
+	<link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+	<main>
+		<h1>Title</h1>
+		<h2></h2>
+		<!-- <input placeholder="Any input (not used)"><br> 
+<input id="op" placeholder="Tesla model"><br> -->
+<button  id="op">Get Info</button><br><br>
+<img id="main-img"><br>
+<h1></h1>
+<h3></h3>
+<h2></h2>
+<img id="bb">
+
+
+
+	</main>
+
+
+	<script type="text/javascript" src="main.js"></script>
+</body>
+
+</html>
diff --git a/main.js b/main.js
@@ -0,0 +1,59 @@
+//pseudo code
+//Use data returned from one api to make a request to another api and display the data returned
+//first search for a working api
+//try the api in postman make sure it is working
+//start the code with event listener to pull info from function
+//create the function 
+//create a fech for fist api and after pulling data from it
+//use the data retuened from first one
+//get another working api
+//make a request to second api using fetch with retuned data from first one
+//display the data
+//https://hacker-news.firebaseio.com/v0/item/8863.json?print=pretty
+document.querySelector('button').addEventListener('click', getInfo);
+
+function getInfo() {
+    // const info = document.querySelector('input').value;
+    const url = `https://api.rss2json.com/v1/api.json?rss_url=https://techcrunch.com/feed/`;
+
+    fetch(url)
+        .then(res => res.json())
+        .then(data => {
+            console.log(data);
+            document.querySelector('img').src = data.feed.image;
+            document.querySelector('h1').innerText = data.feed.title;
+            document.querySelector('h3').innerText = data.feed.description;
+            document.querySelector('h2').innerText = data.items[8].title;
+
+            // I did my code on my own and couldn't make this part work to get my first function linked to second one and used chat gpt to find what was wrong
+            const model = document.querySelector('#op').value || "Tesla_Model_S";
+            getTesla(model);
+        })
+        .catch((err) => console.error(err));
+}
+
+function getTesla(title) {
+    const url1 = `https://en.wikipedia.org/api/rest_v1/page/summary/${encodeURIComponent(title)}`;
+
+    fetch(url1)
+        .then(res => res.json())
+        .then(da => {
+            console.log(da);
+            let imgUrl = '';
+            if (da.originalimage && da.originalimage.source) {
+                imgUrl = da.originalimage.source;
+            } else if (da.thumbnail && da.thumbnail.source) {
+                imgUrl = da.thumbnail.source;
+            }
+            if (imgUrl) {
+                document.querySelector('#bb').src = imgUrl;
+            } else {
+                document.querySelector('#bb').alt = "No image found";
+            }
+        })
+        .catch((err) => console.error(err));
+}
+
+
+
+
diff --git a/style.css b/style.css
@@ -0,0 +1,85 @@
+/* got google help for styling */
+body {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  background-color: #f0f2f5; /* Light gray background */
+  color: #333; /* Darker text for readability */
+  line-height: 1.6;
+  padding: 20px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-height: 100vh;
+  margin: 0;
+}
+
+main {
+  background: white;
+  padding: 40px;
+  border-radius: 10px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  text-align: center;
+  max-width: 500px;
+  width: 100%;
+}
+
+/* Headings */
+h1 {
+  color: #1a1a1a;
+  margin-bottom: 10px;
+  font-size: 2.5rem;
+}
+
+h2, h3, h4, h5 {
+  color: #555;
+  margin-top: 20px;
+  margin-bottom: 10px;
+}
+
+/* Input and button styling */
+.lo {
+  width: calc(100% - 20px); /* Adjust for padding */
+  padding: 12px;
+  margin-top: 10px;
+  margin-bottom: 20px;
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  font-size: 1rem;
+  box-sizing: border-box; /* Ensures padding doesn't affect width */
+}
+
+button.lo {
+  width: 100%;
+  background-color: #007bff;
+  color: white;
+  border: none;
+  cursor: pointer;
+  transition: background-color 0.3s ease;
+}
+
+button.lo:hover {
+  background-color: #0056b3;
+}
+
+/* Image and link styling */
+img {
+  max-width: 100%;
+  height: auto;
+  border-radius: 8px;
+  margin-top: 20px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+#link {
+  display: block;
+  margin-top: 20px;
+  color: #007bff;
+  text-decoration: none;
+  font-weight: bold;
+  transition: color 0.3s ease;
+}
+
+#link:hover {
+  color: #0056b3;
+  text-decoration: underline;
+}
+