Node.js & pnpm
# Install Node.js 20+ via nvm
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash
nvm install 20
nvm use 20
# Install pnpm
npm install -g pnpm
VS Code
Download from code.visualstudio.comEssential extensions:
- ESLint
- Prettier
- Tailwind CSS IntelliSense
- Prisma
- GitLens
Claude Code Terminal
# Install Claude CLI
npm install -g @anthropic/claude-cli
# Verify installation
claude --version
Git Configuration
git config --global user.name "Your Name"
git config --global user.email "[email protected]"
git config --global init.defaultBranch main
Development Stack
VS Code Settings
{
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"typescript.preferences.importModuleSpecifier": "relative",
"typescript.updateImportsOnFileMove.enabled": "always",
"tailwindCSS.experimental.classRegex": [
["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
["cx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
]
}
Project Configuration
TypeScript Config
{
"compilerOptions": {
"target": "ES2022",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",
"incremental": true,
"noUncheckedIndexedAccess": true,
"paths": {
"@/*": ["./src/*"]
}
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
"exclude": ["node_modules"]
}
ESLint & Prettier
module.exports = {
extends: [
'next/core-web-vitals',
'prettier'
],
rules: {
'@typescript-eslint/no-unused-vars': 'error',
'@typescript-eslint/no-explicit-any': 'warn',
'react/no-unescaped-entities': 'off'
}
}
{
"semi": false,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "es5",
"printWidth": 80,
"plugins": ["prettier-plugin-tailwindcss"]
}
Git Hooks
# Install husky and lint-staged
pnpm add -D husky lint-staged
pnpm husky init
# Configure pre-commit hook
echo "pnpm lint-staged" > .husky/pre-commit
{
"lint-staged": {
"*.{js,jsx,ts,tsx}": [
"eslint --fix",
"prettier --write"
],
"*.{json,md,mdx}": [
"prettier --write"
]
}
}
Environment Variables
Local Development
# Supabase
NEXT_PUBLIC_SUPABASE_URL=https://[project].supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJ...
SUPABASE_SERVICE_KEY=eyJ...
# AI Services
OPENAI_API_KEY=sk-...
LANGCHAIN_API_KEY=ls_...
TOGETHER_API_KEY=...
# Monitoring
SENTRY_DSN=https://...
NEXT_PUBLIC_SENTRY_DSN=https://...
# Feature Flags
NEXT_PUBLIC_ENABLE_AI=true
Never commit .env.local files. Use .env.example as a template and store actual values in 1Password or environment-specific vaults.
Database Setup
Install Supabase CLI
brew install supabase/tap/supabase
Link Project
supabase link --project-ref [project-ref]
Unit Testing
pnpm add -D vitest @testing-library/react
E2E Testing
pnpm add -D playwright @playwright/test
Troubleshooting
npm install -g pnpm
# Or via corepack
corepack enable
corepack prepare pnpm@latest --activate
# Fix npm permissions
mkdir ~/.npm-global
npm config set prefix '~/.npm-global'
echo 'export PATH=~/.npm-global/bin:$PATH' >> ~/.zshrc
source ~/.zshrc
# Find and kill process
lsof -i :3000
kill -9 [PID]
# Or use different port
PORT=3001 pnpm dev
Next Steps
Join Slack
Connect with the team in #dev channel
Read Driver Docs
Review claude.md, plan.md, and agents.md in the repo