50个前端练手项目，HTML，CSS，JavaScript

# 50 Projects in 50 Days - HTML/CSS and JavaScript This is the main repository for all of the projects in the course. - [Course Link](https://www.traversymedia.com/50-Projects-In-50-Days) | # | Project | Live Demo | | :-: | --------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- | | 01 | [Expanding Cards](https://github.com/bradtraversy/50projects50days/tree/master/expanding-cards) | [Live Demo](https://50projects50days.com/projects/expanding-cards/) | | 02 | [Progress Steps](https://github.com/bradtraversy/50projects50days/tree/master/progress-steps) | [Live Demo](https://50projects50days.com/projects/progress-steps/) | | 03 | [Rotating Navigation Animation](https://github.com/bradtraversy/50projects50days/tree/master/rotating-nav-animation) | [Live Demo](https://50projects50days.com/projects/rotating-navigation-animation/) | | 04 | [Hidden Search Widget](https://github.com/bradtraversy/50projects50days/tree/master/hidden-search) | [Live Demo](https://50projects50days.com/projects/hidden-search-widget/) | | 05 | [Blurry Loading](https://github.com/bradtraversy/50projects50days/tree/master/blurry-loading) | [Live Demo](https://50projects50days.com/projects/blurry-loading/) | | 06 | [Scroll Animation](https://github.com/bradtraversy/50projects50days/tree/master/scroll-animation) | [Live Demo](https://50projects50days.com/projects/scroll-animation/) | | 07 | [Split Landing Page](https://github.com/bradtraversy/50projects50days/tree/master/split-landing-page) | [Live Demo](https://50projects50days.com/projects/split-landing-page/) | | 08 | [Form Wave](https://github.com/bradtraversy/50projects50days/tree/master/form-input-wave) | [Live Demo](https://50projects50days.com/projects/form-wave/) | | 09 | [Sound Board](https://github.com/bradtraversy/50projects50days/tree/master/sound-board) | [Live Demo](https://50projects50days.com/projects/sound-board/) | | 10 | [Dad Jokes](https://github.com/bradtraversy/50projects50days/tree/master/dad-jokes) | [Live Demo](https://50projects50days.com/projects/dad-jokes/) | | 11 | [Event Keycodes](https://github.com/bradtraversy/50projects50days/tree/master/event-keycodes) | [Live Demo](https://50projects50days.com/projects/event-keycodes/) | | 12 | [Faq Collapse](https://github.com/bradtraversy/50projects50days/tree/master/faq-collapse) | [Live Demo](https://50projects50days.com/projects/faq-collapse/) | | 13 | [Random Choice Picker](https://github.com/bradtraversy/50projects50days/tree/master/random-choice-picker) | [Live Demo](https://50projects50days.com/projects/random-choice-picker/) | | 14 | [Animated Navigation](https://github.com/bradtraversy/50projects50days/tree/master/animated-navigation) | [Live Demo](https://50projects50days.com/projects/animated-navigation/) | | 15 | [Incrementing Counter](https://github.com/bradtraversy/50projects50days/tree/master/incrementing-counter) | [Live Demo](https://50projects50days.com/projects/incrementing-counter/) | | 16 | [Drink Water](https://github.com/bradtraversy/50projects50days/tree/master/drink-water) | [Live Demo](https://50projects50days.com/projects/drink-water/) | | 17 | [Movie App](https://github.com/bradtraversy/50projects50days/tree/master/movie-app) | [Live Demo](https://50projects50days.com/projects/movie-app/) | | 18 | [Background Slider](https://github.com/bradtraversy/50projects50days/tree/master/background-slider) | [Live Demo](https://50projects50days.com/projects/background-slider/) | | 19 | [Theme Clock](https://github.com/bradtraversy/50projects50days/tree/master/theme-clock) | [Live Demo](https://50projects50days.com/projects/theme-clock/) | | 20 | [Button Ripple Effect](https://github.com/bradtraversy/50projects50days/tree/master/button-ripple-effect) | [Live Demo](https://50projects50days.com/projects/button-ripple-effect/) | | 21 | [Drag N Drop](https://github.com/bradtraversy/50projects50days/tree/master/drag-n-drop) | [Live Demo](https://50projects50days.com/projects/drag-n-drop/) | | 22 | [Drawing App](https://github.com/bradtraversy/50projects50days/tree/master/drawing-app) | [Live Demo](https://50projects50days.com/projects/drawing-app/) | | 23 | [Kinetic Loader](https://github.com/bradtraversy/50projects50days/tree/master/kinetic-loader) | [Live Demo](https://50projects50days.com/projects/kinetic-loader/) | | 24 | [Content Placeholder](https://github.com/bradtraversy/50projects50days/tree/master/content-placeholder) | [Live Demo](https://50projects50days.com/projects/content-placeholder/) | | 25 | [Sticky Navbar](https://github.com/bradtraversy/50projects50days/tree/master/sticky-navigation) | [Live Demo](https://50projects50days.com/projects/sticky-navbar/) | | 26 | [Double Vertical Slider](https://github.com/bradtraversy/50projects50days/tree/master/double-vertical-slider) | [Live Demo](https://50projects50days.com/projects/double-vertical-slider/) | | 27 | [Toast Notification](https://github.com/bradtraversy/50projects50days/tree/master/toast-notification) | [Live Demo](https://50projects50days.com/projects/toast-notification/) | | 28 | [Github Profiles](https://github.com/bradtraversy/50projects50days/tree/master/github-profiles) | [Live Demo](https://50projects50days.com/projects/github-profiles/) | | 29 | [Double Click Heart](https://github.com/bradtraversy/50projects50days/tree/master/double-click-heart) | [Live Demo](https://50projects50days.com/projects/double-click-heart/) | | 30 | [Auto Text Effect](https://github.com/bradtraversy/50projects50days/tree/master/auto-text-effect) | [Live Demo](https://50projects50days.com/projects/auto-text-effect/) | | 31 | [Password Generator](https://github.com/bradtraversy/50projects50days/tree/master/password-generator) | [Live Demo](https://50projects50days.com/projects/password-generator/) | | 32 | [Good Cheap Fast](https://github.com/bradtraversy/50projects50days/tree/master/good-cheap-fast) | [Live Demo](https://50projects50days.com/projects/good-cheap-fast/) | | 33 | [Notes App](https://github.com/bradtraversy/50projects50days/tree/master/notes-app) | [Live Demo](https://50projects50days.com/projects/notes-app/) | | 34 | [Animated Countdown](https://github.com/bradtraversy/50projects50days/tree/master/animated-countdown) | [Live Demo](https: