Portfolio

Michael Winter's portfolio website - a Nuxt 3 application.

⚠️ Important

This portfolio contains the majority of my life's work - compositions, performances, publications, and research.

Before making any changes:

• Ensure you have a backup
• Test changes in development first
• Be careful with data deletions

Overview

• Framework: Nuxt 4 (Vue 3, TypeScript, Tailwind CSS)
• Data: JSON files in server/data/
• Admin: Password-protected admin panel at /admin

Prerequisites

• Node.js 22+
• npm

Quick Start

# 1. Install dependencies
npm install

# 2. Create .env file
cp .env_template .env
# Edit .env with your values

# 3. Start development server
npm run dev

Environment Variables (.env)

Variable	Description	Example
PASSWORD	Admin password	************

Development

npm run dev          # Start development server
npm run build        # Build for production
npm run generate     # Generate static site
npm run preview      # Preview production build

Docker Deployment

The portfolio runs in Docker as part of the main unboundedpress stack.

Build & Start

cd ..
docker compose up -d portfolio

Updating Admin Password

1. Edit .env in main repo:

   PASSWORD=your_new_password
   

2. Rebuild and restart:

   docker compose up -d --build portfolio
   

Data Management

Data is stored in JSON files in server/data/:

• works.json - Musical works
• events.json - Events and performances
• publications.json - Publications
• resume.json - CV/resume
• talks.json - Talks and lectures
• releases.json - Album releases
• album_art/ - Album cover images
• scores/ - PDF scores
• images/ - Gallery images

Editing Data

1. Via Admin Panel: Visit /admin and login
2. Direct JSON Edit: Edit files in server/data/ directly

Project Structure

portfolio/
├── server/
│   ├── api/           # Server API routes
│   └── data/          # JSON data files
├── pages/             # Vue pages (file-based routing)
├── components/        # Vue components
├── layouts/           # Layout components
├── public/            # Static assets (scores, images)
├── stores/           # Pinia stores
├── .env               # Environment variables (not in repo)
└── .env_template     # Template for .env

Tech Stack

• Nuxt
• Vue 3
• Tailwind CSS
• Pinia
• Nuxt Image
• Headless UI