Welcome to the repository for 100+ mini web projects using HTML, CSS, and JavaScript. This collection serves as a comprehensive resource for developers of all levels to practice their skills, explore new techniques, and get inspired by a wide range of web projects. Consider this as the ideal companion if you want to embark on the 100 Days of Code journey and challenge yourself.
View the full collection on CodePen
Explore each project individually and view live demos to see them in action:
Check out our collection of articles for those beginning their web development journey. Find tips, tricks, and motivational content to keep you engaged and motivated throughout your learning process.
We want to hear from you! Help us tailor our content to better meet your needs by participating in our brief survey. Your feedback is invaluable in guiding us to create the most relevant and useful resources for developers and freelancers. Take the survey here.
To get started with these projects, follow these simple steps:
-
Fork the Repository: Click on the "Fork" button at the top-right corner of this page to create a copy of the repository in your GitHub account.
-
Clone the Repository: Clone the forked repository to your local machine using the following command in your terminal:
git clone https://github.com/Your-Username/html-css-javascript-projects.git
-
Open with VS Code: Open the cloned repository in Visual Studio Code (VS Code) or your preferred code editor.
-
Install Live Server Extension: If you haven't already, install the Live Server extension for VS Code. This extension allows you to launch a local development server and automatically refresh your browser whenever you make changes to your HTML, CSS, or JavaScript files. You can install it from the VS Code Marketplace.
-
Start Coding: Start exploring the projects, make changes, experiment with different ideas, and unleash your creativity! Use Live Server to preview your changes in real-time and see how they affect the project.
This repository is mostly based on two courses by Brad Traversy (2020):
In addition, other projects are adapted from various YouTube channels:
- Brad Traversy - Traversy Media
- Shaun Pelling - The Net Ninja
- Simo Edwin - Dev Ed
- Gary Simon - DesignCourse
- Kyle Cook - Web Dev Simplified
- Kevin Powell
- Florin Pop
If you find these projects helpful or interesting, please consider starring the repository. It's a simple gesture that helps to boost the visibility of the project and show appreciation for the effort put into creating it. Additionally, if you'd like to support my work further, you can become a sponsor. Your support is greatly appreciated. Thank you!