M'S Car Rent is a full car rental platform covering the whole rental lifecycle: customers browse and book cars, employees manage the fleet, and managers oversee agencies and branches. This post walks through how it was built and the decisions that mattered most. You can see the live project here.
The core problem
Traditional rental agencies run on phone calls and spreadsheets. Availability is a guess, bookings can double up, and there is no shared source of truth between branches. The application had to replace that with a single system where availability, pricing, and reservations are always current.
Architecture: four roles, four experiences
The defining decision was structuring everything around roles from the start:
- Visitor — browse the fleet, no account required
- Customer — book cars, view their reservations, receive notifications
- Employee — manage cars, process pickups and returns
- Manager — oversee agencies, branches, pricing, and reports
Tech stack
The stack is deliberately boring: Next.js with React and TypeScript on the front, Tailwind CSS for styling, and Prisma with MySQL for persistence. Next.js gives server rendering for public pages (good for SEO on car listings) and API routes for mutations, while Prisma keeps the data layer type-safe end to end.
// Prisma makes booking queries type-safe across the whole app
const availableCars = await prisma.car.findMany({
where: { status: "AVAILABLE", bookings: { none: overlap } },
});Handling the hard parts
Booking conflicts
Two customers must never hold the same car for overlapping dates. The check runs against existing reservations before a booking is created, so a car is only offered when no existing reservation overlaps the requested range.
Multilingual content (Arabic, French, English)
The app ships in Arabic, French, and English. Arabic requires a right-to-left layout, so directionality is handled globally rather than per-component — mirrored navigation, text alignment, and icon placement flip together. All strings live in translation files, so adding a language never touches component code.
Fleet and agency management
Cars belong to branches, branches belong to agencies. That hierarchy makes it possible to answer operational questions like "which cars are free at this branch next week?" with a single query.
What I learned
- Roles at the schema level pay off immediately — permissions stay consistent across every screen.
- Internationalization must be an early architectural decision — retrofitting RTL is painful.
- Real-time status builds trust — seeing a car flip from available to reserved instantly reassures the customer.
Wrapping up
The full feature list, stack, and screenshots are on the M'S Car Rent project page. If you are planning something similar, browse the other projects or send a message.