Create a README.md file detailing project setup, environment variables, database configuration, and local execution instructions. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 6f3329ae-2dcc-46cc-bf2e-f58b7a5fa805 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 76296a72-8a57-4b1e-b2e7-91efe1a1c77a Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/e678fe28-87ab-4437-945b-7a15e872a292/6f3329ae-2dcc-46cc-bf2e-f58b7a5fa805/vRxTy2Z Replit-Helium-Checkpoint-Created: true
118 lines
3.0 KiB
Markdown
118 lines
3.0 KiB
Markdown
# Joachim Hummel – Portfolio
|
||
|
||
Personal portfolio website for Joachim Hummel — Senior IT-Consultant, DevOps Engineer, KI-Automation Experte.
|
||
|
||
Built with React + Vite (frontend) and Express 5 (API), running as a pnpm monorepo.
|
||
|
||
---
|
||
|
||
## Prerequisites
|
||
|
||
- **Node.js** 24+
|
||
- **pnpm** 10+ — install via `npm install -g pnpm`
|
||
- **PostgreSQL** 14+ — local installation or a hosted instance (e.g. Supabase, Neon, Railway)
|
||
|
||
---
|
||
|
||
## Installation
|
||
|
||
```bash
|
||
# 1. Clone the repository
|
||
git clone <repo-url>
|
||
cd <repo-folder>
|
||
|
||
# 2. Install all workspace dependencies
|
||
pnpm install
|
||
```
|
||
|
||
---
|
||
|
||
## Environment Variables
|
||
|
||
Create a `.env` file in the project root (or export the variables in your shell):
|
||
|
||
```env
|
||
# PostgreSQL connection string (required)
|
||
DATABASE_URL=postgresql://user:password@localhost:5432/portfolio
|
||
|
||
# Session secret — any long random string (required)
|
||
SESSION_SECRET=your-very-long-random-secret-here
|
||
|
||
# Brevo (Sendinblue) API key — required for the contact form to send emails
|
||
BREVO_API_KEY=your-brevo-api-key
|
||
```
|
||
|
||
> **Brevo API key:** Sign up for free at [brevo.com](https://www.brevo.com), then generate an API key under *SMTP & API → API Keys*.
|
||
|
||
---
|
||
|
||
## Database Setup
|
||
|
||
Push the schema to your PostgreSQL database (run once, or after schema changes):
|
||
|
||
```bash
|
||
pnpm --filter @workspace/db run push
|
||
```
|
||
|
||
---
|
||
|
||
## Running Locally
|
||
|
||
Start both services in separate terminal windows:
|
||
|
||
```bash
|
||
# Terminal 1 — API server (http://localhost:8080)
|
||
pnpm --filter @workspace/api-server run dev
|
||
|
||
# Terminal 2 — Frontend (http://localhost:23924)
|
||
pnpm --filter @workspace/joachim-portfolio run dev
|
||
```
|
||
|
||
Open **http://localhost:23924** in your browser.
|
||
|
||
---
|
||
|
||
## Project Structure
|
||
|
||
```
|
||
artifacts/
|
||
api-server/ # Express 5 API — contact form, health check
|
||
joachim-portfolio/ # React + Vite frontend (portfolio site)
|
||
lib/
|
||
db/ # Drizzle ORM schema & migrations
|
||
api-spec/ # OpenAPI spec + generated client hooks
|
||
api-client-react/ # Generated React Query hooks (from Orval)
|
||
scripts/ # Utility scripts
|
||
```
|
||
|
||
---
|
||
|
||
## Useful Commands
|
||
|
||
| Command | Description |
|
||
|---------|-------------|
|
||
| `pnpm install` | Install all dependencies |
|
||
| `pnpm run typecheck` | Full TypeScript check across all packages |
|
||
| `pnpm run build` | Typecheck + build all packages |
|
||
| `pnpm --filter @workspace/db run push` | Push DB schema changes (dev only) |
|
||
| `pnpm --filter @workspace/api-spec run codegen` | Regenerate API hooks from OpenAPI spec |
|
||
|
||
---
|
||
|
||
## Production Build
|
||
|
||
```bash
|
||
# Build frontend static files
|
||
pnpm --filter @workspace/joachim-portfolio run build
|
||
# Output: artifacts/joachim-portfolio/dist/public
|
||
|
||
# Build API server
|
||
pnpm --filter @workspace/api-server run build
|
||
# Output: artifacts/api-server/dist/index.mjs
|
||
|
||
# Start API server in production
|
||
NODE_ENV=production PORT=8080 node --enable-source-maps artifacts/api-server/dist/index.mjs
|
||
```
|
||
|
||
Serve the frontend's `dist/public` folder via any static file server (Nginx, Caddy, etc.) and proxy `/api/*` requests to the API server.
|