Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Codefied-CodePix/KaroCar-platform/llms.txt

Use this file to discover all available pages before exploring further.

The web app is the public-facing KaroCar website — the front door of the entire platform. Built with Next.js 16 and Tailwind CSS v4, it delivers the marketing homepage and serves as the primary entry point for visitors discovering KaroCar services. The root layout (layout.tsx) loads the Geist and Geist Mono Google fonts via next/font, wires up global styles, and wraps every page in a flex column to ensure full-height rendering across light and dark modes.

​
Tech Stack

Next.js 16.2.7

App Router with server components, file-based routing, and the latest Next.js performance optimisations.

React 19.2.4

The latest stable React with concurrent features and improved hydration.

Tailwind CSS v4

Utility-first CSS with the new v4 engine powered by @tailwindcss/postcss.

TypeScript 5

Strict type-checking across all source files with shared tsconfig from the monorepo root.

​
Directory Structure

apps/web/
├── app/
│   ├── layout.tsx    # Root layout with Geist font
│   ├── page.tsx      # Homepage
│   └── globals.css   # Global styles
├── public/           # Static assets
├── package.json
├── next.config.ts
└── tsconfig.json
The homepage (app/page.tsx) renders the KaroCar Website heading alongside the Next.js logo and action links. The root layout initialises the Geist Sans and Geist Mono font variables and applies antialiased rendering to the body.

​
Package Configuration

Below is the package.json for the web app. It has no internal workspace dependencies — all shared tooling comes through dev dependencies. 
{
  "name": "web",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "eslint"
  },
  "dependencies": {
    "next": "16.2.7",
    "react": "19.2.4",
    "react-dom": "19.2.4"
  },
  "devDependencies": {
    "@tailwindcss/postcss": "^4",
    "@types/node": "^20",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "eslint": "^9",
    "eslint-config-next": "16.2.7",
    "tailwindcss": "^4",
    "typescript": "^5"
  }
}

​
Development Commands

Start the development server for the web app using either the global monorepo command or a filtered Turborepo invocation: 
pnpm dev
Use --filter=web to spin up only the web app and skip starting the admin, auth, customer, vendor, and corporate dev servers. This significantly reduces cold-start time and memory usage during front-end development.
The development server starts on port 3000 by default (Next.js standard). If port 3000 is already occupied, Next.js will automatically increment to the next available port and log the URL in the terminal.

​
Building & Starting

Run a production build and then serve it with the Next.js production server: 
turbo build --filter=web && turbo start --filter=web
1

Install dependencies

From the monorepo root, run pnpm install to ensure all workspace packages are linked.
2

Build the app

Run turbo build --filter=web. Turborepo caches the output in .turbo/ so subsequent builds only rebuild changed files.
3

Start the production server

Run turbo start --filter=web. The app will be available at http://localhost:3000.

​
Linting

pnpm --filter web lint
# or
turbo lint --filter=web
ESLint is configured via the shared @karo-car/eslint-config package at the monorepo root. See ESLint Config for the full rule set.

Monorepo Structure

Understand how all six apps fit together in the Turborepo workspace.

Local Setup

First-time setup guide for getting the full platform running locally.

Building

Deep-dive into Turborepo build pipelines and caching strategies.

Remote Caching

Speed up CI/CD with Turborepo remote cache.

Build docs developers (and LLMs) love

Get started for freeTalk to us