Merge pull request #2 from priyankarpal/priyankar

fix: fixed data fetching

package.json

@@ -11,19 +11,20 @@
   },
   "dependencies": {
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
+    "react-icons": "^4.8.0"
   },
   "devDependencies": {
-    "@types/react": "^18.0.28",
-    "@types/react-dom": "^18.0.11",
+    "@types/react": "^18.2.0",
+    "@types/react-dom": "^18.2.1",
     "@vitejs/plugin-react": "^4.0.0",
     "autoprefixer": "^10.4.14",
-    "eslint": "^8.38.0",
+    "eslint": "^8.39.0",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-react-refresh": "^0.3.4",
+    "eslint-plugin-react-refresh": "^0.4.0",
     "postcss": "^8.4.23",
     "tailwindcss": "^3.3.2",
-    "vite": "^4.3.2"
+    "vite": "^4.3.3"
   }
 }

src/App.jsx

@@ -1,11 +1,13 @@
 import './index.css'
-
+import Card from './components/Card'
 function App() {
 
   return (
-
+    <div className="App pt-10">
+      <Card />
+    </div>
 
-  );
+  )
 }
 
 export default App

src/components/Card.jsx

@@ -1,17 +1,15 @@
-// eslint-disable-next-line no-unused-vars
-import React from "react";
-import data from "../database/data.json";
 import { BiGitRepoForked } from "react-icons/bi";
 import { BsFillArrowUpRightCircleFill } from "react-icons/bs";
-import 
+import data from "../database/data.json";
+
 
-export const Card = ({link,title,img,description,ghLink}) => {
+export default function Card() {
   return (
     <div>
       {data.map((item) => {
         return (
           <div
-            key={item.title}
+            key={item.id}
             className="mx-auto card-1 bg-[#8800ff] items-center  w-11/12 flex gap-24 rounded-lg p-12 text-white shadow-2xl relative hover:shadow-3xl mb-12"
           >
             <a href={item.link}>
@@ -42,5 +40,5 @@ export const Card = ({link,title,img,description,ghLink}) => {
         );
       })}
     </div>
-  );
+  )
 }

src/database/data.json

@@ -2,16 +2,15 @@
   {
     "link": "https://linkshub.vercel.app/",
     "title": "LinksHub",
-    "img": " ../public/images/linkshub.png",
+    "img": " https://user-images.githubusercontent.com/88102392/235366922-4160ae75-ee11-49df-b680-331bf111ec7d.png",
     "description": "LinksHub aims to provide developers with access to a wide range of free resources and tools that they can use in their work. These resources include links to free software libraries, frameworks, and other tools that can be used to build and deploy applications and websites.",
     "ghLink": "https://github.com/rupali-codes/LinksHub"
   },
   {
     "link": "https://projectshut.vercel.app/",
     "title": "ProjectsHub",
-    "img": " ../public/images/PH.png",
-   "description": "ProjectsHut is an open source project that runs on the latest web technologies. ProjectsHut offers a user-friendly interface, making it easy to publish projects and share them with others. Whether you're a seasoned professional or just starting out, it's a valuable resource for sharing your work and making connections in the tech community. With its Open Source design."
-,
+    "img": "https://user-images.githubusercontent.com/88102392/235366951-ffc5cc9a-d74c-484c-8c25-12de3969cf1c.png",
+    "description": "ProjectsHut is an open source project that runs on the latest web technologies. ProjectsHut offers a user-friendly interface, making it easy to publish projects and share them with others. Whether you're a seasoned professional or just starting out, it's a valuable resource for sharing your work and making connections in the tech community. With its Open Source design.",
     "ghLink": "https://github.com/priyankarpal/ProjectsHut"
   }
-]
+]

src/index.css

@@ -1,3 +1,3 @@
 @tailwind base;
 @tailwind components;
-@tailwind utilities;
+@tailwind utilities;