My Current Design State: Features and Learnings
A comprehensive look at what I've built so far: media management, content editing, real-time previews, and the architectural decisions that made it all possible.
My Current Design State: Features and Learnings
After two intense days of development (February 3–4, 2026), my Phoenix-based personal website is fully functional. Here’s a walkthrough of what I’ve built.
Public Website
- Homepage: profile, social links, recent work experience, latest articles
- About page: portrait, full bio, work history, education, certifications, skills
- Blog: listing with categories/tags, individual article pages with Markdown rendering
- Projects: showcase with filter, individual case study pages
- Custom pages: dynamic creation via admin with Markdown support
Admin Dashboard
- Profile management with media library avatar picker
- Media library with drag-and-drop upload, real-time progress, Mogrify image optimization
- Content management: articles, pages, work experience, education, certifications, skills
- Authentication with bcrypt, session management, CSRF protection
Technical Highlights
- Dark mode: default dark, Alpine.js toggle, persisted in localStorage
- i18n: German (default) and English, separate translation domains
- LiveView: real-time form validation, instant CRUD feedback
- Assets: Tailwind v3 + esbuild, 12 KB CSS, 8 KB JS
Key Learnings
- Phoenix LiveView’s form validation is magical
- Dark mode with Tailwind is almost too easy
- Ecto’s changesets catch bugs before hitting the database
- The BEAM VM’s error handling is comforting
- Test earlier — writing tests alongside features pays off
Previous: Modern UI with Tailwind and Catalyst