Sebastian Krüger
365b8ed328
Add complete Docker containerization and CI/CD setup: Docker Configuration: - Multi-stage Dockerfile with 3 stages (deps, builder, runner) - Stage 1: Install dependencies with pnpm in Alpine - Stage 2: Build Next.js static export - Stage 3: Serve static files with nginx:alpine - Health check endpoint on /health - Optimized for production with layer caching Nginx Configuration: - Custom nginx.conf for static file serving - Gzip compression enabled - Security headers (X-Frame-Options, X-Content-Type-Options, etc.) - Static asset caching with 1-year expiry - Client-side routing support (try_files) - Health check endpoint for container orchestration - Error page handling GitHub Workflow (docker-build-push.yml): - Triggers on push to main, tags, and pull requests - Multi-platform builds (linux/amd64, linux/arm64) - Pushes to GitHub Container Registry (ghcr.io) - Automatic tagging: latest, semver, sha, branch - Uses GitHub Actions cache for faster builds - Requires only GITHUB_TOKEN (no secrets needed) .dockerignore: - Excludes node_modules, .next, build artifacts - Excludes dev files, logs, and IDE configs - Keeps Docker image size minimal Image will be available at: ghcr.io/valknarness/units-ui:latest 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Unit Converter
A spectacular, innovative unit conversion application built with modern web technologies to provide the best user experience for converting between various measurement units.
Tech Stack
- Next.js 16 - React framework with App Router and static export
- TypeScript - Type-safe development
- Tailwind CSS 4 - Modern utility-first CSS framework
- convert-units - Comprehensive unit conversion library
Features
Supported Units
23 measurement categories with 187 individual units:
- Angle, Apparent Power, Area, Current, Digital
- Each, Energy, Frequency, Illuminance, Length
- Mass, Pace, Parts Per, Power, Pressure
- Reactive Energy, Reactive Power, Speed, Temperature
- Time, Voltage, Volume, Volume Flow Rate
Innovative UX Features
- Real-time bidirectional conversion
- Smart context-aware interface with fuzzy search
- Visual comparison with color-coded categories
- Keyboard shortcuts for power users
- Mobile-first responsive design
- Conversion history with localStorage
- Dark mode support
Getting Started
Prerequisites
- Node.js 18+ or 20+
- pnpm (recommended) or npm
Installation
# Install dependencies
pnpm install
# Run development server
pnpm dev
# Build for production
pnpm build
# Start production server
pnpm start
Open http://localhost:3000 to see the app.
Project Structure
units-ui/
├── app/ # Next.js App Router
│ ├── layout.tsx # Root layout
│ ├── page.tsx # Home page
│ └── globals.css # Global styles
├── components/ # React components (coming soon)
├── lib/ # Utility functions (coming soon)
├── public/ # Static assets
└── IMPLEMENTATION_PLAN.md # Detailed implementation plan
Development
See IMPLEMENTATION_PLAN.md for the complete development roadmap.
License
MIT
Built with Next.js 16, Tailwind CSS 4, and convert-units