Setup & Installation

Bootstrap an Angular app, configure modules, and run locally.

Use this guide for enterprise admin consoles, internal tools, and long-lived Angular applications.

Prerequisites

Node.js 20 LTS
Angular CLI 17+
pnpm (required — do not use npm for installs)

bash

npm install -g @angular/cli
node --version
ng version

Create the project

bash

ng new admin-console --routing --style=scss --standalone
cd admin-console
pnpm install
ng serve

Verify at http://localhost:4200.

Project structure

plaintext

src/
├── app/
│   ├── core/           # Singleton services, guards, interceptors
│   ├── shared/         # Reusable components, pipes, directives
│   ├── features/       # Feature modules (lazy-loaded)
│   └── app.config.ts   # Application providers
├── assets/
└── environments/
    ├── environment.ts
    └── environment.prod.ts

Environment configuration

typescript

// src/environments/environment.ts
export const environment = {
  production: false,
  apiUrl: "http://localhost:4000/api",
  cognito: {
    userPoolId: "us-east-1_xxxxx",
    clientId: "xxxxxxxx",
    domain: "auth.company.com",
  },
};

Auth interceptor

typescript

import { provideHttpClient, withInterceptors } from "@angular/common/http";
import { authInterceptor } from "./core/interceptors/auth.interceptor";
 
export const appConfig: ApplicationConfig = {
  providers: [provideHttpClient(withInterceptors([authInterceptor]))],
};

Verify setup

ng serve starts without errors.
Login redirects to Cognito hosted UI.
Authenticated API calls return data.
ng lint and ng test pass.