This Repository contain awesome vanilla JavaScript projects.

Overview

Awesome JavaScript Projects

You can Have a look here Website

Maintenance PRs Welcome Open Source Love svg1 contributions welcome

GitHub issues GitHub forks GitHub stars

Are you a Newbie in Web development and want to dive deep into Javascript?

Are you looking for some awesome Javascript Projects in which each and every project will teach you an important Javascript Concept?

Do you want to contribute to some Awesome Javascript projects and showcase your Javascript skills through it? 🤩

Then, You got here right!!

Awesome Javscript Projects Website contain many awesome Vanilla Javascript Projects in which each and every project will teach you some new and important javscript concepts. It includes concepts like Functional Components, Class Components, Math Objects, Arrow functions, APIs and many more.

The Main Motive of this project is to make you fall rise in love with Javascript. You will be in love with the beauty of Javascript.

What we have for you here?

So, What are you waiting for?

Tech-Stack :

HTML5 CSS3 JavaScript

Contribution is fun! 💚

In order to make a hassle-free environment, I implore you all (while contributing) to follow the instructions mentioned below!

Happy Submissions 🙂

Contribution Guidelines 🏗

Are we missing any of your favorite features, which you think you can add to it We invite you to contribute to this project and make it better. To start contributing, follow the below guidelines:

1. Fork this repository.

2. Clone your forked copy of the project.

git clone https://github.com/<your_user_name>/awesome-javascript-projects.git

3. Navigate to the project directory 📁 .

cd awesome-javascript-projects

4. Add a reference(remote) to the original repository.

git remote add upstream https://github.com/vishal-raj-1/awesome-javascript-projects.git 

5. Check the remotes for this repository.

git remote -v

6. Always take a pull from the upstream repository to your master branch to keep it at par with the main project(updated repository).

git pull upstream main

7. Create a new branch.

git checkout -b <your_branch_name>

8. Perfom your desired changes to the code base.

9. Track your changes ✔️ .

git add . 

10. Commit your changes .

git commit -m "Relevant message"

11. Push the committed changes in your feature branch to your remote repo.

git push -u origin <your_branch_name>

12. To create a pull request, click on compare and pull requests.

13. Add appropriate title and description to your pull request explaining your changes and efforts done.

14. Click on Create Pull Request.

15 Voila You have made a PR to the awesome-javascript-projects 💥 . Wait for your submission to be accepted and your PR to be merged.

This Project is a part of the following Open Source Program

CrossWoc    GSSOC

Project Admin 😃

Our valuable Contributors 👩‍💻 👨‍💻 :

Comments
  • Grocery Bud

    Grocery Bud

    Closes: #740

    Describe the changes you've made

    Added the grocery bud.

    Checklist:

    • [ ] My code follows the style guidelines of this project.
    • [ ] I have performed a self-review of my own code.
    • [ ] I have commented my code, particularly in hard-to-understand areas.
    • [ ] I have made corresponding changes to the documentation.
    • [ ] New and existing unit tests pass locally with my changes.

    Screenshots

    Screenshot (145)

    opened by Amit366 23
  • Quiz app in JS

    Quiz app in JS

    closes: #321 solved

    This app contains several questions and will continue until user stops it by clicking on "stop" button also questions would be shuffled everytime.

    assigned gssoc21 level2 
    opened by Aarti002 23
  • Movie search app

    Movie search app

    I would like to add a movie search app using API and can display various movies with the word you searched I would like @urvashi-code1255 @Vishal-raj-1 to please assign me this project. I am a GSSOC'21 participant and want to contribute to this project

    assigned LGMSOC21 🟥 Level4 
    opened by SatyaPrakash26 20
  • Blurry-Effect-Interface Project

    Blurry-Effect-Interface Project

    Related Issue

    • Separated the .html file in public folder , .css and .js in assest folder.
    • allow this project edit by maintainers.

    Closes: #225 , #169

    Describe the changes you've made

    • Separated the .html file in public folder , .css and .js in assest folder.
    • allow this project edit by maintainers.

    Describe if there is any unusual behaviour of your code(Write NA if there isn't)

    NA

    Screenshots

    BEFORE - Screenshot (107)

    AFTER - Screenshot (108)

    gssoc21 level2 
    opened by gaurav24072002 19
  • Create a Music App with JavaScript #887  Open

    Create a Music App with JavaScript #887 Open

    hi, @991rajat & @harshgupta20 hope you well, I completed task #887 please reviews the code. I have added some screenshots hope you can help in the code review

    Sorry For Dealy

    Screenshot (111) Screenshot (114)

    gssoc21 level2 gssoc'21 
    opened by WebVishal 18
  • Resposive Website

    Resposive Website

    Pages like Netflix, password generator, new year count down any many others are not responsive . Can I make them responsive [GSSOC'21]

    Please assign me this issue @urvashi-code1255 @Vishal-raj-1

    gssoc'21 
    opened by EkjotKaur 17
  • COVID-19 Live Stats Responsive Website

    COVID-19 Live Stats Responsive Website

    I would like to contribute to this project by adding a COVID-19 Live Stats Responsive Website. It's a website which will show COVID-19 live statistics by country. Made with HTML, CSS, and JavaScript.

    Please , kindly assign this task to me under GSSoC 21'

    javascript gssoc21 level2 
    opened by sejalxz 16
  • Shopping cart added based on rock band

    Shopping cart added based on rock band

    Related Issue

    • Info about Issue or bug

    Closes: #792

    Checklist:

    • [x] My code follows the style guidelines of this project.

    • [x] I have performed a self-review of my own code.

    • [x] I have commented my code, particularly in hard-to-understand areas.

    • [x] New and existing unit tests pass locally with my changes.

    Screenshots

    Put any screenshot(s) of the project here.

    gssoc21 level3 gssoc'21 
    opened by recursiveway 15
  • Interest Calculator

    Interest Calculator

    This is a Simple Interest Calculator.

    Related Issue

    • Info about Issue or bug

    Closes: #[issue number that will be closed through this PR]

    Describe the changes you've made

    A clear and concise description of what you have done to successfully close your assigned issue. Any new files? or anything you feel to let us know!

    Describe if there is any unusual behaviour of your code(Write NA if there isn't)

    A clear and concise description of it.

    Checklist:

    • [x] My code follows the style guidelines of this project.
    • [x] I have performed a self-review of my own code.
    • [ ] I have commented my code, particularly in hard-to-understand areas.
    • [ ] I have made corresponding changes to the documentation.
    • [x] New and existing unit tests pass locally with my changes.

    Screenshots

    Put any screenshot(s) of the project here.

    gssoc21 level2 
    opened by archana-9430 15
  • Search Bar

    Search Bar

    Deliverables:

    • Add search functionality to the existing Search bar so that projects can be found easily.
    • Ignore case sensitivity(means if anyone searches for counter or Counter) he/she will get the Counter project.
    javascript gssoc21 level1 
    opened by ghost 15
  • Home page has lots of bug

    Home page has lots of bug

    Describe the bug

    A clear and concise description of what the bug is. I want to fix the bug of the navbar, about us section for GSSOC 21.

    To Reproduce

    Steps to reproduce the behavior: 1. 2. 3. 4.

    Expected behavior

    A clear and concise description of what you expected to happen.

    Logs

    If applicable, add logs to help explain your problem (e.g. the error message and/or exception traceback).

    Environment (please complete the following information):

    • OS:
    • Browser:

    Additional context

    Add any other context about the problem here.

    bug gssoc21 level0 gssoc'21 
    opened by sheetalj2205 14
  • Certified Course to Build Candidates Resume

    Certified Course to Build Candidates Resume

    This resource has a wealth of resources for JavaScript beginners and learners.

    Related Issue

    • Info about Issue or bug

    Closes: #[issue number that will be closed through this PR]

    Describe the changes you've made

    A clear and concise description of what you have done to successfully close your assigned issue. Any new files? or anything you feel to let us know!

    Describe if there is any unusual behaviour of your code(Write NA if there isn't)

    A clear and concise description of it.

    Checklist:

    • [ ] My code follows the style guidelines of this project.
    • [ ] I have performed a self-review of my own code.
    • [ ] I have commented my code, particularly in hard-to-understand areas.
    • [ ] I have made corresponding changes to the documentation.
    • [ ] New and existing unit tests pass locally with my changes.

    Screenshots

    Put any screenshot(s) of the project here.

    opened by letscode-17 0
  • Overflow issue

    Overflow issue

    Describe the bug

    🔴When we are on Mobile view, there is overflow which creates a scroll and a unexpected strip is visible ..... 🔴 You can also work on the theme button you can align it properly , coz according to ux rule it's not an appropriate place for this button

    Screenshot_2022-04-13-23-35-35-51_40deb401b9ffe8e1df2f1cc5ba480b12

    bug 
    opened by deepakydv9315 11
  • Repition Projects

    Repition Projects

    Describe the bug

    Many project are seen more than one time. There are repition of the projects.

    Environment (please complete the following information):

    • OS: Mac
    • Browser: Chrome
    bug 
    opened by Sabarinathan07 1
  • Image Compressor/Re-sizer App

    Image Compressor/Re-sizer App

    Is your feature request related to a problem? Please describe. No its not a problem. I want to add an additional project.

    Describe the solution you'd like I want to add my Image resizer app to this projects collection

    Additional context User can upload an image and change its quality, width and height.

    It's gonna be my first PR

    opened by ozair-dev 1
  • New Changes for this Repo

    New Changes for this Repo

    Project Update

    Currently, we have more than 700 projects in this repo. Most of them are complete but there can be a lot of improvement. But before that, we need to scale our project !! Currently, the repo size is more than 1.5 GB which is huge.

    Things we have to do right now:

    1. There are more than 1000 images in this project, first of all, the task will be to compress these images.
    2. We can minify our HTML, CSS, and JS Files.

    Things we will do:

    1. Remove duplicate projects, if found.
    2. Rather than putting projects randomly we can have categories, Like Algorithms, Games, Web App...

    Ideas?

    Share your idea, how we can scale this project !!! and anything else you want.

    enhancement help wanted up-for-grabs urgent 
    opened by Vishal-raj-1 0
Owner
Vishal Rajput
Frontend Developer Intern @UpSkill-India || Competitive Programmer || Open Source Enthusiast
Vishal Rajput
🪙💬 Update a gist to contain a crypto price

crypto-box Update a pinned gist to contain a crypto price ?? ✨ For more pinned-gist projects like this one, check out: matchai/awesome-pinned-gists Se

Austen Stone 3 Nov 30, 2022
This repo. contain some "Login page" , That I have made during learning and practicing HTML & CSS.

Login-Page This repo. contain some "Login page" , That I have made during learning and practicing HTML & CSS. Table of content: v1 v2 Objective and Re

Ayush Mishra 1 Jan 28, 2022
A simple react project that contain a single page application (SPA) And a simple caculator to make some calculation and there is a section you can see some Math quotes. Ⓜ💯

A simple react project that contain a single page application (SPA) And a simple caculator to make some calculation and there is a section you can see some Math quotes. Ⓜ??

Reem janina 7 May 31, 2022
Notes may contain grammatical errors and some wont make sense and will only make sense to me

This is my own notes containing all the information and knowledge I've gained during my studying sessions. The notes are all topics that relates to technology such as computers, software or programming.

null 126 Dec 15, 2022
It will be contain many algorithms about js for job interviews.

Algortihms with Javascript ?? ?? TR: Bu projenin temel amacı, işe girerken yapılan mülakatlar için bizlere sunulan algoritma soruları ve çözümlerini i

asmodeus 18 Dec 3, 2022
This project is an Awesome Books web page where users can add or remove books from the site. It also displays a list of the books added to the collection. This Awesome books webpage was created using ES6.

Awesome books App using Module Awesome books App using Module This book list was built using modules and other ES6 syntax. It allows users to add/remo

Esther Udondian 6 Jul 25, 2022
An Awesome Toggle Menu created with HTML,CSS,JQuery,font-awesome and line by line comment.

Demo : https://blackx-732.github.io/AwesomeMenu/ Under open source license No ©copyright issues Anyone can be modify this code as well Specifically we

BlackX-Lolipop 2 Feb 9, 2021
Awesome books is a vanilla Javascript which offers CRUD functionalities allowing you to add, remove edit boks info and store it to the local storage.

Awesome Books Awesome books is a simple project that displays new books when a user updates them. Built With HTML-5 CSS3 Javacript Linters Live Demo L

Nemwel Boniface 23 Aug 6, 2022
Awesome Books project with ES6 is an application that was built using Vanilla JavaScript with ES6 features like using arrow functions. This application allows you to keep records of your favorite books.

Javascript Project Awesome Books with ES6 Using Javascript to create a simple Awesome Books project. Populating the books list and then removing one b

Ghazanfar Ali 8 Sep 28, 2022
Fast and lightweight dependency-free vanilla JavaScript polyfill for native lazy loading / the awesome loading='lazy'-attribute.

loading="lazy" attribute polyfill Fast and lightweight vanilla JavaScript polyfill for native lazy loading, meaning the behaviour to load elements rig

Maximilian Franzke 571 Dec 30, 2022
Unofficial HelmRelease search through awesome k8s-at-home projects

k8s at home search (unofficial) Search Flux HelmReleases through awesome k8s-at-home projects, check it out at https://whazor.github.io/k8s-at-home-se

Nanne 92 Jan 2, 2023
🎉 A curated list of awesome Buildspace projects.

Awesome Buildspace A curated list of awesome Buildspace projects. Please check the contribution guidelines for information on formatting and writing p

Alberto Cruz Luis 12 Dec 6, 2022
An opensource platform to connect with awesome collaborators to work with your side-projects✨

ProStack ?? An open-source platform ?? to peep into some highly interesting and exciting projects & connect with those project's owner for collaborati

Parth Pandya. 6 Jul 18, 2022
This is a vanilla Node.js rest API created to show that it is possible to create a rest API using only vanilla Node.js

This is a vanilla Node.js rest API created to show that it is possible to create a rest API using only vanilla Node.js. But in most cases, I would recommend you to use something like Express in a production project for productivity purposes.

Eduardo Dantas 7 Jul 19, 2022
This Repository consist of Daily learning JS, Assignments, coding challenge, projects, references, tutorial

?? A Tour of JavaScript This Repository consist of Daily learning, Assignments, coding challenge, projects, references, tutorial. ??‍?? ??‍?? alert(

null 23 Sep 7, 2022
This repository contains different infrastructure components that are used in different projects here at NaN Labs.

Infrastructure Reference Changelog | Contributing This repository contains different infrastructure components that are used in different projects her

NaN Labs 10 Dec 15, 2022
🐢 A collection of awesome browser-side JavaScript libraries, resources and shiny things.

Awesome JavaScript A collection of awesome browser-side JavaScript libraries, resources and shiny things. Awesome JavaScript Package Managers Componen

chencheng (云谦) 29.6k Dec 29, 2022
"Awesome books" is a simple website that displays a list of books and allows you to add ang remove books from that list. Also you can store your data in your local storage. Build with JavaScript, HTML and CSS.

Awesome Books Creating an app that adds and delete books from a list. Built With HTML CSS JavaScript Application Page url https://TimmyChan99.github.i

Fatima Ezzahra elmenoun 5 Jan 28, 2022
Awesome-Books project uses practical tests for JavaScript/Html and CSS functions.

Awesome-Books project uses practical tests for JavaScript/Html and CSS functions. The project presents a basic website that allows users to add/remove books from a list.

Vahan Kh. 5 Jan 31, 2022