Back to Projects
Creative Digital Agency Platform

Creative Digital Agency Platform

A high-performance, full-stack digital agency website built with React and Firebase. It features dynamic service categories, a secure admin dashboard, real-time appointment booking, and a fully responsive design tailored for modern businesses.

Jan 2025 - Present
Web Application
Technologies
#React#Firebase#Tailwind CSS#Redux#Node.js#vite#TanStack-Query#zod
Live Demo Source Code

Key Features

  • Dynamic Category Navigation & Filtering
  • Secure Admin Dashboard with Role-Based Access
  • Real-time Contact Form (EmailJS Integration)
  • Appointment Booking System (Calendly)
  • Multi-language Support (i18n)

Case Study Overview

# Project Overview This project solves the problem of managing a digital agency's online presence. It moves beyond static templates by offering a dynamic content management system where admins can add services, manage blogs, and update project portfolios in real-time. ## Technical Architecture - **Frontend**: Built with React (Vite) for blazing fast performance. - **Styling**: Utility-first CSS using Tailwind and DaisyUI for rapid, responsive UI development. - **State Management**: Redux Toolkit handles user authentication state, while TanStack Query manages server state caching. - **Backend/Auth**: Firebase provides serverless authentication and real-time database capabilities. ## User Experience The application prioritizes UX with smooth transitions, Skeleton loaders for data fetching, and a mobile-first approach ensuring accessibility across all devices.

The Challenge

One major challenge was implementing a secure and scalable Role-Based Access Control (RBAC) system without a traditional backend. ensuring that sensitive admin routes (like /add-service) were inaccessible to regular users while maintaining a seamless login experience was critical.

My Solution

I designed a custom AdminRoute component that interfaces with Firebase Auth. It verifies user claims and email allow-lists before rendering protected routes. This was combined with context-based authentication (AuthContext) to provide a robust security layer that redirects unauthorized users immediately, ensuring data integrity.