# đŸ§ĩ Tailor Management System — Milestones & Versioning Roadmap > **Backend:** Laravel 11 ¡ MySQL ¡ REST API > **Frontend:** React (Vite) ¡ Tailwind CSS ¡ Axios > **Languages:** Nepali (ā¤¨āĨ‡ā¤Ēā¤žā¤˛āĨ€) + English > **Architecture:** Decoupled — Laravel serves JSON APIs, React consumes them > **Target:** Mobile-first SPA for college dress & custom tailoring operations — Nepal --- ## Stack Summary | Layer | Technology | |-------|-----------| | Backend | Laravel 11 (API only — no Blade views) | | Database | MySQL 8.x | | Frontend | React 18 + Vite | | Styling | Tailwind CSS | | HTTP Client | Axios | | Auth | Laravel Sanctum (token-based SPA auth) | | State Management | Zustand or React Context | | PDF Receipts | Laravel DomPDF (served as API endpoint) | | Bulk Import | Maatwebsite Excel (Laravel side) | | Roles | spatie/laravel-permission | | i18n (Frontend) | i18next + react-i18next | --- ## Version Overview | Version | Name | Focus | Est. Duration | |---------|------|-------|---------------| | v0.1 | Foundation | Laravel API setup, MySQL, Sanctum auth | Week 1 | | v0.2 | React Shell | React project, routing, auth flow, i18n | Week 2 | | v0.3 | Orders API | Order CRUD + status API endpoints | Week 3–4 | | v0.4 | Orders UI | React order pages consuming the API | Week 5 | | v0.5 | Billing | Payments API + UI + PDF receipts | Week 6 | | v0.6 | Customers | Profiles + measurements API + UI | Week 7 | | v0.7 | Colleges | Contracts + faculties API + UI | Week 8 | | v0.8 | Dashboard | Analytics API + React dashboard | Week 9 | | v0.9 | Peak Mode | Bulk import + SEE season tools | Week 10 | | v0.10 | Tracking | Public tracking page (no auth) | Week 11 | | v1.0 | Launch | Polish, testing, deploy | Week 12–13 | --- ## v0.1 — Foundation (Laravel API) > **Goal:** Laravel project running, MySQL connected, auth working via Sanctum ### Milestone 0.1.1 — Laravel Project Setup - [ ] Create Laravel 11 project - [ ] Configure `.env` for MySQL: ``` DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=tailor_db DB_USERNAME=root DB_PASSWORD=your_password ``` - [ ] Install packages: ```bash composer require laravel/sanctum composer require spatie/laravel-permission composer require barryvdh/laravel-dompdf composer require maatwebsite/excel ``` - [ ] Configure Sanctum for SPA auth - [ ] Set `FRONTEND_URL` in `.env` for CORS - [ ] Configure `config/cors.php` to allow React dev server (`localhost:5173`) ### Milestone 0.1.2 — Database Migrations - [ ] Run migrations in order: - `users` (+ `phone`, `is_active` columns) - `colleges` - `college_faculties` - `customers` - `orders` - `order_items` - `payments` - `order_status_logs` - [ ] Set up all Eloquent models with relationships - [ ] Configure `spatie/laravel-permission` roles: `admin`, `worker` - [ ] Seed: 1 admin, 2 colleges, 3 sample orders ### Milestone 0.1.3 — Auth API Endpoints - [ ] `POST /api/login` — returns Sanctum token - [ ] `POST /api/logout` — revokes token - [ ] `GET /api/user` — returns authenticated user + role - [ ] All protected routes use `auth:sanctum` middleware **Deliverable:** Postman can log in and hit protected endpoints ✅ --- ## v0.2 — React Shell > **Goal:** React app running, routing set up, auth flow working, i18n configured ### Milestone 0.2.1 — React Project Setup - [ ] Create React + Vite project: ```bash npm create vite@latest tailor-frontend -- --template react cd tailor-frontend npm install ``` - [ ] Install dependencies: ```bash npm install axios react-router-dom tailwindcss npm install i18next react-i18next npm install zustand # state management npm install @heroicons/react # icons npm install react-hot-toast # notifications ``` - [ ] Configure Tailwind CSS - [ ] Set up Axios base URL pointing to Laravel API - [ ] Set up Axios interceptor to attach Sanctum token from localStorage ### Milestone 0.2.2 — App Shell & Routing - [ ] Main layout component: mobile sidebar nav + topbar - [ ] React Router setup with protected routes - [ ] Routes structure: ``` /login /dashboard /orders /orders/new /orders/:id /orders/:id/edit /customers /customers/:id /colleges /colleges/:id /payments /reports /workers (admin only) /track/:token (public, no auth) ``` - [ ] Auth guard — redirect to `/login` if no token ### Milestone 0.2.3 — Auth Flow (React) - [ ] Login page (email + password form) - [ ] Call `POST /api/login`, store token in localStorage - [ ] Zustand auth store: `user`, `token`, `login()`, `logout()` - [ ] Logout clears token + redirects to login ### Milestone 0.2.4 — Localization (i18next) - [ ] Folder structure: ``` src/locales/ ├── en/ │ ├── nav.json │ ├── orders.json │ ├── customers.json │ ├── colleges.json │ ├── payments.json │ ├── dashboard.json │ └── common.json └── ne/ ├── nav.json ├── orders.json ├── customers.json ├── colleges.json ├── payments.json ├── dashboard.json └── common.json ``` - [ ] `i18n.js` config — default locale from `localStorage` or `ne` - [ ] Language toggle in navbar (ā¤¨āĨ‡ā¤Ēā¤žā¤˛āĨ€ / English) - [ ] `Noto Sans Devanagari` font loaded for Nepali - [ ] `` updates on toggle **Deliverable:** React app loads, login works, language toggles between ā¤¨āĨ‡ā¤Ēā¤žā¤˛āĨ€ and English ✅ --- ## v0.3 — Orders API (Laravel) > **Goal:** All order-related API endpoints ready for React to consume ### Milestone 0.3.1 — Order Endpoints - [ ] `GET /api/orders` — paginated list with filters (status, college, worker, date) - [ ] `POST /api/orders` — create order + items + initial payment - [ ] `GET /api/orders/{id}` — order detail with items, payments, status logs - [ ] `PUT /api/orders/{id}` — update order - [ ] `DELETE /api/orders/{id}` — soft delete - [ ] `POST /api/orders/{id}/status` — update status + log entry - [ ] `POST /api/bulk-import` — import orders from Excel/CSV ### Milestone 0.3.2 — API Resources (JSON shape) - [ ] `OrderResource` — shapes order JSON response - [ ] `OrderCollection` — paginated list response - [ ] `OrderItemResource` - [ ] Consistent response format: ```json { "data": {}, "message": "Order created", "status": 200 } ``` ### Milestone 0.3.3 — Validation - [ ] `StoreOrderRequest` — validates all order fields - [ ] `UpdateOrderRequest` - [ ] `UpdateStatusRequest` — validates status enum - [ ] Validation error messages in both English and Nepali **Deliverable:** All order endpoints tested in Postman ✅ --- ## v0.4 — Orders UI (React) > **Goal:** React pages for the full order lifecycle ### Milestone 0.4.1 — Orders List Page (`/orders`) - [ ] Fetch from `GET /api/orders` with Axios - [ ] Filter bar: status, college, worker, date range - [ ] Search: name, phone, order number - [ ] Sort by deadline (urgent first) - [ ] Color-coded status badges (reusable `` component) - [ ] Pagination - [ ] Loading skeleton + empty state ### Milestone 0.4.2 — New Order Form (`/orders/new`) - [ ] Multi-step form or single long form: 1. Order type (College / Walk-in) 2. Customer selection (search existing or create new inline) 3. College + faculty (shown if college order) 4. Measurements (auto-filled if customer exists) 5. Garment items (dynamic add/remove rows) 6. Deadline + worker assignment 7. Advance payment - [ ] Live total price calculation - [ ] Submit calls `POST /api/orders` - [ ] Success → redirect to order detail ### Milestone 0.4.3 — Order Detail Page (`/orders/:id`) - [ ] Full order info display - [ ] Status pipeline visualization - [ ] One-tap status update button → calls `POST /api/orders/{id}/status` - [ ] Status change history timeline - [ ] Payment history + add payment button - [ ] Download receipt button ### Milestone 0.4.4 — Reusable Components - [ ] `` - [ ] `` — compact card for mobile list view - [ ] `` — renders all measurements neatly - [ ] `` — single item row in order form **Deliverable:** Orders can be created, viewed, and updated entirely through React ✅ --- ## v0.5 — Billing & Payments > **Goal:** Every payment recorded, receipts downloadable ### Milestone 0.5.1 — Payments API (Laravel) - [ ] `POST /api/orders/{id}/payments` — record a payment - [ ] `GET /api/payments/report` — daily/outstanding summary - [ ] `GET /api/orders/{id}/receipt` — returns PDF (DomPDF) - [ ] Payment methods: `cash`, `esewa`, `khalti`, `bank_transfer` - [ ] Balance due auto-calculated in `OrderResource` ### Milestone 0.5.2 — Payments UI (React) - [ ] Add payment modal on order detail page - [ ] Payment history list per order - [ ] Outstanding dues page (`/payments`) — orders with balance > 0 - [ ] Daily cash collection summary - [ ] College-wise billing statement view ### Milestone 0.5.3 — PDF Receipts - [ ] Laravel generates receipt PDF via DomPDF - [ ] React fetches PDF blob from `/api/orders/{id}/receipt` - [ ] Opens in new tab or triggers download - [ ] WhatsApp share button (pre-filled message with tracking link) **Deliverable:** Payments tracked, receipts downloadable and shareable ✅ --- ## v0.6 — Customers & Measurements > **Goal:** Saved profiles, reused measurements, full order history ### Milestone 0.6.1 — Customers API (Laravel) - [ ] `GET /api/customers` — list with search - [ ] `POST /api/customers` — create - [ ] `GET /api/customers/{id}` — profile + orders - [ ] `PUT /api/customers/{id}` — update + measurements - [ ] Measurement history stored on update ### Milestone 0.6.2 — Customers UI (React) - [ ] Customer list with search (`/customers`) - [ ] Customer profile page (`/customers/:id`): - Measurements display + edit - Full order history - Total spent, last order date - Quick "Re-order" button - [ ] Inline customer creation from new order form - [ ] Auto-fill measurements when selecting existing customer **Deliverable:** Returning students auto-filled — zero re-entry ✅ --- ## v0.7 — Colleges & Contracts > **Goal:** All college relationships in one place ### Milestone 0.7.1 — Colleges API (Laravel) - [ ] Full CRUD for colleges - [ ] Nested CRUD for faculties under college - [ ] `GET /api/colleges/{id}/orders` — all orders for a college - [ ] College summary: total students, total value, amount received ### Milestone 0.7.2 — Colleges UI (React) - [ ] College list page (`/colleges`) - [ ] College detail page (`/colleges/:id`): - Faculty list with dress codes + pricing - Order progress bar (X of Y ready) - Financial summary - Coordinator contact with click-to-call - [ ] Add/edit college + faculty forms **Deliverable:** College contracts fully visible and manageable ✅ --- ## v0.8 — Dashboard & Reports > **Goal:** Owner sees everything at a glance ### Milestone 0.8.1 — Dashboard API (Laravel) - [ ] `GET /api/dashboard/stats` — returns: - Active orders count by status - Today's revenue collected - Total outstanding balance - Orders due this week (by day) - Worker order counts ### Milestone 0.8.2 — Dashboard UI (React) - [ ] Stats cards row (orders, revenue, outstanding, due soon) - [ ] Orders by status breakdown - [ ] Urgency list — orders due within 3 days - [ ] Worker activity summary - [ ] Mobile-optimized layout ### Milestone 0.8.3 — Reports UI - [ ] Monthly order volume - [ ] College-wise revenue report - [ ] Worker performance (completed orders) - [ ] Outstanding aging report - [ ] Date range picker for all reports **Deliverable:** Full operational visibility from one screen ✅ --- ## v0.9 — Peak Mode (SEE Season Tools) > **Goal:** Handle hundreds of orders without losing track ### Milestone 0.9.1 — Bulk Import (Laravel) - [ ] Accept Excel/CSV upload at `POST /api/bulk-import` - [ ] Validate columns: name, phone, measurements, faculty - [ ] Preview endpoint before confirming import - [ ] Skip duplicates, report skipped rows - [ ] Create orders in bulk for entire college batch ### Milestone 0.9.2 — Peak Mode UI (React) - [ ] Peak Mode toggle (admin only) — stored in app state - [ ] Capacity dashboard: total orders vs. worker capacity - [ ] Deadline density — orders due per day (bar chart) - [ ] Worker overload alert badge - [ ] College delivery calendar ### Milestone 0.9.3 — Bulk Actions - [ ] Multi-select orders in list view - [ ] Bulk status update (e.g. mark 50 as Ready) - [ ] Bulk assign to worker - [ ] College-wide delivery confirmation **Deliverable:** 500-order SEE rush managed without chaos ✅ --- ## v0.10 — Public Tracking Portal > **Goal:** Customers check their own order — no calls to shop ### Milestone 0.10.1 — Tracking API (Laravel) - [ ] `GET /api/track/{token}` — public, no auth required - [ ] Returns: status, items, deadline, balance due - [ ] Token generated on order creation ### Milestone 0.10.2 — Tracking UI (React) - [ ] Public route `/track/:token` — no login, no nav - [ ] Shows order status with visual pipeline - [ ] Items ordered, estimated delivery, balance due - [ ] Bilingual (ā¤¨āĨ‡ā¤Ēā¤žā¤˛āĨ€ / English toggle) - [ ] Mobile-optimized, minimal design - [ ] WhatsApp contact button for shop **Deliverable:** Customers self-serve — fewer "ā¤•āĨ‡ ā¤­ā¤¯āĨ‹ ā¤…ā¤°āĨā¤Ąā¤°?" calls ✅ --- ## v1.0 — Launch > **Goal:** Production-ready, tested, deployed ### Milestone 1.0.1 — Testing - [ ] Laravel: feature tests for all API endpoints - [ ] React: component tests for critical forms (order creation, payment) - [ ] End-to-end test: create order → update status → record payment → download receipt - [ ] Test on real Android device (Chrome) - [ ] Test Nepali script rendering on device - [ ] Test bulk import with 100+ rows ### Milestone 1.0.2 — Polish - [ ] Loading skeletons on all data-fetching screens - [ ] Empty states on all list pages - [ ] Error boundaries in React - [ ] API error handling — show toast on failure - [ ] Confirm dialogs for destructive actions - [ ] 404 page (bilingual) ### Milestone 1.0.3 — Deployment - [ ] Deploy Laravel API (Railway, Render, or VPS) - [ ] Deploy React frontend (Vercel, Netlify, or same VPS) - [ ] MySQL production DB configured - [ ] `APP_ENV=production`, `APP_DEBUG=false` - [ ] CORS set to production React domain - [ ] SSL on both API and frontend - [ ] Daily MySQL dump backup ### Milestone 1.0.4 — Handover - [ ] Train owner + workers (30-min walkthrough) - [ ] Simple Nepali-language user guide (1 page) - [ ] Set up error reporting (Sentry or Laravel Telescope) **Deliverable:** System live, staff trained, shop running smoother ✅ --- ## Post-Launch (v1.x) | Version | Planned Feature | |---------|----------------| | v1.1 | WhatsApp notification when order status changes | | v1.2 | Worker mobile view — simplified, only their assigned orders | | v1.3 | Year-on-year peak season comparison report | | v1.4 | Bikram Sambat (Nepali calendar) date support | | v1.5 | PWA — offline support for slow internet | | v1.6 | SMS notifications via Sparrow SMS (Nepal) | --- ## API Base URL Convention ``` Production: https://api.yourdomain.com/api/ Development: http://localhost:8000/api/ ``` All endpoints require `Accept: application/json` header. Protected endpoints require `Authorization: Bearer {token}` header. --- ## Quick Reference — Order Status Values | English | ā¤¨āĨ‡ā¤Ēā¤žā¤˛āĨ€ | API Value | |---------|--------|-----------| | Received | ā¤ĒāĨā¤°ā¤žā¤ĒāĨā¤¤ ā¤­ā¤¯āĨ‹ | `received` | | Cutting | ā¤•ā¤žā¤Ÿā¤ŋā¤ā¤ĻāĨˆ ā¤› | `cutting` | | Stitching | ā¤¸ā¤ŋā¤˛ā¤žā¤‡ ā¤šāĨā¤ā¤ĻāĨˆ ā¤› | `stitching` | | Finishing | ā¤Ģā¤ŋā¤¨ā¤ŋā¤¸ā¤ŋā¤™ | `finishing` | | Ready | ā¤¤ā¤¯ā¤žā¤° ā¤› | `ready` | | Delivered | ā¤ĄāĨ‡ā¤˛ā¤ŋā¤­ā¤° ā¤­ā¤¯āĨ‹ | `delivered` | --- ## Quick Reference — User Roles | Role | Access | |------|--------| | `admin` | Full access — all modules, reports, worker management | | `worker` | Own assigned orders only — view + status update | --- *Last updated: April 2026 — adjust timelines as development progresses.*