100_days_100_web_project

100_days_100_web_project

Welcome to 100_days_100_web_project! learn and practise web development by contributing your projects.

About

This repository contains 100 web projects from basic to intermediate using html css and js

PROJECT NAME --- LIVE DEMO
visit URL for live demo :- https://100-days-100-web-project.vercel.app/

Day	Project Name	Link to the Project Folder	Description
DAY-1	TODOLIST	TODOLIST
DAY-2	DIGITAL CLOCK	DIGITAL CLOCK
DAY-3	INDIAN FLAG	INDIAN FLAG
DAY-4	DROPDOWN NAV BAR	DROPDOWN NAV BAR
DAY-5	ANIMATED-CURSOR	ANIMATED-CURSOR
DAY-6	AUTO-BACKGROUND-IMAGE-SLIDER	AUTO-BACKGROUND-IMAGE-SLIDER
DAY-7	TYPEWRITER	TYPEWRITER
DAY-8	PARALLEL-X WEBSITE	PARALLEL-X WEBSITE
DAY-9	CAPTCHA-GENERATOR	CAPTCHA-GENERATOR
DAY-10	QR-CODE-GENERATOR	QR-CODE-GENERATOR
DAY-11	SERVING WEBSITE USING EXPRESS
DAY-12	NODEMAILER GMAIL SENDER	NODEMAILER GMAIL SENDER	to use this email sender you need to first clone this repo ->open folder gmail_nodemailer npm i -> nodemon index.js -> open http://localhost:51000/ -> enter your name and email address server automatically will share a email to you from my side . that's it all set.
DAY-13	LOGIN FORM USING MERN	LOGIN FORM USING MERN	to use this Login form you need to first clone this repo ->open folder loginusingmern npm i -> nodemon index.js -> open http://localhost:3000/ -> go to register page enter your details , your details are submitted and stored in mongodb . that's it all set.
DAY-14	FILE UPLOADER	FILE UPLOADER	to use this file uploader you need to first clone this repo ->open folder file_uploader npm i -> npm run start -> open http://localhost:3000/file -> fill all thing and submit file and open your clone folder -> uploads you will see file . that's it all set.
DAY-15	PROGRESS-BAR	PROGRESS-BAR
DAY-16	SCROLL-BAR-CSS
DAY-17	SLIDER USING SWIPER API	SLIDER USING SWIPER API
DAY-18	Carousel Solar System	Carousel Solar System
DAY-19	PLANTO	PLANTO
DAY-20	EVESPARKS
DAY-21	Video bg slider using react	Video bg slider using react	to use this Video bg slider using react you need to first clone this repo ->open folder travel_website -> npm i -> npm run dev -> open http://localhost:5120 -> see Video bg slider using react . that's it all set.
DAY-22	PAGELOADER	PAGELOADER
DAY-22	Jarvis Virtual Assistant	Jarvis Virtual Assistant
DAY-24	AI ChatBot	AI ChatBot
DAY-25	Tic-Tac-Toe	Tic-Tac-Toe
DAY-26	Maze game	Maze game
DAY-27	MemoryGame	MemoryGame
DAY-28	wordle	wordle
DAY-29	Snake Game	Snake Game
DAY-29	Flappy-bird-game	Flappy-bird-game
DAY-31	Password Manager	Password Manager
DAY-32	Missionaries & Cannibals	Missionaries & Cannibals
Day 33	Weather Forcasting	Weather Forcasting
Day 34	Email Validator	Email Validator
Day 35	Vanilla-JavaScript-Calculator	Vanilla-JavaScript-Calculator
Day 36	Medical App	Medical App
Day 37	2048 Game	2048 Game
Day 38	Github Profile Finder	Github Profile Finder
Day 39	Notes App	Notes App
Day 40	Analog Clock	Analog Clock
Day 41	Scroll Dark Game	Scroll Dark Game
Day 42	Amazon App	Amazon App
Day 43	Password Generator	Password Generator
Day 44	BMI Calculator	BMI Calculator
Day 45	Black Jack	Black Jack
Day 46	Palindrome Generator	Palindrome Generator
Day 47	Ping Pong Game	Ping Pong Game
Day 48	TextToVoiceConverter	TextToVoiceConverter
Day 49	Url Shortener	Url Shortener
Day 50	Recipe Genie	Recipe Genie
Day 51	Netflix Landing Page Clone	Netflix Landing Page Clone
Day 52	ClimaCode	ClimaCode
Day 53	E-Commerce Website with Simple Cart Functionality	E-Commerce Website with Simple Cart Functionality
Day 54	Budget Tracker	Budget Tracker
Day 55	Cricket Game	Cricket Game
Day 56	Pastebin using svelte	Pastebin using svelte
Day 57	Glowing Social Media Icons	Glowing Social Media Icons
Day 58	Music App	Music App
Day 59	Blog Page	Blog Page
Day 60	Marketing template website	Marketing template website
Day 61	Hologram Button	Hologram Button
Day 62	Solar System Explorer	Solar System Explorer
Day 63	Image to Text App	Image to Text App
Day 64	Zomato-clone	Zomato-clone
Day 65	The Cube	The Cube
Day 66	Flask Authentication App	Flask Authentication App
Day 67	Blog-Website	Blog-Website
Day 68	3d Rotating Card	3d Rotating Card
Day 69	Spotify Clone Project	Spotify Clone Project
Day 70	Insect-Catch_Game	Insect-Catch_Game
Day 71	Quotely Laughs	Quotely Laughs
Day 72	Contact Book	Contact Book
Day 73	Candy_Crush_Game	Candy_Crush_Game
Day 74	Stock Profit Calculator	Stock Profit Calculator
Day 75	code-space-game project	code-space-game project
Day 76	animated searchbar	animated searchbar
Day 77	rock-paper-scissor-game project	rock-paper-scissor-game project
Day 78	npm package search	npm package search
Day 79	linkedin homepage clone using react	linkedin homepage clone using react
Day-95	TodoList in React-TS-Tailwind	TodoList in React-TS-Tailwind	to use this TodoList you need to first clone this repo -> open folder TodoList-React-TS-Tailwind -> npm i -> npm run dev -> open http://localhost:5173 -> see TodoList . that's it all set.

Discord Channel for VSoC 2024 Contributors

Now, resolve your all doubts and communicate with our all contributors.

Getting Started

To get started with contributing to 100_days_100_Web Projects , please refer to our Contributing Guidelines.

Follow these steps:

1. Clone the repository:

   git clone https://github.com/your-username/100_days_100_web_project.git
   
   
   or Use Github desktop to directly clone it in your system

2. Navigate to the project directory:

   cd 100_days_100_Web Projects

3. Install dependencies:

   npm install

4. Running the Application:

   Once you have installed the dependencies, you can run the application locally using:

   npm run start

   This command will start a development server and open the application in your default web browser on local host .

If you'd like to contribute to 100_days_100_Web Projects , please follow these guidelines:

• Fork the repository and clone it locally.
• Create a new branch for your feature or bug fix: git checkout -b feature-name
• Make your changes and test thoroughly.
• Commit your changes: git commit -m "Brief description of your changes"
• Push to the branch: git push origin feature-name
• Submit a pull request detailing your changes.

Support

For any questions or issues, feel free to reach out to us through our disscusion or by opening an issue on GitHub.

Stay updated with the latest news and announcements:

• Follow me on Instagram
• Connect with me on LinkedIn

Contributors ✨

Thanks goes to these wonderful people :