From b835beee39eedd8412ff8d187b35600905972c36 Mon Sep 17 00:00:00 2001
From: Sanjay V Nair <90128044+Sanjay-V-Nair@users.noreply.github.com>
Date: Wed, 26 Jun 2024 12:19:29 +0530
Subject: [PATCH] Alternative Approach

An alternative approach using the ".map" functionality of Javascript is used instead of explicitly adding the li elements to the list.
---
 2-jsx-components/08-travel-gallery/App.js | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/2-jsx-components/08-travel-gallery/App.js b/2-jsx-components/08-travel-gallery/App.js
index a03fa83..d424299 100644
--- a/2-jsx-components/08-travel-gallery/App.js
+++ b/2-jsx-components/08-travel-gallery/App.js
@@ -17,4 +17,20 @@ export default function App() {
       {imageGallery}
     </ul>
   );
-}
\ No newline at end of file
+}
+
+// ALTERNATIVE APPROACH
+// Alternative approach using the ".map" functionality of list in Javascript
+export default function App() {
+    const barcelonaImage = <img src={"https://bit.ly/3HNBfm9"}  alt="Barcelona" />;
+  const tokyoImage = <img src={"https://bit.ly/3uqeiSM"}  alt="Tokyo" />;
+  const ohioImage = <img src={"https://bit.ly/3whR81p"}  alt="Ohio" />;
+    let list =[barcelonaImage, tokyoImage, ohioImage];
+  return <ul>
+        {list.map((img, imgindx)=>{
+          return (
+            <li>{img}</li>
+          )
+        })}
+  </ul>;
+}