ঠিক আছে Mostafa — আমি একদম practical, step-by-step ভাবে SkillBridge Frontend (Next.js) এর জন্য previous project-এর মতো folder structure + build process বুঝিয়ে দিচ্ছি।

তুমি যেহেতু backend API ready রেখেছ, আমরা pure frontend + API consumption ফোকাস করবো।


🔧 Frontend Tech Assumption


✅ Recommended Project Folder Structure

(তোমার previous project এর সাথে aligned)

src/
├─ app/
│  ├─ (commonLayout)/
│  │  ├─ page.tsx              # Home
│  │  ├─ about/
│  │  │  └─ page.tsx
│  │  ├─ login/
│  │  │  └─ page.tsx
│  │  ├─ register/
│  │  │  └─ page.tsx
│  │  └─ layout.tsx            # Navbar + Footer
│  │
│  ├─ (dashboardLayout)/
│  │  ├─ layout.tsx            # Sidebar + dashboard layout
│  │  │
│  │  ├─ @student/
│  │  │  └─ dashboard/
│  │  │     ├─ page.tsx
│  │  │     ├─ bookings/
│  │  │     │  └─ page.tsx
│  │  │     └─ profile/
│  │  │        └─ page.tsx
│  │  │
│  │  ├─ @tutor/
│  │  │  └─ tutor/
│  │  │     ├─ dashboard/
│  │  │     │  └─ page.tsx
│  │  │     ├─ availability/
│  │  │     │  └─ page.tsx
│  │  │     └─ profile/
│  │  │        └─ page.tsx
│  │  │
│  │  └─ @admin/
│  │     └─ admin/
│  │        ├─ page.tsx
│  │        ├─ users/
│  │        │  └─ page.tsx
│  │        ├─ bookings/
│  │        │  └─ page.tsx
│  │        └─ categories/
│  │           └─ page.tsx
│  │
│  ├─ not-found.tsx
│  └─ layout.tsx               # Root layout
│
├─ components/
│  ├─ layout/
│  │  ├─ Navbar.tsx
│  │  ├─ Footer.tsx
│  │  ├─ Sidebar.tsx
│  │  └─ DashboardHeader.tsx
│  │
│  ├─ modules/
│  │  ├─ tutor/
│  │  │  ├─ TutorCard.tsx
│  │  │  ├─ TutorProfile.tsx
│  │  │  └─ TutorFilter.tsx
│  │  │
│  │  ├─ booking/
│  │  │  ├─ BookingCard.tsx
│  │  │  └─ BookingForm.tsx
│  │  │
│  │  ├─ review/
│  │  │  └─ ReviewList.tsx
│  │  │
│  │  └─ admin/
│  │     └─ UserTable.tsx
│  │
│  └─ ui/
│     ├─ Button.tsx
│     ├─ Input.tsx
│     ├─ Modal.tsx
│     └─ Loader.tsx
│
├─ constants/
│  ├─ routes.ts
│  ├─ roles.ts
│  └─ bookingStatus.ts
│
├─ hooks/
│  ├─ useAuth.ts
│  ├─ useUser.ts
│  └─ useDebounce.ts
│
├─ lib/
│  ├─ axios.ts
│  ├─ auth.ts
│  └─ utils.ts
│
├─ providers/
│  ├─ AuthProvider.tsx
│  └─ ThemeProvider.tsx
│
├─ services/
│  ├─ auth.service.ts
│  ├─ tutor.service.ts
│  ├─ booking.service.ts
│  ├─ review.service.ts
│  └─ admin.service.ts
│
├─ routes/
│  └─ protectedRoutes.ts
│
├─ types/
│  ├─ user.ts
│  ├─ tutor.ts
│  ├─ booking.ts
│  └─ review.ts

🧠 Layout Strategy (Important)

1️⃣ (commonLayout)