Resilient-Labs · Fadma1234 · Oct 5, 2025 · Oct 5, 2025 · Oct 7, 2025 · Oct 7, 2025
diff --git a/.hintrc b/.hintrc
@@ -0,0 +1,13 @@
+{
+  "extends": [
+    "development"
+  ],
+  "hints": {
+    "axe/text-alternatives": [
+      "default",
+      {
+        "image-alt": "off"
+      }
+    ]
+  }
+}
diff --git a/README.md b/README.md
@@ -1,22 +1,15 @@
-# 📊 Project: Complex API 2
+### ** Project: Get a meal and desert**
+<img width="1920" alt="image" src="https://github.com/user-attachments/assets/c682da63-325e-495e-85e0-b1ae4b8b8e00" />
 
-### 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:
+### **Goal:**
+ Use data returned from one api to make a request to another api and display the data returned
+### 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
 
-Example:
-```
-I completed the challenge: 5
-I feel good about my code: 4
-I'm not sure if my constructors are setup cleanly...
-```
+### Live Demo
+Click the link on the right under About to see the live demo.
diff --git a/complex-api2-bootcamp b/complex-api2-bootcamp
diff --git a/debug.log b/debug.log
@@ -0,0 +1,2 @@
+[1007/124646.958:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
+[1007/124655.173:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
diff --git a/index.html b/index.html
@@ -0,0 +1,31 @@
+<!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>
+
+<button>Click to Get Meal and Dessert</button>
+<br><br>
+<img id="meal-image"><br>
+<img id="dessert-image" >
+
+
+
+	</main>
+
+
+	<script type="text/javascript" src="main.js"></script>
+</body>
+
+</html>
diff --git a/main.js b/main.js
@@ -0,0 +1,84 @@
+//psuedo code
+// Use data returned from one api to make a request to another api and display the data returned
+//find two working apis one for random meals and a second one for deserts
+//test my apis on postman make sure thay are working 
+//create my event listener and make it run my functions
+//use to functions with fetch inside to get my data
+//make sure th data is working and displayed in the DOM
+//use catch for both my fegit tches 
+//call second function inside the first one and make sure its working
+//https://www.themealdb.com/api/json/v1/1/filter.php?c=Dessert
+//i had to go back to this and fix it it was only showing one meal and one desert now it shows random ones 
+document.querySelector('button').addEventListener('click', getInfo);
+
+function getInfo() {
+
+  const url = `https://www.themealdb.com/api/json/v1/1/filter.php?c=Seafood`;
+
+  fetch(url)
+    .then(res => res.json())
+    .then(data => {
+      console.log(data);
+      const randomIndex = Math.floor(Math.random() * data.meals.length);
+      document.querySelector('#meal-image').src = data.meals[randomIndex].strMealThumb;
+
+
+      getDesrect();
+    });
+}
+
+function getDesrect() {
+  const url1 = `https://www.themealdb.com/api/json/v1/1/filter.php?c=Dessert`;
+
+  fetch(url1)
+    .then(res => res.json())
+    .then(info => {
+      console.log(info);
+      const randomIn = Math.floor(Math.random() * info.meals.length);
+
+      document.querySelector('#dessert-image').src = info.meals[randomIn].strMealThumb;
+    });
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/style.css b/style.css
@@ -0,0 +1,51 @@
+/* style.css */
+/* used chatgpt for styling */
+
+body {
+  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+  background: #f0f4f8;
+  margin: 0;
+  padding: 40px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+}
+
+input[type="text"] {
+  padding: 10px;
+  width: 250px;
+  font-size: 16px;
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  margin-bottom: 15px;
+}
+
+button {
+  padding: 10px 20px;
+  font-size: 16px;
+  background-color: #0077cc;
+  color: white;
+  border: none;
+  border-radius: 5px;
+  cursor: pointer;
+  transition: background 0.3s ease;
+}
+
+button:hover {
+  background-color: #005fa3;
+}
+
+img {
+  margin-top: 20px;
+  max-width: 90%;
+  height: auto;
+  border-radius: 10px;
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
+}
+
+@media (min-width: 600px) {
+  img {
+    max-width: 400px;
+  }
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		[1007/124646.958:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.
		[1007/124655.173:ERROR:icu_util.cc(223)] Invalid file descriptor to ICU data received.