Zendesk Fullstack Engineer Assignment

A customer support ratings dashboard — solution to Zendesk's Full-stack Engineer Test Task.

Live Demo | Original Task

Features

• Ticket Scoring Algorithm — Weighted scoring system that accounts for rating category weights, converting 0-5 ratings to percentage scores
• GraphQL API — Query aggregated category scores with automatic daily/weekly aggregation based on date range
• React Dashboard — Interactive UI with date range filtering and detailed ratings breakdown

Tech Stack

Layer	Technologies
Monorepo	Turborepo, pnpm workspaces
Backend	Node.js 22, Express 5, GraphQL (graphql-http), SQLite
Frontend	React 19, Vite, Apollo Client, Tailwind CSS 4
Shared	GraphQL schema with TypeScript codegen

Project Structure

├── apps/
│   ├── api/              # Express + GraphQL backend
│   └── web/              # React + Vite frontend
├── packages/
│   └── graphql/          # Shared GraphQL schema & generated types
├── TASK.md               # Original assignment requirements
├── Dockerfile            # Multi-stage production build
├── turbo.json            # Turborepo task configuration
└── pnpm-workspace.yaml   # Workspace package definitions

Each app has its own detailed README — see Documentation.

Getting Started

Prerequisites

• Node.js 22+
• pnpm 10+
• Docker (optional, for containerized deployment)

Quick Start

# Install dependencies
pnpm install

# Start development servers (API + Web)
pnpm dev

The API will be available at http://localhost:3000 and the web app at http://localhost:5173.

Available Scripts

Script	Description
pnpm dev	Start all apps in development mode
pnpm build	Build all packages and apps
pnpm start	Run production build
pnpm test	Run tests across all packages
pnpm test:coverage	Run tests with coverage report
pnpm lint	Lint all packages
pnpm typecheck	Type-check all packages

Docker

Build and run the application as a single container (API serves the frontend):

# Using Docker Compose (recommended)
docker compose up

# Or build and run manually
docker build -t zendesk-assignment .
docker run -p 3000:3000 zendesk-assignment

The application will be available at http://localhost:3000.

Architecture

flowchart TB
    subgraph Monorepo
        subgraph apps [Apps]
            Web[Web App<br/>React + Vite]
            API[API Server<br/>Express + GraphQL]
        end
        subgraph packages [Packages]
            GQL[graphql<br/>Schema + Types]
        end
    end
    
    DB[(SQLite<br/>Database)]
    
    Web -->|Apollo Client| API
    API -->|better-sqlite3| DB
    GQL -.->|shared types| Web
    GQL -.->|shared types| API

Loading

Data Flow:

1. User selects a date range in the dashboard
2. Apollo Client sends a GraphQL query to the API
3. API aggregates ratings from SQLite (daily or weekly based on range)
4. Weighted scores are calculated and returned
5. Dashboard displays the results in a sortable table

Testing

# Run all tests
pnpm test

# Run tests with coverage
pnpm test:coverage

Documentation

• API Documentation — Backend setup, GraphQL API, environment variables
• Web Documentation — Frontend architecture, components, features
• Original Task — Assignment requirements from Zendesk