Simple, fair, personal — that's KeyLine.

Hassle-free car rental in Dubai. Browse cars, send a WhatsApp, and drive away.

Live Demo — Try it live

---

Screenshots

English	العربية

Features

• Multilingual — English, French, Arabic with full RTL support
• WhatsApp Integration — Book any car with a single WhatsApp message
• Google Sheets CMS — Manage fleet, reviews, and FAQs via Google Sheets
• Compare Cars — Side-by-side comparison of up to 3 vehicles
• Responsive — Mobile-first design, looks great on all screens
• SEO Optimized — Metadata, sitemap, and robots configuration

Tech Stack

Technology	Purpose
Next.js 16	React framework (App Router)
React 19	UI library
TypeScript	Type safety
Tailwind CSS 4	Utility-first styling
Framer Motion	Animations
next-intl	Internationalization
Lucide	Icons

Getting Started

npm install
npm run dev

Build

npm run build
npm start

Project Structure

src/
├── app/
│   ├── [locale]/          # Routes (home, cars, about, reviews, contact)
│   ├── layout.tsx         # Root layout (fonts)
│   ├── globals.css        # Global styles & theme tokens
│   ├── robots.ts          # SEO robots
│   └── sitemap.ts         # XML sitemap
├── components/
│   ├── sections/          # Page sections (Hero, Fleet, Reviews, etc.)
│   ├── Header.tsx         # Navigation header
│   └── decorations.tsx    # Geometric patterns
├── lib/
│   ├── sheets.ts          # Google Sheets API client
│   ├── utils.ts           # Tailwind merge utility
│   └── whatsapp.ts        # WhatsApp deep link builder
├── messages/              # Translation files (en, fr, ar)
└── types/                 # TypeScript types

Deployment

Deploy on Vercel:

Set environment variables in Vercel dashboard:

Variable	Description
GOOGLE_SHEETS_ID	Google Sheets document ID
GOOGLE_API_KEY	Google API key with Sheets scope
NEXT_PUBLIC_WHATSAPP_NUMBER	WhatsApp business number
NEXT_PUBLIC_SITE_URL	Production URL

---

Live Demo · Built with Next.js · © KeyLine Rentals