setup for star rating project and install react icons

package.json

@@ -19,6 +19,7 @@
     "lucide-react": "^0.344.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-icons": "^5.0.1",
     "react-router-dom": "^6.22.2",
     "tailwind-merge": "^2.2.1"
   },

src/App.jsx

@@ -7,6 +7,7 @@ import Home from "@/pages/Home";
 import NotFound from "@/pages/404";
 import Accordion from "@/pages/accordion/accordion";
 import RandomColor from "@/pages/RandomColor"
+import StarRating from "@/pages/starRating";
 
 function App() {
   return (
@@ -19,6 +20,8 @@ function App() {
           <Route path="accordion" element={<Accordion />} />
           {/* Random color generator */} 
           <Route path="color-generator" element={<RandomColor />} />
+          {/* Star Rating */}
+          <Route path="star-rating" element={<StarRating />} />
 
           {/* Error Page */}
           <Route path="*" element={<NotFound />} />

src/pages/Home.jsx

@@ -7,6 +7,7 @@ function Home() {
       <p className="text-neutral-500 text-xs">I&apos;ll start on it when add the first componenet (project)</p>
       <Link to='accordion'>accordion</Link>
       <Link to='color-generator'>random Color Generator</Link>
+      <Link to='star-rating'>star rating</Link>
     </div>
   );
 }

src/pages/starRating.jsx

@@ -0,0 +1,9 @@
+export default function StarRating() {
+  return (
+    <div
+      className={`container flex flex-1 flex-col items-center justify-start gap-8 my-10 w-full h-screen`}
+    >
+
+    </div>
+  );
+}