🟦 AngularTodoApp
This project is a production-oriented distributed web application built with
Angular (SPA frontend) - Deployed at Verecel and Node.js + Express (REST API backend) - Deployed at Railway,
backed by MongoDB Atlas.
- A distributed full-stack application demonstrating secure authentication,
- scalable API architecture, and cloud-based deployment.
Architecture Overview
User Browser
│
│ HTTP Request
▼
Angular Frontend (TypeScript)
Hosted on Vercel
│
│ REST API (JSON)
▼
Node.js Express Backend
Hosted on Railway
│
▼
MongoDB Atlas Cloud Database
Overview - 📌 Executive Summary
This project is a production-oriented distributed web application built with
Angular (SPA frontend) - Deployed at Verecel and Node.js + Express (REST API backend) - Deployed at Railway,
backed by MongoDB Atlas.
The system demonstrates real-world engineering practices including:
* Implemented layered architecture
* Supports distributed deployment
* Repository pattern
* Authentication & Security - JWT-based stateless authentication
* Secure cross-origin communication (CORS configuration)
* Cloud-based distributed deployment - * Cloud deployment (Railway + MongoDB Atlas)
* Clean API architecture design
* Separation of concerns
* Scalable client-server design
* Responsive UI implementation.
* CI/CD deployment via Railway
* Responsive UI design
* Validated across multiple browsers
This application provides a complete Todo management system featuring:-
• Task creation * Editing, Deletion • Completion / Undo functionality • Sorting & filtering logic
• Responsive UI (mobile → desktop)
• Cloud deployment with 24/7 availability
• Environment-based local + production modes
The system is architected to simulate a real production web application rather than
a simple frontend demo.
A production-oriented full-stack Todo application built with Angular and Node.js,
designed with mobile-first responsive principles and deployed to the cloud with
CI/CD - - automation.
This project demonstrates frontend engineering discipline, backend API integration,
environment-based configuration, and real production deployment practices.
Responsive Design Considerations and Outcome indicated below :-
Problem
Need a responsive task management interface accessible across devices.
Implementation
Built an Angular SPA communicating with a Node.js REST API hosted separately.
Result
Successfully deployed distributed application with verified responsive UI and cross-browser compatibility.