Module 15
Mini Projects
Build 10 real projects using HTML, CSS, and JavaScript. Each project comes with step-by-step guidance.
Prerequisite Complete at minimum Module 09 — JavaScript Basics and Module 10 — DOM Manipulation before starting projects.
📋 Each Project Includes
- Project overview and goals
- Folder structure
- Step-by-step build instructions
- Full code with explanations
- Challenges to push yourself further
- Improvement ideas
🏗 Projects
Project 01
Digital Clock
Live updating clock with hours, minutes, and seconds.
EasyProject 02
Calculator
Fully functional calculator with keyboard support.
EasyProject 03
Todo App
Add, complete, and delete tasks. Saved to localStorage.
EasyProject 04
Password Generator
Generate secure passwords with customisable options.
EasyProject 05
Quiz App
Multiple-choice quiz with score tracking.
MediumProject 06
Counter App
Increment, decrement, and reset counter.
EasyProject 07
Color Generator
Generate and copy random hex colour codes.
EasyProject 08
Weather UI
Realistic weather UI mockup with HTML and CSS.
MediumProject 09
Expense Tracker
Track income and expenses. Balance calculated automatically.
MediumProject 10
Notes App
Create, edit, and delete notes. Persisted in localStorage.
Medium