This guide walks you through setting up a full local development environment for YouEyeSea — from cloning the repository to running the app and building for production.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/alexjohntomy/you-eye-sea/llms.txt
Use this file to discover all available pages before exploring further.
Prerequisites
- Node.js 18 or later — check with
node --version - npm — bundled with Node.js
- PostgreSQL — a running instance with a database you can connect to
Clone and install
Install dependencies
postinstall script runs prisma generate automatically, so the Prisma client is ready as soon as npm install completes.Set environment variables
Create a See Database setup for full details on configuring Postgres and running migrations.
.env file in the project root with your database connection string:Start the dev server
Key environment variables
| Variable | Required | Description |
|---|---|---|
DATABASE_URL | Yes | Postgres connection string used by Prisma |
.env at the project root. The app reads them at runtime via dotenv/config.
Available scripts
| Command | Description |
|---|---|
npm run dev | Start the Next.js development server with hot reload |
npm run build | Build the app for production |
npm start | Start the production server (requires a prior build) |
npm run lint | Run ESLint across the project |
npm run generate-cache | Regenerate the static search cache files from the database |
npx prisma db seed | Seed the database from CSVs in prisma/grade_distribution_data/ |
Build and run in production mode
.next/. Run this locally to verify the app behaves correctly before deploying.
Linting
eslint-config-next and eslint-config-prettier. Fix all lint errors before opening a pull request.
Tech stack overview
| Layer | Technology |
|---|---|
| Framework | Next.js 16 (App Router) |
| Language | TypeScript |
| Styling | Tailwind CSS 4 |
| UI components | shadcn/ui, Radix UI primitives |
| Charts | Recharts |
| ORM | Prisma 7 |
| Database | PostgreSQL |
| Search | MiniSearch (client-side fuzzy search) |
| CSV parsing | PapaParse (seed script only) |
| Animation | Motion |
| Fonts | Manrope via @fontsource/manrope |
Development-only tooling
react-grab is included as a dev dependency and is loaded only in development mode. It provides a visual element inspector for layout debugging. It does not appear in production builds.
Loading data
If you’re starting fresh, you’ll need to seed your database before the app shows any courses. See the guides below:Database setup
Apply Prisma migrations and configure connection pooling.
Data ingestion
Download UIC CSVs and run the seed script to populate grade data.