Skip to main content

Prerequisites

Before you begin, ensure you have the following installed on your system:
  • Node.js - Version 20.19.3 or higher
  • pnpm - Package manager
  • Docker - For running Supabase locally
  • Supabase CLI - For local database management
  • Git - Version control
You can use nvm (Node Version Manager) to install and manage Node versions easily.

Installation

1

Fork and Clone the Repository

Fork the ClassroomIO repository on GitHub, then clone your fork:
git clone https://github.com/YOUR_USERNAME/classroomio.git
cd classroomio
2

Set Up Node Version

If you’re using nvm, set the correct Node version:
nvm use
If the version isn’t installed, install it first:
nvm install && nvm use
3

Install Dependencies

Install all project dependencies using pnpm:
pnpm i
4

Set Up Environment Variables

Create .env files in both apps/dashboard and apps/api directories:
# In apps/dashboard
cp apps/dashboard/.env.example apps/dashboard/.env

# In apps/api
cp apps/api/.env.example apps/api/.env
Don’t worry about populating the Supabase variables yet - we’ll get those in the next step.
5

Start Supabase

Ensure Docker is running, then start the local Supabase instance:
supabase start
You should see output like this:
supabase local development setup is running.

     API URL: http://127.0.0.1:54321
GraphQL URL: http://127.0.0.1:54321/graphql/v1
      DB URL: postgresql://postgres:[email protected]:54322/postgres
  Studio URL: http://127.0.0.1:54323
Inbucket URL: http://127.0.0.1:54324
  JWT secret: super-secret-jwt-token-with-at-least-32-characters-long
    anon key: eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
service_role key: eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
6

Configure Supabase Environment Variables

Add the Supabase environment variables to apps/dashboard/.env:
PUBLIC_SUPABASE_URL=<API URL>
PUBLIC_SUPABASE_ANON_KEY=<anon key>
PRIVATE_SUPABASE_SERVICE_ROLE=<service_role key>
Use the values from the supabase start output.

Running the Development Server

Run All Projects

To start all projects simultaneously in development mode:
pnpm dev
This will start all applications:

Run Specific Projects

If you only want to work on a specific application:
pnpm dev --filter=@cio/dashboard

Other Useful Commands

Build all projects
pnpm build
Run linter
pnpm lint
Format code
pnpm format
Clean all dependencies and build artifacts
pnpm clean
Start production build
pnpm start

Testing Your Setup

1

Access the Dashboard

2

Login with Demo Account

Use these credentials:
3

Explore Supabase Studio

Open the Supabase Studio URL (from the supabase start output) to view and manage your local database.
To learn more about demo accounts and testing, visit the demo accounts guide.

Troubleshooting

Make sure Docker is running and you have enough disk space. Try stopping all containers and restarting:
supabase stop
supabase start
If you get port conflict errors, check if other services are using the default ports (5173, 3002, 5174, 3000, 54321-54324). Stop those services or configure different ports in your project.
Clear your pnpm cache and try again:
pnpm clean:pnpm
pnpm i

Next Steps

Now that your development environment is set up, learn about the project structure:

Project Structure

Understand how the ClassroomIO codebase is organized

Build docs developers (and LLMs) love