Coffee Technology

Full Stack DeveloperCoffee Technology2024-2025
Next.js 16React 19TypeScriptPostgreSQLPrismaClerk AuthTailwindCSSRadix UIdnd-kitZodCypressVitest

Coffee Technology is a professional coffee equipment service company specializing in premium brands like La Marzocco, Mazzer, and Probat. The project comprises two integrated applications: a marketing website showcasing services and equipment, and a comprehensive CRM platform for internal operations. The CRM handles the full service lifecycle - from job creation through completion - with equipment tracking, parts inventory, customer site management, and technician assignment via an interactive Kanban board.

5+

Data Domains

Customers, equipment, services, parts, and sites

5

User Roles

Admin, HR, Engineer, Sales, and Customer Service

5

Equipment Categories

Espresso machines, grinders, roasters, filters, and more

Technical Architecture

Two Next.js applications - a marketing website and an operational CRM. The CRM uses PostgreSQL with Prisma ORM, Clerk for authentication with webhook sync, and server actions for all data mutations. The job board uses dnd-kit for drag-and-drop functionality.

Next.js Marketing Website
Next.js CRM Application
PostgreSQL with Prisma ORM
Clerk Authentication + Webhooks
dnd-kit Kanban Board
Server Actions with Zod Validation
Role-Based Middleware
Cypress E2E Tests

Technical Details

Frontend

Framework: Next.js 16 with React 19

State Management: Server Components + Server Actions

Styling: TailwindCSS 4.1 with Radix UI primitives

Notable Features

  • Interactive Kanban job board
  • Equipment detail pages with service history
  • Customer and site management
  • Parts inventory with search and filtering
  • Responsive mobile-first design

Backend

Framework: Next.js Server Actions

Database: PostgreSQL with Prisma ORM

API: Server Actions + Clerk Webhooks

Notable Features

  • Complex relational data model (5+ core domains)
  • Role-based access control
  • Equipment lifecycle tracking
  • Service job workflow management
  • Parts compatibility mapping

Infrastructure

Hosting: Vercel

Deployment: Vercel CI/CD

Monitoring: Vercel Analytics

Notable Features

  • Clerk webhook integration
  • Database seeding for development
  • E2E testing with Cypress
  • Unit testing with Vitest

Team & Role

Team Information

Team Size: Small team

Role: Full Stack Developer

Responsibilities

  • Database schema design with Prisma
  • CRM application development
  • Marketing website development
  • Authentication and authorization
  • Kanban board implementation
  • Testing setup and implementation