denshooter/portfolio

Fork 0

Files

denshooter af48303c94 update

2025-09-08 08:15:58 +02:00

5.3 KiB

Raw Blame History

🚀 Development Environment Setup

This document explains how to set up and use the development environment for the portfolio project.

✨ Features

Automatic Database Setup: PostgreSQL and Redis start automatically
Hot Reload: Next.js development server with hot reload
Database Integration: Real database integration for email management
Modern Admin Dashboard: Completely redesigned admin interface
Minimal Setup: Only essential services for fast development

🛠️ Quick Start

Prerequisites

Node.js 18+
Docker & Docker Compose
npm or yarn

1. Install Dependencies

npm install

2. Start Development Environment

Option A: Full Development Environment (with Docker)

npm run dev

This single command will:

Start PostgreSQL database
Start Redis cache
Start Next.js development server
Set up all environment variables

Option B: Simple Development Mode (without Docker)

npm run dev:simple

This starts only the Next.js development server without Docker services. Use this if you don't have Docker installed or want a faster startup.

3. Access Services

Portfolio: http://localhost:3000
Admin Dashboard: http://localhost:3000/admin
PostgreSQL: localhost:5432
Redis: localhost:6379

📧 Email Testing

The development environment supports email functionality:

Send emails through the contact form or admin panel
Emails are sent directly (configure SMTP in production)
Check console logs for email debugging

🗄️ Database

Development Database

Host: localhost:5432
Database: portfolio_dev
User: portfolio_user
Password: portfolio_dev_pass

Database Commands

# Generate Prisma client
npm run db:generate

# Push schema changes
npm run db:push

# Seed database with sample data
npm run db:seed

# Open Prisma Studio
npm run db:studio

# Reset database
npm run db:reset

🎨 Admin Dashboard

The new admin dashboard includes:

Overview: Statistics and recent activity
Projects: Manage portfolio projects
Emails: Handle contact form submissions with beautiful templates
Analytics: View performance metrics
Settings: Import/export functionality

Email Templates

Three beautiful email templates are available:

Welcome Template (Green): Friendly greeting with portfolio links
Project Template (Purple): Professional project discussion response
Quick Template (Orange): Fast acknowledgment response

🔧 Environment Variables

Create a .env.local file:

# Development Database
DATABASE_URL="postgresql://portfolio_user:portfolio_dev_pass@localhost:5432/portfolio_dev?schema=public"

# Redis
REDIS_URL="redis://localhost:6379"

# Email (for production)
MY_EMAIL=contact@dk0.dev
MY_PASSWORD=your-email-password

# Application
NEXT_PUBLIC_BASE_URL=http://localhost:3000
NODE_ENV=development

🛑 Stopping the Environment

Use Ctrl+C to stop all services, or:

# Stop Docker services only
npm run docker:dev:down

🐳 Docker Commands

# Start only database services
npm run docker:dev

# Stop database services
npm run docker:dev:down

# View logs
docker compose -f docker-compose.dev.minimal.yml logs -f

📁 Project Structure

├── docker-compose.dev.minimal.yml  # Minimal development services
├── scripts/
│   ├── dev-minimal.js       # Main development script
│   ├── dev-simple.js        # Simple development script
│   ├── setup-database.js    # Database setup script
│   └── init-db.sql          # Database initialization
├── app/
│   ├── admin/               # Admin dashboard
│   ├── api/
│   │   ├── contacts/        # Contact management API
│   │   └── email/           # Email sending API
│   └── components/
│       ├── ModernAdminDashboard.tsx
│       ├── EmailManager.tsx
│       └── EmailResponder.tsx
└── prisma/
    └── schema.prisma        # Database schema

🚨 Troubleshooting

Docker Compose Not Found

If you get the error spawn docker compose ENOENT:

# Try the simple dev mode instead
npm run dev:simple

# Or install Docker Desktop
# Download from: https://www.docker.com/products/docker-desktop

Port Conflicts

If ports are already in use:

# Check what's using the ports
lsof -i :3000
lsof -i :5432
lsof -i :6379

# Kill processes if needed
kill -9 <PID>

Database Connection Issues

# Restart database services
npm run docker:dev:down
npm run docker:dev

# Check database status
docker compose -f docker-compose.dev.minimal.yml ps

Email Not Working

Verify environment variables
Check browser console for errors
Ensure SMTP is configured for production

🎯 Production Deployment

For production deployment, use:

npm run build
npm run start

The production environment uses the production Docker Compose configuration.

📝 Notes

The development environment automatically creates sample data
Database changes are persisted in Docker volumes
Hot reload works for all components and API routes
Minimal setup for fast development startup

🔗 Links

Portfolio: https://dk0.dev
Admin: https://dk0.dev/admin
GitHub: https://github.com/denniskonkol/portfolio

5.3 KiB Raw Blame History