This repository contains 28 mini projects built using Vanilla JavaScript. Each project is designed to improve JavaScript fundamentals, DOM manipulation, event handling, and API interaction.
- No frameworks – Just pure JavaScript, HTML, and CSS.
- Beginner-friendly – Simple, structured, and easy to follow.
- Real-world projects – Includes modals, counters, APIs, dark mode, sliders, etc.
- Source code included – Fully open-source and easy to customize.
✅ DOM Manipulation ✅ Event Listeners ✅ Local Storage ✅ Fetch API ✅ Responsive Design ✅ CSS Transitions & Animations ✅ JavaScript ES6+ Features
| # | Project Name | Description |
|---|---|---|
| 01 | Color Flipper | Change background colors on button click. |
| 02 | Counter | A simple increment/decrement counter. |
| 03 | Reviews | Show user reviews with next/prev buttons. |
| 04 | Navbar | Responsive navigation menu. |
| 05 | Sidebar | Toggleable sidebar. |
| 06 | Modal | Open/close a modal window. |
| 07 | Questions | Expand/collapse FAQ items. |
| 08 | Menu | Filter menu items dynamically. |
| 09 | Video | Play/Pause video with JS. |
| 10 | Scroll | Scroll event effects. |
| 11 | Tabs | Tabbed content navigation. |
| 12 | Countdown Timer | Countdown to an event. |
| 13 | Lorem Ipsum | Generate random text. |
| 14 | Grocery Bud | Add/remove items from a list. |
| 15 | Slider | Image slider with buttons. |
| 16 | Counter (Advanced) | More counter functionality. |
| 17 | Gallery | Image gallery with zoom. |
| 18 | Numbers | Animated number counters. |
| 19 | Dark Mode | Toggle dark/light theme. |
| 20 | Filters | Filter list dynamically. |
| 21 | Dad Jokes API | Fetch jokes from an API. |
| 22 | Products | Display product list dynamically. |
| 23 | Random User API | Fetch user data from API. |
| 24 | Cocktail API | Fetch cocktail recipes. |
| 25 | Slider (Advanced) | More slider features. |
| 26 | Stripe Submenus | Dynamic submenu navigation. |
| 27 | Pagination | Paginate list items dynamically. |
| 28 | Wikipedia API | Search Wikipedia with API. |