This repository contains a collection of 10 mini projects built using only HTML, CSS, and JavaScript.
These projects are designed for beginner to intermediate-level learners to strengthen their understanding of JavaScript, DOM manipulation, and web interactivity.
Each folder inside this repo represents a self-contained mini project.
Use the deployed links provided below to preview each project live.
| S.No | Project Title | Live Link |
|---|---|---|
| 1 | Color Flipper | Preview |
| 2 | Dark Mode Toggle | Preview |
| 3 | Feedback UI | Preview |
| 4 | Palindrome Checker | Preview |
| 5 | Random Image Generator | Preview |
| 6 | Stop Watch | Preview |
| 7 | Testimonial Slider | Preview |
| 8 | Tip Calculator App | Preview |
| 9 | Video Popup | Preview |
| 10 | Weather App | Preview |
- HTML
- CSS
- JavaScript
Each mini project demonstrates a specific concept or UI pattern:
- ✅ DOM Manipulation
- ✅ Event Handling
- ✅ Form Validation
- ✅ Conditional Rendering
js-mini-projects/
├── color-flipper/
├── dark-mode-toggle/
├── feedback-ui/
├── palindrome-checker/
├── random-image-generator/
├── stop-watch/
├── testimonial-slider/
├── tip-calculator-app/
├── video-popup/
└── weather-app/
Each folder contains its own
index.html,style.css, andscript.jsfile.
By building these mini projects, learners will:
- Understand how to structure a JavaScript project
- Practice using functions, conditionals, and events
- Work with real-world UI interactions (e.g., form input, popups, toggles)
- Students enrolled in WSA Web Development Program
- Beginners practicing JavaScript and frontend basics
- Mentors looking to review structured frontend mini projects
© 2025 WSA. All rights reserved.