A modern, professional CV website built with React and Node.js, featuring visitor analytics, PDF export, and containerized deployment.

• ✨ Modern Professional Design - Clean, readable layout with no bright colors
• 📄 PDF Export - Download CV as PDF with one click
• 📊 Visitor Analytics - Track page views, unique visitors, and access patterns
• 🖼️ Profile Picture Upload - Easy profile picture management
• 📱 Responsive Design - Works perfectly on all devices
• 🐳 Containerized - Ready for Docker deployment
• ⚡ Easy Updates - JSON-based CV data for quick modifications

1. Install All Dependencies

   npm run setup

   This will install dependencies for the main project, server, and client.

1. Start Development Server

   npm run dev

2. Access the Application

   • CV Website: http://localhost:3000
   • Backend API: http://localhost:3001
   • Analytics Dashboard: http://localhost:3000/admin

1. Development with Docker

   docker-compose --profile dev up

2. Production with Docker

   docker-compose up cv-website

3. Production with Nginx (for custom domains)

   # Copy environment template
   cp .env.example .env
   
   # Edit .env with your domain
   # DOMAIN=yourdomain.com
   
   # Start with nginx reverse proxy
   docker-compose --profile production up

If the automatic setup doesn't work:

# Install main dependencies
npm install

# Install server dependencies
cd server
npm install

# Install client dependencies
cd ../client
npm install

# Go back to root
cd ..

# Start development
npm run dev

• Default: Just the CV website (port 3001)
• dev: Development mode with hot reload (ports 3000 + 3001)
• production: Full production setup with Nginx reverse proxy (ports 80 + 443)

1. Netlify (Recommended)

   • Free domain: stefan-cv.netlify.app
   • Free hosting + CI/CD
   • Easy custom domain setup

2. Vercel

   • Free domain: stefan-cv.vercel.app
   • Automatic deployments from Git

3. GitHub Pages

   • Free domain: stefanclaassen.github.io
   • Perfect for static sites

1. Freenom

   • Extensions: .tk, .ml, .ga, .cf
   • 12 months free

2. GitHub Pages Custom

   • Use your repository name as subdomain

# Build the client
cd client
npm run build

# Deploy build folder to Netlify
# Or connect GitHub repository for auto-deployment

# Set your domain
echo "DOMAIN=yourdomain.com" > .env

# Build and start
docker-compose --profile production up -d

# Your site will be available at:
# http://yourdomain.com (port 80)
# https://yourdomain.com (port 443, if SSL configured)

# On your server
git clone <your-repo>
cd CV

# Production build
docker-compose up cv-website -d

# Or with custom domain
docker-compose --profile production up -d

For production with custom domain:

1. Create SSL directory

   mkdir ssl

2. Get SSL certificates (Let's Encrypt recommended)

   # Using certbot
   sudo certbot certonly --standalone -d yourdomain.com
   
   # Copy certificates
   cp /etc/letsencrypt/live/yourdomain.com/fullchain.pem ssl/cert.pem
   cp /etc/letsencrypt/live/yourdomain.com/privkey.pem ssl/key.pem

3. Update nginx.conf - Uncomment HTTPS section

4. Restart services

   docker-compose --profile production restart

stefan-cv/
├── client/                 # React frontend
│   ├── src/
│   │   ├── components/
│   │   │   ├── CVPage.js   # Main CV display
│   │   │   └── AdminPage.js # Analytics dashboard
│   │   ├── App.js          # Main React app
│   │   └── App.css         # Styling
│   └── public/
├── server/                 # Node.js backend
│   ├── index.js           # Express server
│   ├── cv-data.json       # CV content (easily editable)
│   └── package.json
├── data/                  # SQLite database
├── uploads/               # Profile pictures
├── nginx.conf             # Nginx reverse proxy config
├── .env.example          # Environment template
├── Dockerfile
├── docker-compose.yml
└── README.md

• Real-time Tracking: Every page visit is logged with IP, timestamp, user agent, and referrer
• Dashboard: View total visits, unique visitors, daily statistics, and recent visitor details
• Privacy-Focused: Only essential data is collected for analytics

• High Quality: Uses html2canvas and jsPDF for professional PDF generation
• Responsive: Automatically handles page breaks and formatting
• Branded: Maintains visual design and styling in PDF format

Edit server/cv-data.json to update CV content:

{
  "personalInfo": {
    "name": "Your Name",
    "title": "Your Title",
    "email": "your.email@example.com"
  },
  "experience": [...],
  "skills": [...]
}

• Upload via admin dashboard at /admin
• Automatic image optimization and validation
• Secure file handling with size limits

• GET /api/cv-data - Retrieve CV content
• POST /api/cv-data - Update CV content
• POST /api/track-visit - Log visitor analytics
• GET /api/analytics - Get visitor statistics
• POST /api/upload-picture - Upload profile picture

• DOMAIN - Your domain name (default: localhost)
• PORT - Server port (default: 3001)
• NODE_ENV - Environment mode (development/production)

• Rate limiting on API endpoints
• File upload validation and size limits
• CORS protection
• Helmet.js security headers
• Nginx reverse proxy for production

1. 'concurrently' is not recognized

   npm install
   # or
   npm run setup

2. Docker nginx.conf error

   • Make sure nginx.conf exists in project root
   • Check file permissions

3. Ports already in use

   • Kill processes using ports 3000, 3001, 80, 443
   • Or change ports in docker-compose.yml

4. SSL certificate errors

   • Ensure certificates exist in ssl/ directory
   • Check certificate permissions
   • Verify nginx.conf SSL configuration

• CV Updates: Edit JSON file and restart server
• Picture Updates: Use admin dashboard upload feature
• Analytics: Monitor via /admin dashboard
• Backups: Regularly backup data/ folder containing visitor database

MIT License - Feel free to use this project as a template for your own CV website.