50projects50days
A GitHub repository by Brad Traversy containing 50+ small, focused web development mini projects built with HTML, CSS, and JavaScript, useful as a curated collection of example projects for learning or referencing in awesome-style directories.
About this tool
50projects50days
URL: https://github.com/bradtraversy/50projects50days
Category: Themed Directories
Tags: web-development, projects, javascript
Overview
50projects50days is a GitHub repository by Brad Traversy that contains 50+ small, focused web development mini projects built with HTML, CSS, and JavaScript. It serves as a curated collection of example front-end projects that can be used for learning, practice, or reference.
Features
- 50+ mini projects focused on core front-end skills.
- Tech stack: Pure HTML, CSS, and JavaScript (no heavy frameworks).
- Per-project folders: Each project is organized in its own directory (e.g.,
3d-boxes-background,animated-countdown,animated-navigation,auto-text-effect,background-slider,blurry-loading,button-ripple-effect,content-placeholder,custom-range-slider,dad-jokes, etc.). - Project starter template: A
_project_starter_directory to quickly bootstrap new mini projects with a consistent structure. - UI/UX focused examples: Includes visual and interactive effects such as:
- 3D box background layouts.
- Animated countdown timers.
- Animated navigation menus.
- Auto-typing / text effects.
- Background image sliders.
- Blurry loading effects.
- Button ripple click effects.
- Content placeholder/loading skeleton effects.
- Custom range slider styling and behavior.
- Simple API-driven fun apps like “dad-jokes”.
- Discoverable via GitHub: Public repository with forks and stars, making it easy to clone, modify, and extend.
- Educational usage: Suitable as a practice track for building one small project per day.
Usage
- Clone or download the repository from GitHub.
- Open individual project folders to inspect HTML/CSS/JS implementations.
- Use
_project_starter_as a base to create new variations or additional mini projects.
Pricing
- Free, open-access GitHub repository (no paid plans indicated).
Loading more......
Information
Categories
Tags
Similar Products
6 result(s)A curated list of Backbone.js resources, plugins, and tools presented in an awesome-list format.
An awesome list of resources, plugins, and tools for Browserify, the JavaScript module bundler.
An awesome list of standalone features and components that can be integrated as building blocks into modern web applications.
An awesome list of resources, examples, and tools for choo, a small front-end framework for building web applications.
An awesome list of Ember.js libraries, addons, and resources for building web applications.
An "awesome" style curated list of frontend libraries, tools, and learning resources covering modern web UI development.