Project Structure
How the Angular frontend and Express API share one repo.
The Angular app (src/app) and the Express API (src/api) live side by side in one Angular SSR project.
File tree
src/
├── app/
│ ├── core/ # Auth client/service, guards, brand, theme
│ ├── pages/ # Landing, auth, admin (dashboard + tasks), errors
│ ├── shared/
│ │ ├── components/ # App chrome (sidebar, brand)
│ │ ├── layouts/ # Auth + admin shells
│ │ └── ui/ # spartan/ui Helm (CLI-managed)
│ ├── app.ts
│ └── app.routes.ts
├── api/
│ ├── features/tasks/ # Express routes + controller
│ ├── lib/ # Prisma, Better Auth, session, rate limits
│ └── api.ts
├── generated/prisma/ # Prisma client (gitignored; run db:generate)
├── main.ts
├── main.server.ts
├── server.ts # Express + Angular SSR entry
└── styles.css
prisma/
├── schema.prisma
├── models/ # auth.prisma, task.prisma
└── migrations/ # committed SQL; applied with db:deployAdding features
- UI features go under
src/app/pages. - API features go under
src/api/features. - Don't hand-edit Helm sources in
src/app/shared/ui— use the spartan CLI to add or update components there.
Server entry
src/server.ts is where Express and Angular SSR meet: Express owns the HTTP server and routes /api/* to the Express API, while everything else falls through to @angular/ssr for server-rendered Angular pages. There's no separate proxy or second process to run.
Prisma layout
The schema is split by domain under prisma/models (auth.prisma, task.prisma) and composed into prisma/schema.prisma. Migrations are committed to prisma/migrations and applied with pnpm db:deploy — see Database & Prisma for the full workflow.
Related
- Import Aliases — the
@core/*,@pages/*, and other TypeScript path aliases used throughoutsrc/app - What's Included — what actually lives in
src/app/pagesout of the box