Quick Setup Guide

Getting Started

Get your hackathon project up and running in under 2 minutes. This guide will take you from clone to deployed app.

Clone & Install
~30 seconds
Get the starter code and install dependencies
git clone https://github.com/zainjoyce/ctrlaltcreate-starter.git cd ctrlaltcreate-starter npm install
Start Development
~10 seconds
Launch the development server
npm run dev
Test API Routes
~30 seconds
Try the pre-built API endpoints
curl http://localhost:3000/api/health
Deploy
~2 minutes
Push to GitHub and deploy to Vercel
git push origin main # Connect to Vercel for auto-deploy
What's Included
Everything you need for a modern web application
Next.js 15 with App Router
TypeScript with strict mode
Tailwind CSS 4 with design tokens
19+ shadcn/ui components
React Hook Form + Zod validation
Supabase integration with CRUD API
Resend email with templates
ESLint + Prettier configured
Dark/light mode support
Responsive sidebar layout
Pre-built API routes
One-click Vercel deployment
Project Structure
Understanding the folder organization
ctrlaltcreate-starter/
├── app/                    # Next.js App Router pages
│   ├── api/               # API routes (NEW!)
│   │   ├── data/         # Supabase CRUD operations
│   │   ├── email/        # Email sending with Resend
│   │   └── health/       # Health check endpoint
│   ├── components/        # Component showcase
│   ├── docs/             # Documentation
│   ├── forms/            # Form examples
│   ├── styling/          # Design system
│   ├── layout.tsx        # Root layout
│   └── page.tsx          # Homepage
├── components/
│   ├── ui/               # shadcn/ui components (19+)
│   └── layout/           # Layout components
├── lib/
│   ├── supabase.ts       # Supabase utilities (NEW!)
│   └── utils.ts          # Helper functions
├── hooks/                # Custom React hooks
└── public/               # Static assets
Next Steps
Customize the starter for your specific needs

Configure Supabase (Optional)

Set up your Supabase project for database and auth

Copy .env.example to .env.local and add your Supabase keysLearn More

Set Up Email Sending (Optional)

Configure Resend for transactional emails

Add RESEND_API_KEY to .env.localLearn More

Customize Your Theme

Edit colors and design tokens in app/globals.css

Learn More

Add More Components

Use shadcn/ui CLI to add additional components

npx shadcn@latest add [component-name]