A modern, responsive bus seat booking application designed to provide a seamless travel experience. Built with the latest web technologies, including Next.js 16, React 19, and Tailwind CSS.
- Interactive Seat Map: Visual representation of bus layouts with real-time status indicators (Available, Booked, My Seat).
- Seamless Booking Flow: Intuitive step-by-step booking process with immediate feedback via toast notifications.
- Admin Dashboard: comprehensive admin panel to view all bookings and manage seat allocations.
- Dynamic UX: Smooth transitions, glassmorphism effects, and responsive design for all devices.
- State Management: efficient local state handling with custom hooks for real-time data updates.
- Framework: Next.js 16 (App Router)
- Library: React 19
- Styling: Tailwind CSS v4
- UI Components: Shadcn UI (Built on Radix UI primitives)
- Icons: Lucide React
- Notifications: Sonner
- Forms: React State (Controlled Inputs)
The application is deployed and available for testing: https://selise-bus.vercel.app
Run the project locally to see it in action.
-
Clone the repository (if you haven't already)
-
Install dependencies:
npm install # or yarn install # or pnpm install
-
Run the development server:
npm run dev
-
Open the application: Visit http://localhost:3000 in your browser.
- /: The main landing page featuring the interactive bus seat layout.
- /admin: An administrative view to oversee bookings and bus statuses.
The application utilizes a curated color palette and typography to ensure a premium look and feel. It leverages Tailwind's utility classes alongside custom CSS variables for consistent theming.
Verified and updated on 2025-12-13