Homepage

.gitignore

@@ -0,0 +1,24 @@
+# node 
+/stationery-tracker/node_modules
+
+# macOS
+.DS_Store
+
+# build output
+dist/
+build/
+
+# cache
+.cache/
+.vite/
+.next/
+.babel/
+
+# log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# environment
+.env
+.env.*

stationery-tracker/package.json

@@ -11,6 +11,7 @@
     "@testing-library/user-event": "^13.5.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
+    "react-router-dom": "^7.4.0",
     "react-scripts": "5.0.1",
     "web-vitals": "^2.1.4"
   },

stationery-tracker/src/App.js

@@ -1,12 +1,15 @@
-import logo from './logo.svg';
+import {BrowserRouter, Routes, Route} from 'react-router-dom';
 import './index.css';
+import HomePage from './pages/HomePage';
 
 export default function App() {
-  return (
-    <div className="flex min-h-screen items-center justify-center bg-gradient-to-br from-blue-500 to-purple-600 text-white text-4xl font-bold">
-      🚀 Tailwind is working!
-    </div>
-  );
+    return (
+      <BrowserRouter>
+        <Routes>
+          <Route path="/home" element={<HomePage />} />
+        </Routes>
+      </BrowserRouter>
+    );
 }
 
 

stationery-tracker/src/pages/HomePage.js

@@ -0,0 +1,16 @@
+import { Link } from 'react-router-dom';
+import sticker from '../resources/assets/stickers/7.png';
+
+export default function HomePage() {
+    return (
+        <div className="flex min-h-screen items-center justify-center bg-gradient-to-br from-blue-500 to-purple-600 text-white text-4xl font-bold">
+            <p>My Digital Journal ***********</p>
+        <img
+            src={sticker}
+            alt="Cute sticker"
+            className="w-32 h-32 object-contain mx-auto shadow-lg rounded-xl"
+        />
+        </div>
+
+    );
+}