Case Study

Djordje ClientHub — Bilingual Portfolio and Private Dashboard

Full-stack Next.js application combining a public bilingual portfolio (EN/SR) with a protected internal dashboard for managing clients, projects, tasks and work notes — built with an AI-assisted development workflow.

Start a similar projectView services
Project typeNext.js / React / App Router / Dashboard
IndustryWeb development / Personal tooling
FocusFull-stack architecture, auth protection, bilingual content, internal tooling
RoleFull-stack development, architecture, design, deployment

Project gallery

Djordje ClientHub 1
1 / 6

Project overview

Personal project combining two distinct parts — a public-facing bilingual portfolio and a private password-protected dashboard for internal project and client management. Built with Next.js App Router and deployed on Vercel.

The challenge

  • Needed both a professional public portfolio and a private management tool in one codebase
  • Bilingual content (EN/SR) required a clean routing architecture
  • Route protection had to work reliably without a backend service
  • Dashboard needed to handle clients, projects, tasks and notes
  • AI-assisted workflow had to be integrated naturally into the development process

Project goals

  • Build a polished bilingual public portfolio
  • Create a protected private dashboard
  • Implement reliable route protection without a separate backend
  • Keep the codebase clean and maintainable
  • Deploy reliably on Vercel with no production issues

What was built

Public portfolio

A bilingual (EN/SR) portfolio with home, projects, services, process and contact pages, featuring premium visual details and smooth animations.

Protected dashboard

A private dashboard accessible only after login, containing sections for clients, projects, tasks and work notes.

Route protection

Middleware-based route protection using JWT tokens stored in HTTP-only cookies, working reliably in both development and production.

AI-assisted workflow

The entire project was built using an AI-assisted development workflow, combining Claude with manual code review for faster, cleaner output.

Tools and technologies

Next.js 16ReactApp RouterCSS ModulesJWT authenticationHTTP-only cookiesMiddleware route protectionVercel deploymentAI-assisted workflowBilingual routingServer and client components

Result

A production-deployed full-stack application combining a premium public portfolio with a functional private dashboard. The project demonstrates modern Next.js architecture, clean code organization and reliable deployment on Vercel.

  • Live bilingual portfolio at djordje-clienthub.vercel.app
  • Protected dashboard with client and project management
  • Reliable JWT-based route protection
  • Clean App Router architecture
  • Built with AI-assisted development workflow

Possible next steps

  • Add more dashboard features (invoicing, time tracking)
  • Expand project case studies with more detail pages
  • Improve dashboard analytics and reporting
  • Add email notifications for client updates
  • Continue improving public portfolio content and visuals

Interested in a Next.js portfolio or dashboard?

If you need a modern portfolio, a custom internal tool or a full-stack Next.js application, I can help you plan and build it.

Contact meView services