🛠️ Building your first page

Adding a new page to your project is super simple. All you need to do is create a new folder inside the src/ directory. The folder name becomes the path, and each page folder must include a page.tsx file.

---

📁 Example Structure

src/
    dashbord/
        page.tsx
    users/
        page.tsx
        editUser/
            page.tsx

🌐 Available Routes

Based on the structure above, your project will have these routes:

• localhost:5173/dashboard

• localhost:5173/users

• localhost:5173/users/editUser

---

🧩 Adding Extra Files

If your page needs helper functions or components, you can add folders within the page directory. To avoid these folders becoming routes, prefix their names with an underscore _.

src/
    dashboard/
        page.tsx
        _functions/
            loadData.ts
            removeData.ts
        _components/
            userCard.tsx
        editUser/
            page.tsx

📌 How This Works

• Only folders that contain a page.tsx file are treated as routes.

• Folders like _functions/ and _components/ are ignored by the router but still accessible in your imports.

• The underscore _ is just a naming convention—it helps you (and other developers) instantly recognize folders that aren’t routes.

---

✅ Summary

• Create a folder in src/ to make a new page.

• Add a page.tsx file to define the route content.

• Use _-prefixed folders to organize your components and logic inside each page folder.