Project Structure

Project Structure

A guided tour of the repository. If you only remember one thing: src/main is the Node.js/Electron side, src/renderer is the Vue UI.

Top-level layout

NexTask/
├── src/
│   ├── main/            # Electron main process, Fastify API, Prisma, DB setup
│   └── renderer/        # Vue 3 single-page application (the UI)
├── scripts/             # Dev server, build and tooling scripts
├── tests/               # Playwright end-to-end tests
├── types/               # Ambient TypeScript declarations
├── build/               # Compiled output (generated, git-ignored)
├── dist/                # Packaged installers (generated, git-ignored)
├── electron-builder.json
├── vite.config.mjs
├── playwright.config.ts
├── prisma.config.ts
├── package.json
└── .env / .env.template

src/main — Electron main process

The Node.js side: window management, the HTTP API, and persistence.

src/main/
├── main.ts               # Entry point: window, CSP, migrations, seeds, server, IPC
├── constants.ts          # IS_DEV / IS_TEST flags and all filesystem paths
├── logger.ts             # electron-log setup
├── setupDatabase.ts      # Custom SQL migration runner (prod)
├── seedDatabase.ts       # Idempotent SQL seed runner (dev + prod)
├── preload/
│   └── preload.ts        # contextBridge: exposes window.settings & window.electronAPI
├── stores/
│   └── settings.ts       # electron-store schema (theme, primaryColor)
├── server/               # Fastify REST API
│   ├── index.ts          # Server bootstrap: CORS, Swagger, routes, pragmas
│   ├── prismaClient.ts   # Prisma client + SQLite PRAGMAs (WAL, etc.)
│   ├── routes/
│   │   ├── task.routes.ts    # /tasks CRUD + batch + archive
│   │   └── stage.routes.ts   # /stages CRUD + batch
│   └── schemas/          # Fastify JSON schemas (validation + Swagger)
│       ├── common.ts         # idParam, errorResponse, messageResponse
│       ├── taskSchema.ts
│       └── stageSchema.ts
├── prisma/
│   ├── schema.prisma     # Data model (Task, Stage, Seed)
│   ├── migrations/       # SQL migrations (folder-per-migration)
│   ├── seeds/            # SQL seed files (e.g. initial stages)
│   └── generated/        # Generated Prisma client (git-ignored)
└── static/               # Static assets copied into the build

src/renderer — Vue UI

A conventional Vue 3 + Vite app.

src/renderer/
├── main.ts               # App bootstrap: Pinia, Router, PrimeVue (Aura), logger
├── App.vue               # Shell: <Header/> + <router-view/>
├── index.html            # Vite entry HTML
├── style.css             # Global / Tailwind styles
├── router/
│   └── index.ts          # Routes: '/' → Home, '/settings' → Settings (hash history)
├── pages/
│   ├── Home.vue          # Loads stages + tasks, renders the Kanban board
│   └── Settings.vue      # Placeholder settings view
├── components/
│   ├── Header.vue            # Top bar: theme toggle, palette picker, navigation
│   ├── Kanban.vue            # The board: columns, DnD, add/rename/delete stage
│   ├── StageTaskList.vue     # A column's task cards (DnD, edit/archive/add)
│   ├── TaskDialog.vue        # Create / edit a task
│   └── PrimaryColorPicker.vue# 17-swatch primary color palette
├── stores/               # Pinia stores
│   ├── Task.ts               # Tasks: cache + CRUD + batch + archive
│   ├── Stage.ts              # Stages: cache + CRUD + batch
│   └── Settings.ts           # Theme & primary color (bridged to electron-store)
├── constants/
│   ├── palette.constants.ts  # 17 Tailwind color palettes
│   └── time.constants.ts     # MINUTE helper
├── types/                # Renderer TypeScript types
│   ├── task.types.ts
│   ├── stage.types.ts
│   ├── base-store.types.ts   # Generic cached-entity store state
│   ├── cache.types.ts        # CacheEntry<T>
│   └── global.d.ts
└── utils/
    ├── api.helper.ts         # Axios instance + typed get/post/put/patch/delete
    ├── cache.helper.ts       # isCacheValid(cache, ttl)
    ├── settings.helper.ts    # applyPrimaryColor(color)
    ├── map.helper.ts         # reactive Map helpers (setAll)
    └── logger.ts             # vue-logger-plugin accessor

scripts — tooling

scripts/
├── dev-server.js         # `npm run dev`: Vite + Electron + watch/reload
├── build.js              # `npm run build:dev`: compile main, preload & renderer
├── server-utils.js       # Shared helpers: compileMain, startRenderer, electronArgs
├── pre-commit-checks.js  # Blocks commits containing TODO/FIXME/console.log
└── private/
    └── tsc.js            # TypeScript compilation helper

See Build and Packaging for how these fit together.

tests — end-to-end tests

tests/
├── fixtures/
│   └── test.ts           # Playwright fixtures: launches Electron + Vite
├── components/           # Page objects
│   ├── Header.ts
│   └── TaskBoard.ts
├── e2e/                  # Specs
│   ├── header/           # theme.spec, palette.spec
│   ├── stage/            # stage.spec
│   └── task/             # task.spec, task-dnd.spec, task-persistence.spec
└── global-setup.ts       # Compiles the main process before the run

See Testing for details.

Configuration files

File	Purpose
vite.config.mjs	Vite config for the renderer (root, port 8080, plugins)
electron-builder.json	Packaging config (targets, files, extra resources)
playwright.config.ts	E2E test runner config
prisma.config.ts	Prisma schema location & datasource URL
postcss.config.mjs	PostCSS / Tailwind
.prettierrc.json	Code formatting rules
sonar-project.properties	SonarQube analysis config
.husky/	Git hooks (pre-commit)

Full breakdown in Configuration.

Generated / ignored folders

These are produced by tooling and not committed (.gitignore): node_modules, build, dist, generated, components.d.ts, *.db, .env, test-results, .scannerwork.