Case Study · 2024–2025 · Full Stack Web Development
Becoming a Full Stack Developer over the next three years — working primarily with Next.js, React, and Tailwind CSS, while expanding into machine learning to build smarter, data-driven applications that make a real impact.
A fully responsive marketing site for Construction company — showcasing services, past project galleries, blog content, contact forms, and company information. Optimized for performance, SEO, and lead conversion.
A secured admin dashboard allowing staff to manage blog posts, galleries, user accounts, site content, and more — all from a clean React/Next.js interface with role-based access control.
Coordinated team assignments, set project milestones, and ran group planning sessions via Slack. Translated client requirements into technical tasks and kept the team aligned throughout delivery.
Implemented HTTPS across the full stack, applied image optimization via Next.js's built-in pipeline, enabled code splitting, and fine-tuned SSR strategies to achieve fast time-to-interactive scores.
Designed and built a full React/Next.js admin panel from scratch using Tailwind. Includes data tables with filtering, analytics charts, user management (add/remove/role), blog CMS, and gallery management.
Ran a full audit of Zoho subscriptions and removed unused paid modules — reducing monthly overhead. Migrated select features to a self-managed Hetzner VM, cutting cloud costs significantly vs. managed alternatives.
The public-facing site gives potential clients a clean view of Construction's offerings — from services and past project galleries to a regularly updated blog and a contact form wired up to Zoho CRM. SEO was a priority throughout, with server-rendered pages and structured metadata.
Behind authentication lives a full-featured content management and operations panel. Staff can publish or edit blog posts, add or remove gallery images, manage user accounts with role assignments, and update site-wide content — all without touching code.
Every page was built mobile-first with Tailwind's responsive breakpoints. Combined with Next.js image optimization and lazy loading, the site scores strongly on Core Web Vitals across all device sizes.
LESSON LEARNED When a framework integration fights you, suspect the structure before the logic. The instinct to rebuild clean — rather than patch around problems — saved the entire project timeline. This decision required confidence in the long-term over short-term speed.
Requirements gathering with Construction stakeholders. Defined site architecture, page structure, and admin feature set. Set up Slack workspace, assigned team roles, and established the milestone roadmap.
Initialized Next.js project, configured Tailwind, set up Hetzner VM. Handled domain transfer and DNS configuration. Audited and pruned Zoho subscriptions for cost optimization.
Built all public pages — services, about, contact, blog listing, project gallery, and past work showcase. Integrated Zoho CRM for contact form leads. Implemented SEO metadata and image optimization.
Encountered and diagnosed the NextAuth/folder convention conflict. Made the call to restructure the project from scratch following official conventions. Migrated all components into the new clean architecture.
Built the full admin panel — blog CMS, gallery management, user management with RBAC, analytics dashboard with charts, and site-wide content controls. Auth working flawlessly on the clean codebase.
Final security audit, HTTPS enforcement, performance testing across devices. Deployed to Hetzner VM with production environment variables. Delivered documentation and ran staff training on the admin panel.
Owning the full stack — from DNS and hosting to UI and auth — gave me a complete mental model of how modern web apps actually run in production. No hand-offs. No gaps in understanding.
NextAuth's documentation became my closest companion. I learned how session management, JWT tokens, and protected API routes actually work under the hood — not just how to use them.
The NextAuth restructure taught me that a clean project foundation isn't a luxury — it's load-bearing. Investing in correct structure early avoids compounding technical debt later.
Running the Zoho audit and Hetzner migration showed me that infrastructure decisions are engineering decisions. Developers who understand cost make better architecture choices.
Leading the team through milestones and Slack-based coordination developed skills I couldn't get from solo projects — breaking down ambiguity, communicating technical decisions, and keeping people unblocked.
SSR strategies, image optimization, and code splitting became natural defaults rather than afterthoughts. Building performance in from the start is faster than retrofitting it at the end.
When NextAuth blocked the project, I didn't guess — I read the entire documentation, tested edge cases, and experimented until the system worked exactly as designed. Continuous learning isn't a habit. It's how I operate.
Rebuilding the project structure was painful and time-consuming. But patching around a broken foundation wasn't an option. My Achiever drive pushed me to do it right rather than do it fast — and the project shipped cleanly because of it.