This is a collection of 100 days of JavaScript projects. Each day I will create a new project using vanilla JavaScript. The projects will be simple and easy to understand. I will also add a README.md file to each project with a description of the project and how to run it.
This is a simple counter app using vanilla JavaScript.
This is a simple random hex color generator. It generates a random hex color and displays it on the screen. It also displays the hex color code.
This is a simple random number generator. It generates a random number between 1 and 10 and displays it on the screen.
This is a simple modal popup app. It is a simple app that shows a modal popup when you click on the button.
This is a simple palindrome checker. It checks if the string is a palindrome or not.
This app is used to count the number of vowels in a string.
This is a simple example of how to copy text to clipboard using JavaScript.
This is a simple script to generate download link for Google Drive files.
This is a simple app that counts the number of characters in an input field. It also changes the color of the text depending on the number of characters.
This is a simple app that detects the internet connection and shows the status of the internet connection.
This is a simple quiz app built with JavaScript
This is a simple quiz app that uses the Geolocation API to get the user's location and display it on a map.
This project is a simple HTTP request project that uses the Fetch API to make a request to the user.json
file and display the data on the page.
This project is a simple Random quote generator project the Fetch API to make a request to the Type.fit API to get a random quote.
This is a simple weather app that uses the OpenWeatherMap API to get the weather data. It uses the geolocation API to get the user's location and then uses the OpenWeatherMap API to get the weather data for that location. It also has a search bar that allows the user to search for a city and get the weather data for that city.
This project is a simple list search app.
This project is a simple countdown timer that counts down to a specific date. It is built with HTML, CSS, and JavaScript.
This project is a simple countdown timer that counts down to a specific date. It is built with HTML, CSS, and JavaScript.
This is a simple tip calculator app that calculates the tip amount and total amount based on the bill amount and tip percentage.
This is a simple smooth scroll demo.
This is a simple sticky nav bar on scroll demo.
This is a simple project that shows how to switch the active menu item when the user scrolls down the page.
This is a simple scroll to top button that will appear when the user scrolls down the page. It will disappear when the user scrolls back to the top of the page.
This is a responsive mobile menu that is built with HTML, CSS and JavaScript. It is a simple menu that is built with a hamburger icon and a dropdown menu. The menu is responsive and will change to a dropdown menu when the screen size is less than 768px.
This is a responsive mobile menu with a hamburger icon. The menu is hidden by default and will be shown when the hamburger icon is clicked. The menu will be hidden again when the hamburger icon is clicked again.
This is a responsive mobile submenu. The menu is hidden by default and will be shown when the hamburger icon is clicked. The menu will be hidden again when the hamburger icon is clicked again.
This is a simple scroll indicator that shows the percentage of the page that has been scrolled.
This is a simple newsletter form that appears on scroll. It is built with HTML, CSS and JavaScript.
This is a simple page animation with AOS.
This is a simple password generator. The password contains uppercase and lowercase letters, numbers and special characters. It is built with HTML, CSS and JavaScript.
This is a simple example of how to use local storage in a web application.
This is a simple todo app that uses HTML, CSS and JavaScript. It uses LocalStorage to store the todo items.
This is a simple notes app that allows you to create, edit, and delete notes. It uses the browser's local storage to store the notes.
This is a simple BMI calculator app. It calculates the BMI of a person and gives the result.
This is a simple calculator app. It performs basic arithmetic operations.
This is a simple digital clock app. It displays the current time.
This is a simple weight converter that converts from pounds to kilograms and vice versa.
This is a simple temperature converter that converts from Celsius to Fahrenheit , Kelvin and vice versa.
This is a simple jumping game. The player has to jump over the obstacles to score points.
This is a simple word count tool. It counts the number of words in a text.
This is a simple accordion. It is built with HTML, CSS and JavaScript.
This is a simple random joke generator that uses the icanhazdadjoke API to get a random joke. It uses the async/await syntax.
This is a simple example of how to use modules in JavaScript. It uses the import and export syntax.
This is a simple GitHub profile search app. It uses the GitHub API to get the user's profile information and display it on the page.
This is a simple Wikipedia search app. It uses the Wikipedia API to get the search results and display it on the page.
This is a simple lyrics search app. It uses the lyrics.ovh API to fetch the lyrics of the song.
This is a simple image slider that uses the transition
property to animate the images.
This is a collection of exercises to practice using array methods.
The data attribute is used to store custom data private to the page or application. The attributes can then be used in the JavaScript to create a more engaging user experience (without any Ajax calls or server-side database queries).
This is a simple product filter that allows you to filter products by category.