50 Days 50 Projects

---

• Overview:
  • This repository is entirely project-based and contains fundamental projects, especially for beginners. It includes a total of 50 mini projects related to HTML, CSS, and JavaScript. You can easily access the source code and YouTube video links for the relevant projects through the "Projects" table below.
• Organization:
  • Projects are organized into folders. You can click on the relevant project in the Projects section to access the source code and YouTube video links.

---

• This is a modified version of the "50 Projects In 50 Days - HTML, CSS & JavaScript" course taught by Brad Traversy and Florin Pop, filtered through my own study.

---

Projects

markdown Copy code

No	Source Code	YouTube Link	Status
00	Expanding Cards	How to Create Animated Expanding Cards • 50 Days 50 Projects -1	Completed
01	Progress Steps	How to Create Animated Progress Steps • 50 Days 50 Projects -2	Completed
02	Animated Rotating Menu	How to Create an Animated Menu • 50 Days 50 Projects -3	Completed
03	Hidden Search Widget	How to Create a Toggle Search Input • 50 Days 50 Projects -4	Completed
04	Blurred Loading Screen	How to Create an Animated Loading Screen • 50 Days 50 Projects -5	Completed
05	Scroll Animation	How to Create Scroll Animations • 50 Days 50 Projects -6	Completed
06	Split Landing Page	How to Create an Animated Expanding Landing Page • 50 Days 50 Projects -7	Completed
07	Wave Animation	How to Create Wave Animation • 50 Days 50 Projects -8	Completed
08	Sound Stream Deck	Let's Create a Sound Stream Deck • 50 Days 50 Projects -9	Completed
09	Dad Jokes	Let's Build a Dad Jokes Generator • 50 Days 50 Projects -10	Completed
10	Event keyCodes	KeyCodes Recap Project • 50 Days 50 Projects -11	Completed
11	FAQ Collapse	Let's Create a Detailed Collapse Project • 50 Days 50 Projects -12	Completed
12	Random Choice Picker	Simple Game with setTimeout and setInterval • 50 Days 50 Projects -13	Completed
13	Animated Navigation	Animated Expanding Menu • 50 Days 50 Projects -14	Completed
14	Incrementing Counter	Let's Build an Incrementing Counter • 50 Days 50 Projects -15	Completed
15	Random Image Feed	How to Create a Random Image Feed • 50 Days 50 Projects -16	Completed
16	Loading Screen	CSS Loading Screen • 50 Days 50 Projects -17	Completed
17	Auto Text Effect	Automatic Text Effect • 50 Days 50 Projects -18	Completed
18	Notes	Notes App (localStorage) • 50 Days 50 Projects -19	Completed
19	Quiz App	Quiz App • 50 Days 50 Projects -20	Completed
20	Drawing App	Drawing App - Canvas • 50 Days 50 Projects -21	Completed
21	Pokedex	Pokedex Guide - Fetch API & Async Await Basic Project • 50 Days 50 Projects -22	Completed
22	Verify Account UI	Verify Account UI • 50 Days 50 Projects -23	Completed
23	Drag and Drop	Drag and Drop • 50 Days 50 Projects -24	Completed
24	Password Strength	Password Strength UI - Tailwind CSS • 50 Days 50 Projects -25	Completed
25	Mobile Tab Navigation	Let's Create Mobile Tab Navigation • HTML, CSS, JavaScript -26	Completed
26	Image Carousel	Moving Image Showcase (setInterval) • HTML, CSS, JavaScript -27	Completed
27	Notification	JavaScript Beginner Project (DOM - Math.random) • Project -28	Completed
28	Button Effect	Quick Review Project for JavaScript and CSS (clientX-Y offsetTop-Left) -29	Completed
29	Hoverboard	15-Minute JavaScript Game for Beginners (mouseover - mouseout) • Project -30	Completed
30	Box Switcher	JavaScript Project for Beginners • HTML, CSS, JavaScript -31	Completed
31	Sticky Navbar	Creating a Sticky Navbar • HTML, CSS & JS	Completed
32	Feedback UI	Creating a Feedback UI • HTML, CSS & JS	Completed
33	Movie App	Build a Movie Website in 50 Minutes - Responsive • JavaScript Fetch API	Completed
34	GitHub Profile Card	Creating GitHub Profile Cards • Axios - JavaScript	Completed