♱⋆. My personal portfolio and blog site w/ content management dashboard .⋆♱

📌 Overview

_{Public site (left) · Admin dashboard (right)}

Public Site

• Blog posts with tags, an RSS feed, and individual post pages.
• Project portfolio with categories, featured projects, and repository links.
• About and contact pages with skills, certifications, and social links.
• Visitor-selectable themes, fonts, weather effects, and a cursor-following cat.
• Live chat with optional Discord integration and custom emojis.
• Widgets for Discord presence, music, tweets, GitHub contributions, and service status.

Blog	Blog post
Projects	About
Contact

Admin Dashboard

• Session-based login with optional two-factor authentication.
• Blog and project editors with Markdown previews, image uploads, and publishing controls.
• Theme and font management, including custom CSS, backgrounds, and visual effects.
• Configuration for site content, banners, adverts, and integrations.
• Visitor analytics with charts, page statistics, and traffic breakdowns.
• Chat moderation, account settings, user management, and scoped API keys.

Login	Blog list
Blog editor	Projects
Project editor	Themes

📂 Directory structure

dane.gg/
├── apps/
│   ├── frontend/            # SvelteKit public site and admin dashboard
│   └── backend/             # Express API, database access, and WebSocket chat
├── packages/
│   └── shared/              # Utilities shared by both applications
├── testing/                 # Playwright browser tests
├── docs/                    # Guides and screenshots
├── .env                     # Local configuration (not committed)
├── .env.example.dev         # Development environment template
├── .env.example.prod        # Production environment template
├── docker-compose.dev.yml   # Development PostgreSQL and Adminer
├── docker-compose.yml       # Full container stack
├── playwright.config.ts     # Browser-test configuration
├── server.ts                # Production frontend server
└── package.json             # Root commands

📦 Development

Install Bun and run commands from the repository root.

Set the values in the .env file:

DATABASE_URL=postgresql://dane_gg:daneGGPassword!@localhost:5432/dane.gg
SESSION_SECRET=replace-with-a-long-random-secret
PUBLIC_ORIGIN=http://localhost:5173
BACKEND_PORT=3001
COOKIE_SECURE=false

Docker (recommended)

Requires Docker with Compose. Start PostgreSQL and Adminer in containers:

docker compose -f docker-compose.dev.yml up -d

Install dependencies, initialize the schema, create an admin account, and run the frontend and backend locally with Bun and hot reload:

bun install
(cd apps/frontend && bun install)
(cd apps/backend && bun install)
bun run db:push
bun run create:admin your-username 'your-strong-password'
bun run dev

Adminer is available at http://localhost:8080. Stop the database containers with docker compose -f docker-compose.dev.yml down.

Local Development

Use a running PostgreSQL instance, create a database and user for the app, and update DATABASE_URL in .env to match. Docker is not required for this option.

Install dependencies, initialize the schema, create an admin account, and start the applications:

bun install
(cd apps/frontend && bun install)
(cd apps/backend && bun install)
bun run db:push
bun run create:admin your-username 'your-strong-password'
bun run dev

For either option, open http://localhost:5173; the API runs at http://localhost:3001. To load optional demo data, run bun run db:seed before creating your admin account on a fresh development database. Seeding clears existing data.

📚 Documentation

Guide	Contents
Documentation index	Overview of the available guides
Applications	Frontend and backend structure, development commands, and checks
Packages	Shared package organization
Shared utilities	Utilities used by both applications
Browser tests	Playwright setup, test coverage, and commands
Authentication and permissions	Sessions, API keys, account roles, and route guards
Theme system	Theme selection, visual settings, custom CSS, and fonts
Discord integration	Chat bridge protocol, presence webhooks, and emoji synchronization
Third-party integrations	Twitter/X, Last.fm, GitHub, Uptime Kuma, and ntfy configuration
Screenshots	README images and capture guidelines

⌨️ Technologies

• Frontend:
• Backend:
• Database:
• Real-time:
• Authentication:
• Testing:
• Containers: