A modern full-stack web application built with React Router v7, Convex, and Better Auth.

Tech Stack

• Frontend: React Router v7 with TypeScript
• Backend: Convex (real-time database & serverless functions)
• Authentication: Better Auth
• Styling: TailwindCSS + Radix UI components
• Build Tool: Vite
• Package Manager: Bun

Features

• � Complete authentication system (sign in/up, password reset)
• 🎨 Modern UI with dark/light mode toggle
• 📱 Responsive design
• ⚡ Real-time data synchronization with Convex
• 🔒 Type-safe throughout with TypeScript
• � Protected routes and dashboard

Quick Start

1. Install dependencies

   bun install

2. Set up environment variables

   # Copy and configure your environment variables
   cp .env.example .env.local

3. Start the development servers

   # Terminal 1: Start Convex backend
   bun run dev:db
   
   # Terminal 2: Start React Router dev server
   bun run dev

4. Open your browser Navigate to http://localhost:5173

Project Structure

app/
├── routes/           # Application routes
├── components/       # Reusable UI components
├── hooks/           # Custom React hooks
└── lib/             # Utilities and configurations

convex/              # Backend schema and functions

Deployment

Build for production:

bun run build

docker build -t my-app .

# Run the container
docker run -p 3000:3000 my-app

The containerized application can be deployed to any platform that supports Docker, including:

• AWS ECS
• Google Cloud Run
• Azure Container Apps
• Digital Ocean App Platform
• Fly.io
• Railway

DIY Deployment

If you're familiar with deploying Node applications, the built-in app server is production-ready.

Make sure to deploy the output of npm run build

├── package.json
├── package-lock.json (or pnpm-lock.yaml, or bun.lockb)
├── build/
│   ├── client/    # Static assets
│   └── server/    # Server-side code

Styling

This template comes with Tailwind CSS already configured for a simple default starting experience. You can use whatever CSS framework you prefer.

---

Built with ❤️ using React Router.