Checkly

1. Introduction

Create personalised checklists and action plans for any life goal - development, career, health, creativity, and more. Just complete a short quiz and get an individual plan with tasks, tips and structure for 5, 14 or 21 days.

1.1 Useful Links

• Pay attention, that we have certain quality criteria, which we should follow during application development.

TODO: Add development deployment link

2. Domain

The app helps users achieve their life goals—whether in development, career, health, or creativity—by generating personalized checklists and action plans. After completing a short quiz, users receive a structured plan with tasks and tips for 5, 14, or 21 days.

3. Requirements

• NodeJS (22.x.x);
• npm (10.x.x);
• PostgreSQL (15.4)

4. Database Schema

erDiagram
  users ||--o{ plan : "plan"
  users {
    int id PK
    dateTime created_at
    dateTime updated_at
    varchar email
    varchar name
    date dob
    text password_hash
    text password_salt
  }

  plan ||--|{ plan_day : "plan_day"
  plan {
    int id PK
    varchar title
    int user_id FK
    int duration
    varchar intensity
    dateTime created_at
    dateTime updated_at
  }

  plan_day ||--|{ task : "plan_day"
  plan_day {
    int id PK
    int day_number
    int plan_id FK
    dateTime created_at
    dateTime updated_at
  }

  task o|--|| execution_time_type : "enum:execution_time_type"
  task {
    int id PK
    varchar title
    text description
    int order
    int plan_day_id FK
    boolean is_completed
    execution_time_type execution_time
    dateTime created_at
    dateTime updated_at
    dateTime completed_at
  }

  execution_time_type {
    morning morning
    afternoon afternoon
    evening evening
  }

Loading

5. Architecture

TODO: add architecture

5.1 Global

5.1.1 Technologies

1. Typescript
2. npm workspaces

5.2 Frontend

5.2.1 Technologies

1. React — a frontend library
2. Redux + Redux Toolkit — a state manager

5.2.2 Folder Structure

1. assets - static assets (images, global styles)

2. libs - shared libraries and utilities

   2.1 components - plain react components

   2.2 enums

   2.3 helpers

   2.4 hooks

   2.5 modules - separate features or functionalities

   2.6 types

3. modules - separate app features or functionalities

4. pages - app pages

5.3 Backend

5.3.1 Technologies

1. Fastify — a backend framework
2. Knex — a query builder
3. Objection — an ORM

5.3.2 Folder Structure

1. db - database data (migrations, seeds)

2. libs - shared libraries and utilities

   2.1 enums

   2.2 exceptions

   2.3 helpers

   2.4 modules - separate features or functionalities

   2.5 types

3. modules - separate app features or functionalities

5.4 Shared Package

5.4.1 Reason

As we are already using js on both frontend and backend it would be useful to share some contracts and code between them.

5.4.2 Technologies

1. Zod — a schema validator

6. How to Run

6.1 Manually

1. Create and fill all .env files. These files are:

• apps/frontend/.env
• apps/backend/.env

You should use .env.example files as a reference.

1. Install dependencies: npm install.

2. Install pre-commit hooks: npx simple-git-hooks. This hook is used to verify code style on commit.

3. Run database. You can run it by installing postgres on your computer.

4. Build 'shared' folder. npm run build -w shared

5. Apply migrations: npm run migrate:dev -w backend

6. Run backend: npm run start:dev -w backend

7. Run frontend: npm run start:dev -w frontend

7. Development Flow

7.1 Pull Request Flow

<type>: <ticket-title> <project-prefix>-<issue-number>

For the full list of types check Conventional Commits

Examples:

• feat: add dashboard screen cy-123

7.2 Branch Flow

<issue-number>-<type>-<short-desc>

Examples:

• 123-feat-add-dashboard
• 12-feat-add-user-flow
• 34-fix-user-flow

7.3 Commit Flow

We use Conventional Commits to handle commit messages

<type>: <description> <project-prefix>-<issue-number>

Examples:

• feat: add dashboard component cy-45
• fix: update dashboard card size cy-212

8. Deployment

CI/CD implemented using GitHub Actions

9. Running Tests

Automated API and UI tests for the Checkly monorepo, developed as part of the Binary Studio Academy 2025 program.

This package uses Playwright to test both backend and frontend functionality of Checkly. Includes Continuous Integration via GitHub Actions and generates HTML test reports as build artifacts.

---

9.1 Tech Stack

• Playwright
• TypeScript
• Faker – fake test data
• Ajv – schema validation
• dotenv – environment configuration

---

9.2 Useful Commands

npm run test Run all tests with the default configuration.

npm run test:ui Run only UI tests using

npm run test:api Run only API tests

npm run report Shows test report

npm run test --ui Open the interactive Playwright Test Runner UI

---

9.4 Environment Configuration

The playwright.config.ts automatically reads:

apps/frontend/.env → VITE_APP_DEVELOPMENT_PORT, VITE_APP_API_ORIGIN_URL

apps/backend/.env → HOST, PORT

From these, it calculates:

WEB_BASE_URL → defaults to http://localhost:3000

API_BASE_URL → defaults to http://localhost:3001/api/v1

To override on the fly:

WEB_BASE_URL=http://localhost:5173
API_BASE_URL=http://localhost:4000/api/v1
npx playwright test