Quick Start
Get Portfolio OS up and running in 15 minutes
Overview
Get Portfolio OS up and running in 15 minutes
Get Portfolio OS running on your local machine in just a few minutes. This guide will walk you through the essential setup steps.
Note:
Estimated Time: 15-20 minutes to have your development environment fully operational with all three apps running.
What You'll Build
Portfolio OS is a production-ready monorepo that includes:
Portfolio Site
Public-facing portfolio, blog, and projects showcase
Admin Dashboard
Content management and analytics dashboard
Shared Packages
Reusable UI components, utilities, and integrations
Prerequisites Checklist
Before you begin, ensure you have:
- Node.js 18+ installed (Download)
- PNPM package manager (Installation Guide)
- Git for version control
- A code editor (VS Code recommended)
Note:
Already have the prerequisites? Skip to Installation Steps below.
Installation Steps
Clone the Repository
git clone https://github.com/jschibelli/portfolio-os.git
cd portfolio-os
Install Dependencies
pnpm install
This will install all packages across the monorepo using PNPM workspaces.
Setup Environment Variables
# Copy environment templates
cp apps/site/env.template apps/site/.env.local
cp apps/dashboard/env.template apps/dashboard/.env.local
Edit the .env.local files with your API keys. See Environment Configuration for details.
Generate Prisma Client
cd apps/dashboard
pnpm prisma generate
cd ../..
This generates the TypeScript types for database access in the dashboard.
Start Development Servers
pnpm dev
All apps will start in parallel:
- Site: http://localhost:3000
- Docs: http://localhost:3001
- Dashboard: http://localhost:3003
Note:
🎉 Success! Your Portfolio OS development environment is ready. Open your browser to see the apps running.
Next Steps
Now that you have Portfolio OS running, explore these guides:
First Steps Tutorial
Learn the basics by building your first feature
Architecture Overview
Understand how the system is structured
Multi-Agent Setup
Configure the multi-agent development system
Common Issues
Note:
Port Already in Use? If ports 3000, 3001, or 3003 are busy, stop the conflicting process or change ports in the respective app's next.config.js.
Having trouble? Check our Troubleshooting Guide or see detailed Installation & Prerequisites.
Available Scripts
| Command | Description |
|---|---|
pnpm dev | Start all apps in development mode |
pnpm build | Build all packages and apps for production |
pnpm lint | Run ESLint across the workspace |
pnpm test | Run all test suites |
pnpm typecheck | Type check all TypeScript code |
Note:
For a deeper dive into the tech stack, architecture patterns, and development workflow, continue to the Developer Guide.