Loading repository data…
Loading repository data…
Shubham-cyber-prog / repository
🚀 100 Days of Web Development challenge using HTML, CSS & JavaScript. Daily learning, practice, and real-world projects to strengthen frontend development skills.
A transparent discovery signal based on current public GitHub metadata.
This score does not audit code, security, maintainers, documentation quality, or suitability. Verify the repository and its current documentation before adoption.
This repository documents my 100+ Days of Web Development journey, where I:
| Day | Project | Skills Learned |
|---|---|---|
| 1 | Personal Portfolio | HTML Structure, CSS Styling, Flexbox |
| 2 | Responsive Landing Page | Media Queries, Grid Layout |
| 3 | Todo List | DOM Manipulation, Event Listeners |
| 4 | Weather App | API Integration, Fetch API |
| 5 | Calculator | JavaScript Logic, Functions |
| 6 | Quiz App | Conditional Logic, Arrays |
| 7 | Expense Tracker | Local Storage, Data Management |
| 8 | Pomodoro Timer | setInterval, Date Objects |
| 9 | Note Taking App | CRUD Operations, Storage |
| 10 | Recipe Book | Template Strings, Array Methods |
| 11-20 | Blog, E-commerce, Chat UI, Music Player, Drawing App, Password Generator, Unit Converter, Countdown Timer, Tip Calculator, QR Code Generator |
| Advanced CSS, Canvas API, Security |
| 21-30 | Flashcards, Markdown Previewer, Currency Converter, BMI Calculator, Quote Generator, Image Gallery, Dice Roller, Rock Paper Scissors, Memory Game, Tic Tac Toe | Game Logic, API Integration, Animations |
🎓 Skills Mastered: HTML5, CSS3, Vanilla JavaScript, DOM, Local Storage, Basic APIs
| Day | Project | Skills Learned |
|---|---|---|
| 31 | Job Board | Dynamic Content, Filtering |
| 32 | Social Media Dashboard | Data Visualization, Charts |
| 33 | Real Estate Website | Complex Layouts, Forms |
| 34 | Hotel Booking System | Date Pickers, Validation |
| 35 | Food Delivery App | Cart Logic, State Management |
| 36 | Fitness Tracker | Progress Tracking, Charts |
| 37 | Event Management | Calendar Integration, Scheduling |
| 38 | Booking Appointment System | Time Management, Notifications |
| 39 | Online Learning Platform | Video Integration, Progress |
| 40 | Movie Database | TMDB API, Search Functionality |
| 41-50 | GitHub Profile Finder, Stock Tracker, News Aggregator, Chat App (Firebase), Project Management, E-commerce Cart, Banking Dashboard, Flight Booking, Recipe Sharing, Blog with CMS | Firebase, Real-time Data, Node.js Basics |
| 51-60 | Portfolio+Blog, Task Board, File Uploader, Code Editor, Voice Notes, Expense Splitter, Habit Tracker, Budget Planner, Meal Planner, Travel Planner | Web Speech API, File APIs, Advanced State |
🎓 Skills Mastered: REST APIs, Firebase, Node.js Basics, Web APIs, Complex State Management
| Day | Project | Skills Learned |
|---|---|---|
| 61 | Fullstack E-commerce | React, MongoDB, Express |
| 62 | GitHub Stats Dashboard | GitHub API, Data Viz |
| 63 | Video Conferencing | WebRTC, Peer Connections |
| 64 | Online Code Editor | Monaco Editor, Compilers |
| 65 | Real-time Collaboration | Socket.io, Operational Transform |
| 66 | Stock Trading Simulator | Real-time Data, Charts |
| 67 | Multiplayer Game | Canvas, Socket.io, Game Logic |
| 68 | AI Chatbot | OpenAI API, NLP |
| 69 | Open-Source E-commerce Template | Modular Architecture |
| 70 | Data Visualization Dashboard | D3.js, Complex Charts |
| 71-80 | Portfolio Template, IoT Dashboard, ML UI (TensorFlow.js), Voice Assistant, AR Web App, PWA News App, Real-time Analytics, Learning Games, Job Platform, Project Management SaaS | TensorFlow.js, WebXR, Three.js, PWA |
| 81-90 | Healthcare Portal, E-learning Platform, AI Tools Directory, Chat Support, UI Component Library, Food Delivery System, Personal Assistant, Video Streaming, Smart Home, Enterprise CRM | Next.js, Prisma, React Native, HLS.js |
🎓 Skills Mastered: React, Next.js, WebRTC, Socket.io, AI/ML, Progressive Web Apps, Advanced Backend
| Days | Project Category | Technologies |
|---|---|---|
| 91-100 | Platform Clones | LeetCode Clone, Hackathon Website, Open Source Contribution, PWA, MERN Stack, AI-Powered App, Smart Community Hub, Campus Platform, Music App (Spotify API), Survival Protocol |
| 101-120 | Creative & Advanced | Canvas Particle Animation, Interactive Storytelling, README Toolkit, 3D Model Viewer, Form Builder, Dashboard (D3.js), Solar System, AI Image Editor, Custom CMS, Advanced E-commerce, Social Network, LMS |
| 121-140 | AI & Blockchain | AI Resume Builder, Smart Contracts (Solidity), Advanced Blog (GraphQL), AI Chat App, Sustainable Dev Platform, AI Code Review Tool, Social Media Platform, AI Image Recognition, Ultimate Kanban, AI Translation App, Advanced CRM, Virtual Assistant, Inventory Management, Sentiment Analysis |
| 141-150+ | Production Ready | Time Tracking (ApexCharts), AI SEO Tool, Recruitment Platform, AI Social Media Manager, Chess Game, AI Customer Support, Financial Planning, AI Document Summarizer, Knowledge Base, AI Video Analysis, Mini Geo Guesser, Newsly, Snake Game, Tetris, Time Fracture Arena |
🎓 Skills Mastered: Full-stack Development, AI/ML Integration, Blockchain, Production Deployment, System Design
graph LR
A[Day 1-30<br/>Beginner] --> B[Day 31-60<br/>Intermediate]
B --> C[Day 61-90<br/>Advanced]
C --> D[Day 91-150+<br/>Expert]
A --> E[HTML/CSS/JS]
B --> F[APIs/Firebase]
C --> G[React/Node.js]
D --> H[Full-stack/AI]
E --> I[Portfolio Ready]
F --> I
G --> I
H --> I
Week 1-4: Master HTML, CSS, Vanilla JS fundamentals
Week 5-8: API integration, Local Storage, Firebase basics
Week 9-12: React, State Management, Backend basics
Week 13-16: Advanced frameworks, Real-time apps, WebRTC
Week 17-20: AI/ML integration, Blockchain, Production deployment
Week 20+: Build capstone projects, Contribute to open source