Skip to content
➜cat case-studies/nathan-digital.md

Nathan Digital | Multi-Project Frontend Architecture

CLIENT

Nathan & Nathan (Nathan Digital)

ROLE

Software Developer

DURATION

July 2022 - November 2023

TECH_STACK

Nuxt.jsNext.jsTailwind CSSGSAPREST APIs

95+

Lighthouse Score

4

Major Projects Led

40%

Faster Load Times

10+

Client Projects

➜

CONTEXT

Nathan Digital is a digital agency based in Dubai, serving clients across the UAE and beyond. When I joined, the team was primarily using Nuxt.js for most projects. I brought React and Next.js experience, which opened new technical possibilities for the team.

➜

THE CHALLENGE

The agency needed to deliver multiple client projects simultaneously while maintaining consistent quality. Each project had different needs (SEO-heavy marketing sites, interactive web apps, and everything between), but shared patterns we could standardize.

➜

APPROACH

I recommended adopting Next.js for projects with strong SEO requirements, using its server-side rendering for indexability. For existing Nuxt.js projects, I quickly adapted my React knowledge to Vue's ecosystem.

Framework Selection

Evaluated each project's needs to choose between Nuxt.js (existing team expertise) and Next.js (SSR/SEO advantages)

Performance Budgets

Set Lighthouse targets per project type: 90+ for marketing sites, 80+ for web applications

Component Architecture

Created reusable component libraries that could be shared across projects with minimal modification

Animation System

Standardized GSAP usage patterns for consistent, performant animations

➜

PROJECTS DELIVERED

Over 16 months, I contributed to 10+ client projects and led frontend development for 4 major projects.

  • 3DHUB - Interactive 3D printing service platform
  • Challenge.FIT - Fitness challenge and tracking application
  • Dynamic Maids - Service booking platform with complex scheduling
  • Dynamic Freelancer - Freelancer platform for a local business
➜

TECHNICAL HIGHLIGHTS

Each project required understanding the client's domain, translating design requirements into performant interfaces, and coordinating with backend teams for API integration.

  • Achieved 95+ Lighthouse scores on marketing sites through SSR, image optimization, and code splitting
  • Reduced initial page load times by 40% across projects by implementing lazy loading and route-based code splitting
  • Built responsive designs that maintained visual quality across 320px to 2560px viewports
  • Integrated GSAP animations that enhanced user experience without impacting Core Web Vitals
➜

OUTCOME

Successfully delivered all projects within deadlines while establishing reusable patterns that reduced development time for subsequent projects. The agency adopted Next.js as a standard option for SEO-focused projects based on the results.

➜

LEARNINGS

  • Working across multiple projects simultaneously requires strict discipline in code organization and documentation
  • Framework choice should be driven by project requirements, not team preference
  • Performance optimization is more effective when treated as a design constraint from the start, not an afterthought
  • International work environments demand clear communication; technical decisions need to be explained in business terms
➜

testimonials

I am pleased to offer my highest recommendation for Mohammed Yousuf. Having collaborated closely with Yousuf on numerous projects, I can attest to the extraordinary contributions he has made to our front-end development endeavors. An invaluable resource, consistently providing expertise and guidance to the team when faced with challenges.

Shafeq Mohammed

Lead Product Designer, Nathan Digital

➜ EOF[rendered: 7 sections]