Migrate frontend to SvelteKit with comprehensive deployment (#2)
* Migrate frontend to SvelteKit with comprehensive deployment documentation - Create new SvelteKit project structure with routing, stores, and components - Implement complete authentication system with auth store and protected routes - Build all application pages: Home, Login, Register, Dashboard, Games, Stats, Commanders, Profile, and Round Counter - Configure Vite, TailwindCSS, PostCSS, and Nginx for production deployment - Add Dockerfile.svelte for containerized builds with multi-stage optimization - Create comprehensive SVELTE_DEPLOYMENT.md and SVELTE_MIGRATION.md guides - Update deployment scripts and package dependencies for SvelteKit ecosystem * feat: Add user authentication and game tracking pages to EDH Stats Tracker * Migrate frontend to SvelteKit and update Docker configuration - Replace Alpine.js with SvelteKit for improved DX and hot module replacement - Switch frontend service to `Dockerfile.dev` with volume mounts and Vite dev server - Update `docker-compose.yml` to map ports 5173 and use `http://localhost:5173` for CORS - Add `Dockerfile.svelte` for production static builds - Configure Vite proxy to target `http://backend:3000` in containers and `localhost:3002` locally - Migrate existing components to new routes and update authentication store logic - Add Chart.js integration to stats page and handle field name mapping for forms - Include static assets (`fonts/Beleren-Bold.ttf`) and update deployment scripts - Document migration status, testing checklist, and known minor issues in guides * Refactor frontend state properties from snake_case to camelCase This commit standardizes frontend property access across Dashboard, Games, and Stats pages. Changes include: - Renaming API data fields (e.g., `commanderName`, `playerCount`, `winRate`). - Updating `startEdit` logic to normalize mixed snake_case/camelCase inputs. - Replacing template literals like `_player_won` with camelCase versions. - Consistent usage of `totalGames` and `wins` instead of snake_case variants. * Update version to 2.1.12 and refactor commander management - Upgrade application version to 2.1.12 - Add Footer component and include in all pages - Refactor `/commanders` page to fetch commanders and stats separately - Fix commander API endpoint to load all commanders instead of only those with stats - Add stats merging logic to calculate wins, win rate, and avg rounds - Split add/edit command logic into shared `loadCommanders` function - Fix color toggle logic to work with both new and editing command modes - Update API methods for update requests to send `PUT` for existing commanders - Enhance commander delete functionality with proper API response handling - Refactor dashboard and stats pages to reuse shared data loading logic - Add chart cleanup on destroy for both dashboard and stats pages - Implement Chart.js for Win Rate by Color and Player Count charts - Reorganize round counter component state and timer functions - Add localStorage persistence for round counter with pause/resume support - Update game log page to integrate footer component * Refactor auth store and backend to use stable user ID * Backend: Switch user lookup from username to ID in auth routes to maintain stability across username changes. * Frontend: Update user store to reflect ID-based updates. * UI: Refactor user menu Svelte component to use ID-based user data. * Profile: Switch profile page to use ID-based user data for validation and state management. * format date formatting options consistently across dashboard and games pages * format date formatting options consistently across dashboard and games pages * Refactor card action buttons to use icons with semantic text - Switch "Edit" and "Delete" button text to SVG icons in `commanders` and `games` pages - Update icon colors and font styles to match standard design tokens (indigo/red, bold text) - Improve responsive spacing by adding `lg:grid-cols-3` * grids - Clarify hover states and titles for better UX accessibility Bump application versions to 2.2.0 and update deployment configuration * Convert `+page.svelte` to use template strings for multiline strings and fix syntax errors. * Update static version to 2.2.2 and tighten nginx cache headers
This commit is contained in:
22
deploy.sh
22
deploy.sh
@@ -133,7 +133,7 @@ check_github_token() {
|
||||
update_version_file() {
|
||||
print_header "Updating Version File"
|
||||
|
||||
local version_file="./frontend/public/version.txt"
|
||||
local version_file="./frontend/static/version.txt"
|
||||
local current_version=""
|
||||
|
||||
# Check if version file exists
|
||||
@@ -172,21 +172,21 @@ build_backend() {
|
||||
}
|
||||
|
||||
build_frontend() {
|
||||
print_header "Building Frontend Image"
|
||||
print_header "Building Frontend Image (SvelteKit)"
|
||||
|
||||
print_info "Building: ${FRONTEND_IMAGE}"
|
||||
print_info "Building for architectures: linux/amd64"
|
||||
|
||||
# Note: Dockerfile.prod is now a permanent file in the repository
|
||||
# It uses a multi-stage build to compile Tailwind CSS in production
|
||||
# SvelteKit multi-stage build with Vite bundler
|
||||
# Automatically handles cache busting with hashed filenames
|
||||
|
||||
docker buildx build \
|
||||
--platform linux/amd64 \
|
||||
--file ./frontend/Dockerfile.prod \
|
||||
--file ./frontend/Dockerfile.svelte \
|
||||
--tag "${FRONTEND_IMAGE}" \
|
||||
--tag "${FRONTEND_IMAGE_LATEST}" \
|
||||
--push \
|
||||
.
|
||||
./frontend
|
||||
|
||||
print_success "Frontend image built and pushed successfully"
|
||||
}
|
||||
@@ -402,10 +402,6 @@ networks:
|
||||
traefik-network:
|
||||
external: true
|
||||
name: traefik-network
|
||||
|
||||
x-dockge:
|
||||
urls:
|
||||
- https://edh.zlor.fi
|
||||
EOF
|
||||
|
||||
print_success "Deployment configuration generated: ${config_file}"
|
||||
@@ -442,12 +438,12 @@ print_summary() {
|
||||
echo "Version: ${VERSION}"
|
||||
echo ""
|
||||
echo "Version Management:"
|
||||
echo " Frontend version file updated: ./frontend/public/version.txt"
|
||||
echo " Version displayed in footer: v${VERSION#v}"
|
||||
echo " Frontend version file updated: ./frontend/static/version.txt"
|
||||
echo " SvelteKit with automatic cache busting (hashed filenames)"
|
||||
echo ""
|
||||
echo "Next Steps:"
|
||||
echo " 1. Commit version update:"
|
||||
echo " git add frontend/public/version.txt"
|
||||
echo " git add frontend/static/version.txt"
|
||||
echo " git commit -m \"Bump version to ${VERSION#v}\""
|
||||
echo " 2. Pull images: docker pull ${BACKEND_IMAGE}"
|
||||
echo " 3. Create .env file with PostgreSQL credentials:"
|
||||
|
||||
Reference in New Issue
Block a user