Skip to content
BranchesTags

Latest commit

 

History

3 Commits

Folders and files

NameName
Last commit message
Last commit date
CI-CD
CI-CD
 
 
ChatGPT
ChatGPT
 
 
GITHUB
GITHUB
 
 
ZERODHA
ZERODHA
 
 
ZOOM
ZOOM
 
 
nodeapp-docker
nodeapp-docker
 
 
.gitignore
.gitignore
 
 
README.md
README.md
 
 

Repository files navigation

Learning Library

A comprehensive collection of full-stack web development projects covering modern technologies, design patterns, and real-world applications. This library demonstrates practical implementations of contemporary web applications built during the learning journey.

Overview

The Library contains six independent full-stack projects, each focusing on different aspects of web development including AI integration, containerization, version control systems, financial platforms, and real-time communication applications. Each project is production-ready with proper documentation and follows professional development standards.

Projects Directory

Library/
├── ChatGPT/              # AI-Powered Conversation Platform
├── CI-CD/                # Continuous Integration & Deployment Pipeline
├── GITHUB/               # Version Control System Clone
├── nodeapp-docker/       # Containerization Example
├── ZERODHA/              # Stock Trading Dashboard
├── ZOOM/                 # Real-Time Video Communication
└── README.md             # This file

1. ChatGPT - Conversational AI Application

Location: ./ChatGPT

An interactive chat application powered by Google Gemini API with persistent thread-based conversations stored in MongoDB.

Key Features

  • Real-time AI responses via Google Generative AI
  • Multiple conversation threads management
  • Full chat history persistence
  • Markdown-formatted responses
  • React-based modern UI with Vite

Technology Stack

  • Backend: Node.js, Express.js, MongoDB, Mongoose
  • Frontend: React 19, Vite, React Router
  • APIs: Google Generative AI (Gemini)

Quick Start

# Backend
cd ChatGPT/Backend
npm install
# Configure .env with MONGODB_URL and GEMINI_API_KEY
npm start

# Frontend (new terminal)
cd ChatGPT/Frontend
npm install
npm run dev

Server Ports

Learn

  • MERN stack architecture
  • AI API integration
  • React context state management
  • Database schema design
  • Responsive UI components

2. CI-CD - Continuous Integration & Deployment

Location: ./CI-CD

Demonstrates automated testing, building, and deployment workflows using GitHub Actions and Jest.

Key Features

  • Automated unit testing with Jest
  • GitHub Actions CI pipeline
  • Code quality checks
  • Build automation
  • Basic Node.js server with tests
  • Full MERN project CI setup

Technology Stack

  • Testing: Jest, Node.js test framework
  • CI-CD: GitHub Actions, YAML workflows
  • Backend: Express.js, Nodemon
  • Frontend: React, Vite (in MERN example)

Quick Start

# Basic CI Setup
cd CI-CD/CI
npm install
npm test                    # Run tests
node server.js              # Run server

# Full MERN Project
cd CI-CD/CI-CD_for_mern_project/Backend-GPT
npm install
npm start

Learn

  • Test-driven development
  • GitHub Actions workflows
  • Automated deployment
  • Code coverage reporting
  • Pipeline configuration

3. GITHUB - Version Control System Clone

Location: ./GITHUB

A Git-like version control system implementation with AWS S3 cloud storage integration and WebSocket real-time collaboration.

Key Features

  • Repository initialization and management
  • File staging and committing (git-like operations)
  • Push and pull to AWS S3 remote storage
  • Commit reverting capabilities
  • Real-time collaboration via Socket.IO
  • User authentication and authorization
  • Heat map visualization of contributions

Technology Stack

  • Backend: Node.js, Express.js, MongoDB, Passport.js
  • Frontend: React, Vite, Axios, Primer UI Components
  • Cloud: AWS S3, AWS SDK
  • Real-time: Socket.IO
  • Authentication: JWT, Bcryptjs

Quick Start

# Backend
cd GITHUB/backend
npm install
# Configure .env with MongoDB and AWS credentials
npm start

# Frontend
cd GITHUB/frontend
npm install
npm run dev

CLI Commands

# Version control commands
node index.js init                  # Initialize repository
node index.js add <file>           # Stage file
node index.js commit "message"     # Create commit
node index.js push                 # Push to remote
node index.js pull                 # Pull from remote
node index.js revert <commitID>    # Revert commit

Learn

  • Version control system design
  • AWS S3 integration
  • CLI development with Yargs
  • Real-time communication
  • Authentication patterns

4. nodeapp-docker - Containerization & Orchestration

Location: ./nodeapp-docker

Practical example of containerizing a Node.js application with MongoDB using Docker and Docker Compose.

Key Features

  • Docker image creation and optimization
  • Docker Compose multi-container orchestration
  • User management REST API
  • MongoDB containerization
  • Environment variable management
  • Volume mounting for data persistence

Technology Stack

  • Runtime: Node.js, Docker
  • Framework: Express.js
  • Database: MongoDB
  • Orchestration: Docker Compose

Quick Start

# Using Docker Compose (Recommended)
docker-compose -f mongo.yaml up

# Or build and run manually
docker build -t nodeapp:1.0 .
docker run -p 3000:3000 nodeapp:1.0

API Endpoints

  • GET /getUsers - Retrieve all users
  • POST /addUser - Add new user

Learn

  • Docker fundamentals
  • Image optimization
  • Multi-container orchestration
  • Environment configuration
  • Data persistence in containers

5. ZERODHA - Stock Trading Dashboard

Location: ./ZERODHA

A comprehensive financial platform clone demonstrating portfolio management, holdings tracking, and order placement.

Key Features

  • Holdings portfolio management
  • Trading positions tracking
  • Order placement and execution
  • Profit/Loss calculations
  • Multi-page landing site with features showcase
  • User authentication
  • Sample data population for testing

Technology Stack

  • Backend: Node.js, Express.js, MongoDB, Mongoose, Passport.js
  • Frontend: React, React Router, Vite
  • Database: MongoDB with Mongoose models
  • Authentication: Passport-Local, Bcryptjs

Quick Start

# Backend
cd ZERODHA/backend
npm install
# Configure .env with MONGO_URL
npm start

# Frontend
cd ZERODHA/frontend
npm install
npm run dev

API Endpoints

  • GET /allHoldings - Retrieve holdings
  • GET /allPositions - Get positions
  • POST /newOrder - Place order
  • GET /addHoldings - Populate sample data
  • GET /addPositions - Populate sample positions

Learn

  • Financial application architecture
  • Portfolio management concepts
  • React multi-page applications
  • Authentication with Passport.js
  • Mongoose schema design

6. ZOOM - Real-Time Video Communication Platform

Location: ./ZOOM

Full-stack video calling application with chat functionality using WebRTC and Socket.IO for real-time communication.

Key Features

  • Video calling with multiple participants
  • Real-time chat during meetings
  • Meeting history tracking
  • Guest access with meeting codes
  • User authentication
  • WebSocket-based real-time updates

Technology Stack

  • Backend: Node.js, Express.js, Socket.IO
  • Frontend: React, Material-UI
  • Database: MongoDB (for meetings and users)
  • Real-time: WebRTC, Socket.IO

Quick Start

# Backend
cd ZOOM/backend
npm install
npm run dev              # or npm start

# Frontend (new terminal)
cd ZOOM/frontend
npm install
npm start

Server Ports

Learn

  • Real-time video communication
  • WebSocket implementation
  • WebRTC fundamentals
  • Chat systems
  • Meeting management

Common Technologies Across Projects

Backend Stack

  • Runtime: Node.js
  • Framework: Express.js
  • Database: MongoDB with Mongoose
  • Authentication: JWT, Passport.js, Bcryptjs
  • Real-time: Socket.IO
  • Cloud: AWS S3
  • Utilities: Dotenv, CORS, Body-parser

Frontend Stack

  • Library: React (v19)
  • Bundler: Vite
  • Routing: React Router
  • HTTP Client: Axios
  • Build Tool: Vite
  • Component Libraries: Primer UI, Material-UI
  • Styling: CSS modules, Global CSS

DevOps & Deployment

  • Containerization: Docker, Docker Compose
  • CI-CD: GitHub Actions
  • Testing: Jest
  • Code Quality: ESLint

Development Environment Setup

Prerequisites (All Projects)

- Node.js v16 or higher
- npm or yarn
- MongoDB (local or Atlas)
- Git
- Docker (for nodeapp-docker, GITHUB, ZERODHA)
- Modern web browser

Installation Pattern (Most Projects)

# Backend
cd <project>/backend
npm install

# Frontend
cd <project>/frontend
npm install

# Environment Configuration
# Create .env in backend with required variables

Running Projects

# Terminal 1 - Backend
npm start               # or npm run dev

# Terminal 2 - Frontend
npm run dev             # or npm start

Project Comparison Matrix

Feature ChatGPT CI-CD GITHUB Docker ZERODHA ZOOM
Authentication No No Yes No Yes Yes
Real-time Features No No WebSocket No No WebSocket/WebRTC
Database MongoDB No MongoDB MongoDB MongoDB MongoDB
AWS Integration No No S3 No No No
AI Integration Gemini No No No No No
Docker No No No Yes No No
CI-CD Pipeline No Yes No No No No
Containerization No No No Yes No No
Authentication Method - - JWT/Passport - Passport Passport
Real-time Protocol - - Socket.IO - - Socket.IO/WebRTC

Learning Path

Beginner to Intermediate

  1. Start with ChatGPT - Understand MERN basics and AI integration
  2. Learn nodeapp-docker - Master containerization
  3. Explore ZERODHA - Build complex UIs and financial logic

Intermediate to Advanced

  1. Study CI-CD - Automate deployment and testing
  2. Build GITHUB - Implement version control concepts
  3. Master ZOOM - Real-time communication architecture

Best Practices Demonstrated

Code Organization

  • Modular component structure
  • Separation of concerns
  • Clear directory organization
  • Configuration management with environment variables

Security

  • Password hashing and encryption
  • Authentication and authorization
  • Input validation
  • CORS protection
  • Environment variable management

Database Design

  • Proper schema modeling
  • Indexing strategies
  • Query optimization
  • Data relationships

API Design

  • RESTful conventions
  • Proper HTTP methods
  • Error handling
  • Status codes
  • Response formatting

Frontend Development

  • Component composition
  • State management
  • Routing patterns
  • Responsive design
  • Performance optimization

DevOps

  • Containerization
  • CI-CD automation
  • Environment management
  • Testing automation

Common Issues and Solutions

MongoDB Connection Issues

  • Ensure MongoDB is running
  • Verify connection string in .env
  • Check MongoDB credentials

Port Already in Use

  • Identify process using port
  • Change port in configuration or .env
  • Kill process or use different port

Dependencies Installation

  • Clear npm cache: npm cache clean --force
  • Delete node_modules: rm -rf node_modules
  • Reinstall: npm install

CORS Errors

  • Check CORS configuration in Express
  • Verify frontend URL in backend
  • Ensure credentials are handled properly

Project Statistics

  • Total Projects: 6
  • Total Technologies: 30+
  • Backend Services: 6
  • Frontend Applications: 6
  • Databases Used: MongoDB
  • CI-CD Integration: GitHub Actions
  • Containerization: Docker & Docker Compose

Useful Commands

Git Operations

git init                           # Initialize repository
git add .                          # Stage all changes
git commit -m "message"            # Create commit
git push origin main               # Push to remote
git clone <url>                    # Clone repository

Node.js Commands

npm init                           # Initialize package.json
npm install                        # Install dependencies
npm start                          # Run application
npm run dev                        # Run in development mode
npm test                           # Run tests
npm run build                      # Build for production

Docker Commands

docker build -t image:tag .        # Build image
docker run -p host:container img   # Run container
docker-compose up                  # Start services
docker ps                          # List running containers
docker logs container_id           # View logs

MongoDB Commands

mongod                             # Start MongoDB server
mongo                              # Open MongoDB shell
db.collection.find()               # Query collection
db.collection.insertOne({})        # Insert document

Contributing Guidelines

When adding new projects or updating existing ones:

  1. Follow the same README structure
  2. Include technology stack section
  3. Provide clear setup instructions
  4. Add usage examples
  5. Document API endpoints
  6. Include learning objectives
  7. Test all commands before committing

Resources and References

Documentation

Learning Materials

  • Official framework documentation
  • Tutorial sections in individual project READMEs
  • Code comments and inline documentation
  • Example implementations

License

These projects are educational materials created for learning purposes as part of curriculum.

Contact and Support

For questions or clarifications about any project:

  1. Refer to the individual project README
  2. Check the code comments and documentation
  3. Review the API documentation
  4. Test examples provided

Project Status

All projects are functional and tested. Each project includes:

  • Comprehensive documentation
  • Setup instructions
  • Usage examples
  • Learning objectives
  • Best practices

About

Six independent full-stack projects, each focusing on different aspects of web development including AI integration, containerization, version control systems, financial platforms, and real-time communication applications

Resources

Readme
Activity

Stars

0 stars

Watchers

0 watching

Forks

0 forks
Report repository

Releases

Packages

Contributors

Languages