Awesome
Amazing-Js-Projects
<a href="https://hacktoberfest.digitalocean.com/"><img alt="HacktoberFest'21" title="HacktoberFest'21" width=100% src="https://miro.medium.com/v2/resize:fit:1400/1*Lz_KFgbak2sUjwjOG9SZ4g.png"></a>
<div align="center"><a href="https://github.com/arpit4567jain/Amazing-Js-Projects/issues"><img src="https://img.shields.io/github/issues/arpit4567jain/Amazing-Js-Projects"></a> <a href="https://github.com/arpit4567jain/Amazing-Js-Projects/pulls"><img src="https://img.shields.io/github/issues-pr/arpit4567jain/Amazing-Js-Projects"></a> <a href="https://github.com/arpit4567jain/Amazing-Js-Projects/network/members"><img src="https://img.shields.io/github/forks/arpit4567jain/Amazing-Js-Projects"></a> <a href="https://github.com/arpit4567jain/Amazing-Js-Projects/stargazers"><img src="https://img.shields.io/github/stars/arpit4567jain/Amazing-Js-Projects"></a> <a href="https://github.com/arpit4567jain/Amazing-Js-Projects"><img src="https://img.shields.io/github/repo-size/arpit4567jain/Amazing-Js-Projects?color=yellow"></a>
</div>This project was a part of the following Open Source Program
<div align="center"> <a href="https://gssoc.girlscript.tech/"> <img width="65%" src="https://camo.githubusercontent.com/254612e762d0ee6a52de5d455d24b2be371f8c2f351c03d37d6c4b370b445b98/68747470733a2f2f692e706f7374696d672e63632f6b34306e747356342f31353030783530302e6a7067" /> </a> </div> <br /> <div align="center"> <a href="https://www.devincept.com/"> <img width="55%" src="https://user-images.githubusercontent.com/56088741/123548852-1ef59d00-d784-11eb-8e39-255e0c3e97d5.gif" />  </a> </div> <br /> <div align="center"> <a href="https://hacktoberfest.digitalocean.com/"> <img width="55%" src="https://user-images.githubusercontent.com/59393136/135566614-5635902f-2907-4e01-8baf-3cb1b43a6b20.png" />  </a> </div><h3 align="center"> <a>👋 <strong>Join Us</strong> </a> </h3>Do you want to make project on JavaScript ? if yes then :point_down:
📌Introduction
HELLO FOLKS , <br><br> This repository contains many amazing projects written in HTML5 , CSS3 and JavaScript. Consider this repository as your personal space to find or add any new script that can make life easier for us and the Open Source community too, as a Developer, and find a utility of coding to burst out of boredom. Get started with coding exhilarating javascript, markup language and styling, that you can use to develop amazing products.
<hr>🎥 Demo
Website for this repository : https://amazing-js-projects.netlify.app/
Must Check These Repos Also
- Cool Front-End Templates
- Amazing Css effects
- Amazing Js Projects
- Web-Development-Path-And-Resources
- Open-Source-Programs
💻 Technologies
⭐ How to get started?
You can refer to the following steps on the basics of Git and Github and also contact the Project Mentors, in case you are stuck:
<img align="right" width="300" src="https://firstcontributions.github.io/assets/Readme/fork.png" alt="fork this repository" />If you don't have git on your machine, install it.
Fork this repository
Fork this repository by clicking on the fork button on the top of this page. This will create a copy of this repository in your account.
Clone the repository
<img align="right" width="300" src="https://firstcontributions.github.io/assets/Readme/clone.png" alt="clone this repository" />Now clone the forked repository to your machine. Go to your GitHub account, open the forked repository, click on the code button and then click the copy to clipboard icon.
Open a terminal and run the following git command:
git clone "url you just copied"
where "url you just copied" (without the quotation marks) is the url to this repository (your fork of this project). See the previous steps to obtain the url.
<img align="right" width="300" src="https://firstcontributions.github.io/assets/Readme/copy-to-clipboard.png" alt="copy URL to clipboard" />For example:
git clone https://github.com/xyz/Amazing-Js-Projects.git
where xyz
is your GitHub username. Here you're copying the contents of the Amazing-Js-Projects repository on GitHub to your computer.
Create a branch
Change to the repository directory on your computer (if you are not already there):
cd Amazing-Js-Projects
Now create a branch using the git checkout
command:
git checkout -b your-new-branch-name
For example:
git checkout -b abc
Make necessary changes and commit those changes
Now open file in a text editor, add your changes to it. Now, save the file.
If you go to the project directory and execute the command git status
, you'll see there are changes.
Add those changes to the branch you just created using the git add
command:
git add .
Now commit those changes using the git commit
command:
git commit -m "write about the changes you made in file"
Push changes to GitHub
Push your changes using the command git push
:
git push origin <branch-name>
replacing <branch-name>
with the name of the branch you created earlier.
Submit your changes for review
If you go to your repository on GitHub, you'll see a Compare & pull request
button. Click on that button.
Now submit the pull request.
voila ! You have done it , You will get a notification email once the changes have been merged by maintainer.
CONTRIBUTING A NEW PROJECT ?
Please adhere to these guidelines
-
Create a folder with the name of your project
-
Start building inside your folder with an entry file called index.html and after building, attach an image named "preview.png" within the folder root which represents the preview image of your template(preview image should be in .png format only)
-
Go into the style_link.json file and add an object corresponding to your project in the following format:
{
"name": "Name-of-folder-in-exact-case-used-in-naming",
"link": "Name-of-folder-in-exact-case-used-in-naming/index.html"
},
Important to note:
If the folder name has white spaces e.g "My Project", the object should be:
{
"name": "My Project", (not "my project" or "My project" or "My-project")
"link": "My%20Project/index.html" (not "My Project/index.html" or "My project/index.html"
},
Note: The name key is case sensitive and the link key is white space sensitive in the json object so if you have white spaces in the initial name of your folder, replace space with "%20" in the json link but if there are no white spaces like in the case of "ABlogPage" or "Form", use the exact name of the project
If the folder name has no white spaces e.g "My-project", the object should be:
{
"name": "My-project", (not "my-project" or "My-Project" or "My Project")
"link": "My-project/index.html" (not "My%20project/index.html" or "My-Project/index.html")
},
📌Till Then
Need Some Help in this Repo -> Web Development And Resourcses
<p align="center"><img src="http://www.gurpreetsaluja.com/wp-content/uploads/2016/05/always-keep-learning.png" width=30%></p> <hr> <h1 align=center> Project Admins ❤️ </h1> <p align="center"> <table> <tbody><tr> <td align="center"><a href="https://github.com/arpit456jain"><img alt="" src="https://avatars.githubusercontent.com/arpit456jain" width="100px;"><br><sub><b> Arpit Jain </b></sub></a><br></td> </a></td> </tbody></table> <h2 align=center> ✨ Contributors </h2>Thanks go to these Wonderful People 👨🏻💻: 🚀 Contributions of any kind are welcome!
<table> <tr> <td> <a href="https://github.com/arpit456jain/Amazing-Js-Projects/graphs/contributors"> <img src="https://contributors-img.web.app/image?repo=arpit456jain/Amazing-Js-Projects" /> </a> </td> </tr> </table> <hr> <h1 align=center>Happy Coding 👨💻 </h1>💬Join Our CodeSmashers Community
Join - https://discord.gg/gtYUZQSjTt
Feel free to contribute to this repo.