How gupthamandavilli/employee_management works
Purpose and entry points
This is a full-stack employee-management CRUD system: an Angular 22 single-page client consumes an Express REST API, which persists employees to PostgreSQL when available and otherwise uses an in-memory store. Runtime entry points are frontend/src/main.ts for the browser app and backend/server.js for the API; root package.json coordinates separate frontend/backend commands.
Angular application shell and routing
Angular bootstraps standalone application configuration from frontend/src/main.ts and frontend/src/app/app.config.ts. The root shell and route composition are in frontend/src/app/app.ts, frontend/src/app/app.html, and frontend/src/app/app.routes.ts. This layer owns client-side navigation and provides shared application-level HTTP/router configuration.
Employee domain contract and API boundary
The shared frontend representation of an employee, including optional ID and creation timestamp, is defined in frontend/src/app/models/employee.model.ts. frontend/src/app/services/employee.service.ts is the client boundary to http://localhost:5000: it issues paginated/search reads and single-record create, update, and delete operations. RxJS/Angular HTTP responses flow from this service into UI components rather than components directly calling the backend.
Interactive employee workflow
The home view composes the employee-management experience in frontend/src/app/components/home/home.component.ts and its template. frontend/src/app/components/employee-list/employee-list.component.ts presents paginated/searchable data and initiates edit/delete actions. frontend/src/app/components/employee-modal/employee-modal.component.ts owns validated add/edit form interaction. Successful mutations trigger list refreshes without browser reload; the navbar is a separate navigation component under frontend/src/app/components/navbar/.
Express API and request processing
backend/server.js is the HTTP boundary. It exposes health and /api/employees REST endpoints for paginated search, lookup by ID, create, update, and deletion. It also centralizes middleware, request validation, response/error behavior, and API-to-data-layer control flow. The frontend and backend run as independently served processes, normally on ports 4200 and 5000 respectively.
Persistence, initialization, and resilience
backend/db.js encapsulates PostgreSQL connection and employee CRUD behavior. It initializes the target database/table and seed records where needed, then serves operations through PostgreSQL. If the database is unreachable, this module switches to a pre-seeded in-memory data store, preserving API availability but making fallback-state persistence process-local. PostgreSQL connection details are environment-driven (PGHOST, PGPORT, PGUSER, PGPASSWORD, PGDATABASE); .env is intentionally not committed.
Data flow and operational constraints
User input flows modal/list → EmployeeService → Express validation/routes → database abstraction → PostgreSQL or memory → JSON response → refreshed Angular state. The backend enforces required names/departments, age range, email format/uniqueness, positive salary, and optional positive custom IDs. PostgreSQL is the only external infrastructure dependency; Node.js 18+, npm, Angular CLI, Express, and the PostgreSQL driver are material runtimes/dependencies, declared through backend/package.json, frontend/package.json, and root package.json.
Main entry points: employee.service.ts Employee service · main.ts Angular bootstrap · home.component.ts Employee home · db.js Employee data gateway
Components 15
Angular client
- Angular bootstrap
frontend/src/main.ts - App configuration · Provides shared HTTP and router configuration.
frontend/src/app/app.config.ts - App shell and routes · Owns client navigation and view composition.
frontend/src/app/app.routes.ts - Employee home · Composes the employee-management workflow.
frontend/src/app/components/home/home.component.ts - Employee list · Displays searchable, paginated employees and starts edit/delete actions.
frontend/src/app/components/employee-list/employee-list.component.ts - Employee modal · Owns validated add and edit forms.
frontend/src/app/components/employee-modal/employee-modal.component.ts - Employee service · Issues employee CRUD, pagination, and search requests.
frontend/src/app/services/employee.service.ts - Employee contract · Client employee representation with optional ID and timestamp.
frontend/src/app/models/employee.model.ts
Express API
- Express server · Serves health and employee REST endpoints on port 5000.
backend/server.js - Request validation · Enforces employee fields, ranges, formats, and uniqueness rules.
backend/server.js - Employee REST routes · Handles search, lookup, create, update, and delete operations.
backend/server.js
Persistence
- Employee data gateway · Initializes data and selects PostgreSQL or resilient memory storage.
backend/db.js - PostgreSQL · Environment-configured durable employee store.
- In-memory fallback · Pre-seeded fallback when PostgreSQL is unreachable.
backend/db.js
Other components
- Workspace commands · Coordinates frontend and backend commands.
package.json
Connections 18
- Workspace commands → Angular bootstrap: starts frontend
- Workspace commands → Express server: starts backend
- Angular bootstrap → App configuration: loads
- Angular bootstrap → App shell and routes: boots
- App configuration → Employee service: provides HTTP
- App shell and routes → Employee home: renders
- Employee home → Employee list: composes
- Employee home → Employee modal: composes
- Employee list → Employee service: loads and mutates
- Employee modal → Employee service: creates and updates
- Employee service → Employee contract: uses
- Employee service → Express server: JSON REST on :5000
- Express server → Request validation: applies
- Request validation → Employee REST routes: permits requests
- Employee REST routes → Employee data gateway: CRUD operations
- Employee data gateway → PostgreSQL: primary storage
- Employee data gateway → In-memory fallback: on database failure
- Employee service → Employee list: refreshes state