Getting Started

Get your development environment up and running in minutes.

Prerequisites

Before you begin, ensure you have the following installed:

Node.js >= 20
pnpm >= 10.4.1

Installing pnpm

If you don’t have pnpm installed, you can install it with:

npm install -g pnpm@10.20.0

Or follow the official pnpm installation guide.

Installation

1. Clone the Repository

git clone https://github.com/uwdsc/uwdsc-website-v3.git
cd uwdsc-website-v3

2. Install Dependencies

pnpm install

This will install all dependencies for all packages and apps in the monorepo. Thanks to pnpm workspaces, shared dependencies are efficiently linked.

3. Set Up Environment Variables

Each app may require environment variables. Check for .env.example files in:

apps/web/.env.example
apps/cxc/.env.example

Copy the example files and fill in your values:

cp apps/web/.env.example apps/web/.env.local
cp apps/cxc/.env.example apps/cxc/.env.local

Running the Apps

Start All Apps

pnpm dev

This will start all applications in development mode:

Start Specific Apps

If you only want to work on a specific app:

# Main website only
pnpm dev:web
 
# CxC app only
pnpm dev:cxc
 
# Documentation only
pnpm dev:docs

Building for Production

Build All Packages

pnpm build

Build Specific App

pnpm build --filter=web
pnpm build --filter=cxc
pnpm build --filter=docs

Common Commands

# Development
pnpm dev                    # Start all apps
pnpm dev:web               # Start main website only
pnpm dev:cxc               # Start CxC app only
pnpm dev:docs              # Start documentation only
 
# Building
pnpm build                 # Build all packages
 
# Code Quality
pnpm lint                  # Lint all packages
pnpm format                # Format code with Prettier
 
# UI Components
pnpm ui:add button         # Add shadcn button component
pnpm ui:add form           # Add shadcn form components

Next Steps

Learn about the Architecture of the monorepo
Follow our Guides for common development tasks
Explore the Packages documentation

Troubleshooting

Port Already in Use

If you get an error that a port is already in use, you can either:

Kill the process using that port
Change the port in the app’s package.json dev script

pnpm Installation Issues

If you encounter issues with pnpm, try:

# Clear pnpm cache
pnpm store prune
 
# Reinstall dependencies
rm -rf node_modules
rm pnpm-lock.yaml
pnpm install

TypeScript Errors

If you see TypeScript errors, try:

# Clean and rebuild
pnpm clean
pnpm build

Introduction Overview