Skip to main content

Development Guide

This guide covers the development setup, testing, and deployment workflows for Kuviq.

Tech Stack

  • Frontend: React 19.1, TypeScript 5.9, Vite 7, Material-UI (MUI) v7
  • State Management: TanStack Query (React Query), React Context, Zustand
  • Forms: React Hook Form + Zod validation
  • Backend: Firebase 12 (Firestore, Auth, Functions, Storage)
  • Testing: Vitest, Playwright, MSW, React Testing Library
  • CI/CD: GitHub Actions
  • Internationalization: react-i18next (en, fi, sv)
  • Offline: IndexedDB with Dexie.js, Workbox

Quick Start

# Install dependencies
npm install

# Start development server
npm run dev

# Open http://localhost:3000

Development Workflow

  1. Create a branch for your feature or fix
  2. Write tests for new functionality
  3. Run local checks before committing (automated via pre-commit hook)
  4. Push your changes (pre-push hook runs typecheck, lint, and unit tests)
  5. CI pipeline runs all tests automatically
  6. Merge to main triggers automatic deployment

Available Scripts

Development

  • npm run dev - Start development server
  • npm run build - Production build
  • npm run lint - Run ESLint
  • npm run typecheck - TypeScript type checking

Testing

  • npm run test:unit - Unit tests
  • npm run test:integration - Integration tests
  • npm run test:api - API tests (MSW)
  • npm run test:playwright - E2E tests (Playwright)
  • npm run test:emulator - Firebase Emulator tests

Documentation

  • npm run docs:dev - Start docs dev server
  • npm run docs:build - Build documentation