Skip to content

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.

Notifications You must be signed in to change notification settings

sakilk130/50-days-of-javascript

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

73 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

50 Days Of JavaScript

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.

Day 01 - Counter App

This is a simple counter app using vanilla JavaScript.

Day 02 - Random Hex Color Generator

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.

Day 03 - Random Number Generator

This is a simple random number generator. It generates a random number between 1 and 10 and displays it on the screen.

Day 04 - Modal Popup

This is a simple modal popup app. It is a simple app that shows a modal popup when you click on the button.

Day 05 - Palindrome Checker

This is a simple palindrome checker. It checks if the string is a palindrome or not.

Day 06 - Vowel Counter App

This app is used to count the number of vowels in a string.

Day 07 - Click to Copy

This is a simple example of how to copy text to clipboard using JavaScript.

Day 08 - Google Drive Download Link Generator

This is a simple script to generate download link for Google Drive files.

Day 09 - Input Character Counter

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.

Day 10 - Internet Connection Detector

This is a simple app that detects the internet connection and shows the status of the internet connection.

Day 11 - JavaScript Quiz App

This is a simple quiz app built with JavaScript

Day 12 - Geolocation API

This is a simple quiz app that uses the Geolocation API to get the user's location and display it on a map.

Day 13 - HTTP Request Project

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.

Day 14 - Random Quote Generator

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.

Day 15 - Weather App

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.

Day 16 - List Search Project

This project is a simple list search app.

Day 17 - Date Countdown

This project is a simple countdown timer that counts down to a specific date. It is built with HTML, CSS, and JavaScript.

Day 18 - Promo Countdown

This project is a simple countdown timer that counts down to a specific date. It is built with HTML, CSS, and JavaScript.

Day 19 - Tip Calculator

This is a simple tip calculator app that calculates the tip amount and total amount based on the bill amount and tip percentage.

Day 20 - Smooth Scroll

This is a simple smooth scroll demo.

Day 21 - Sticky Nav Bar on Scroll

This is a simple sticky nav bar on scroll demo.

Day 22 - Active Menu Switcher

This is a simple project that shows how to switch the active menu item when the user scrolls down the page.

Day 23 - Scroll to Top

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.

Day 24 - Responsive Mobile Menu

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.

Day 25 - Responsive Mobile Menu 2

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.

Day 26 - Responsive Mobile Submenu

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.

Day 27 - Scroll Indicator

This is a simple scroll indicator that shows the percentage of the page that has been scrolled.

Day 28 - Newsletter Form on Scroll

This is a simple newsletter form that appears on scroll. It is built with HTML, CSS and JavaScript.

Day 29 - Page Animation with AOS

This is a simple page animation with AOS.

Day 30 - Password Generator

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.

Day 31 - Local Storage

This is a simple example of how to use local storage in a web application.

Day 32 - Todo App

This is a simple todo app that uses HTML, CSS and JavaScript. It uses LocalStorage to store the todo items.

Day 33 - Notes App

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.

Day 34 - BMI Calculator

This is a simple BMI calculator app. It calculates the BMI of a person and gives the result.

Day 35 - Calculator

This is a simple calculator app. It performs basic arithmetic operations.

Day 36 - Digital Clock

This is a simple digital clock app. It displays the current time.

Day 37 - Weight Converter

This is a simple weight converter that converts from pounds to kilograms and vice versa.

Day 38 - Temperature Converter

This is a simple temperature converter that converts from Celsius to Fahrenheit , Kelvin and vice versa.

Day 39 - Jumping Game

This is a simple jumping game. The player has to jump over the obstacles to score points.

Day 40 - Word Count Tool

This is a simple word count tool. It counts the number of words in a text.

Day 41 - Accordion

This is a simple accordion. It is built with HTML, CSS and JavaScript.

Day 42 - Random Joke Generator using Async/Await

This is a simple random joke generator that uses the icanhazdadjoke API to get a random joke. It uses the async/await syntax.

Day 43 - Modules import/export

This is a simple example of how to use modules in JavaScript. It uses the import and export syntax.

Day 44 - GitHub Profile Search

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.

Day 45 - Wikipedia Search

This is a simple Wikipedia search app. It uses the Wikipedia API to get the search results and display it on the page.

Day 46 - Lyrics Search

This is a simple lyrics search app. It uses the lyrics.ovh API to fetch the lyrics of the song.

Day 47 - Image Slider

This is a simple image slider that uses the transition property to animate the images.

Day 48 - JS Array Methods

This is a collection of exercises to practice using array methods.

Day 49 - Data Attribute

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).

Day 50 - Product Filter

This is a simple product filter that allows you to filter products by category.

About

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.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published