In the quest to improve my understanding of Javascript, I am on a journey to build small, medium and large projects using Vanilla Javascript
| Item | Day | Description | Project Link & Demo code |
|---|---|---|---|
| 54 | 41 | Content Placeholder | |
| 53 | 40 | Google Maps | |
| 52 | 40 | Drag and Drop | |
| 51 | 40 | News APP using API | |
| 50 | 39 | Password Generator | |
| 49 | 43 | COVID-19 Tracker | |
| 48 | 42 | Book API using ISBNDB API | |
| 49 | 43 | Random Jokes with api | |
| 48 | 43 | Number facts api | |
| 47 | 42 | Quiz App | |
| 46 | 39 | Notes App | |
| 45 | 40 | Sortable List [Drag & Drop] | |
| 44 | 39 | Music Player | |
| 43 | 38 | Custom Range Slider | |
| 42 | 38 | Feedback Widget [event bubbling & propagation] | |
| 41 | 36 | Live User Filter /Searchable List | |
| 40 | 35 | Testimonial Switcher | |
| 39 | 33 | Exchange Rate Converter using API | |
| 38 | 32 | Infinite scroll [fetch, scrollHeight, clientHeight] | |
| 37 | 32 | TODO List Using Local Storage [Insert adjacentHTML()] | |
| 36 | 25 | Weather APP using API | https://codepen.io/gs-maker/pen/jOVqbey |
| 35 | 24 | Breaking Bad Characters using API | https://codepen.io/gs-maker/pen/poNyPxz |
| 34 | 23 | Pexels Images App | https://codepen.io/gs-maker/pen/qBqbXGN |
| 33 | 22 | GITHUB Profiles using API | |
| 32 | 21 | Random Dog/Cat images APP using API | |
| 31 | 20 | Movie Database using API | |
| 30 | 19 | Recipe App using API [async/await/fetch] | https://codepen.io/gs-maker/pen/WNGVxBb |
| 29 | 18 | Random Images from Unsplash | https://codepen.io/gs-maker/pen/RwGzRWy |
| 28 | 18 | Scroll Animation | https://codepen.io/gs-maker/pen/MWjMeKw |
| 27 | 17 | Horizontal Tabs [add/remove/replace class + dataset] | https://codepen.io/gs-maker/pen/bGwymox |
| 26 | 17 | Vertical Tabs [add/remove active class + dataset] | https://codepen.io/gs-maker/pen/xxENarM |
| 25 | 17 | Product carousel | |
| 24 | 16 | Auto Speed Typing Effect | |
| 23 | 15 | Video Player | |
| 22 | 14 | Menu Items with filter (reduce/map/DOMContentLoaded) | |
| 21 | 13 | Verify Account with 6-Digit code | https://codepen.io/gs-maker/pen/VwKgdNR |
| 20 | 12 | Sticky Navigation with color change on scroll | https://codepen.io/gs-maker/pen/YzGBeeR |
| 19 | 12 | Vertical Image Slider | |
| 18 | 11 | Toast Notification | https://codepen.io/gs-maker/pen/mdrvXBv |
| 17 | 11 | Hidden - Expanding search field [toggle() method] | https://codepen.io/gs-maker/pen/poEGarb |
| 16 | 10 | Image Accordion [add/remove methods] | |
| 15 | 10 | Accordion Style Items [FAQs - add/remove methods] | https://codepen.io/gs-maker/pen/oNzmEXp |
| 14 | 10 | Modal [contains/remove/add methods] | https://codepen.io/gs-maker/pen/oNzaVaW |
| 13 | 10 | Side Bar Navigation [contains/remove/add methods] | https://codepen.io/gs-maker/pen/dypgQXp |
| 12 | 09 | Responsive Navigation [toggle() method] | https://codepen.io/gs-maker/pen/PoGyKPV |
| 11 | 08 | Pomodoro Timer [setInterval(), clearInterval()] | https://codepen.io/gs-maker/pen/wvzEQVL |
| 10 | 07 | Stopwatch [setInterval(), clearInterval()] | https://codepen.io/gs-maker/pen/JjRaYzM |
| 9 | 06 | Random Quote Generator [ Math.random()] | https://codepen.io/gs-maker/pen/RwGBvOL |
| 8 | 06 | Image Slider with next and previous | |
| 7 | 05 | Custom Progress Bar | https://codepen.io/gs-maker/pen/mdrjMJZ |
| 6 | 04 | Count Down | https://codepen.io/gs-maker/pen/qBaKJrZ |
| 5 | 03 | Animated Count Up | https://codepen.io/gs-maker/pen/zYKaKmX |
| 4 | 02 | Digital Clock | https://codepen.io/gs-maker/pen/gOwzjWN |
| 3 | 02 | Analog Clock with html-css-javascript | https://codepen.io/gs-maker/pen/ZEpoBJG |
| 2 | 01 | HEX Color Code generator using a for loop | |
| 1 | 01 | A simple counter with increment, reset and decrement |