Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/tinspham209/50projects50days

50 unique mini-projects to sharpen your HTML, CSS & JavaScript skills
https://github.com/tinspham209/50projects50days

css html javascript learning-frontend

Last synced: about 8 hours ago
JSON representation

50 unique mini-projects to sharpen your HTML, CSS & JavaScript skills

Host: GitHub
URL: https://github.com/tinspham209/50projects50days
Owner: tinspham209
Created: 2020-12-09T03:41:15.000Z (almost 4 years ago)
Default Branch: master
Last Pushed: 2023-12-15T08:40:26.000Z (11 months ago)
Last Synced: 2023-12-15T09:46:04.842Z (11 months ago)
Topics: css, html, javascript, learning-frontend
Language: CSS
Homepage:
Size: 38.1 MB
Stars: 2
Watchers: 2
Forks: 1
Open Issues: 1
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # Project: 50 Projects for learn, sharpen your HTML/CSS, JS Dom Skills

## Date: 9 - Dec - 2020



### Functions

- 50 unique mini-projects to sharpen your HTML, CSS & JavaScript skills

- create interesting projects

### Tech-Stack

- HTML/CSS

- JavaScript

- Animation

- Fetch API

### Project

|  #  | Date      | Project 
| :-: | --------- | ---------------------- 
| 00  | 09-Dec-20 | Project Sample 
| 01  | 09-Dec-20 | Expanding Cards 
| 02  | 09-Dec-20 | Progress Steps 
| 03  | 09-Dec-20 | Rotating 
| 04  | 12-Dec-20 | Hidden Search Widget 
| 05  | 12-Dec-20 | Blurry Loading 
| 06  | 12-Dec-20 | Scroll Animation 
| 07  | 04-Jan-21 | Split Landing Page 
| 08  | 04-Jan-21 | Form Input Wave 
| 09  | 04-Jan-21 | Sound Board 
| 10  | 06-Jan-21 | Dad Jokes 
| 11  | 06-Jan-21 | Event KeyCodes 
| 12  | 06-Jan-21 | FAQ Collapse 
| 13  | 11-Jan-21 | Random Choice Picker 
| 14  | 11-Jan-21 | Animated Navigation 
| 15  | 11-Jan-21 | Incrementing Counter 
| 16  | 18-Jan-21 | Drink Water 
| 17  | 20-Jan-21 | Movie App 
| 18  | 25-Jan-21 | Background Slider 
| 19  | 25-Jan-21 | Theme Clock 
| 20  | 26-Jan-21 | Button Ripple Effect 
| 21  | 26-Jan-21 | Drag & Drop 
| 22  | 26-Jan-21 | Drawing App 
| 23  | 28-Jan-21 | Kinetic Loader 
| 24  | 28-Jan-21 | Content Placeholder 
| 25  | 03-Feb-21 | Sticky Navigation 
| 26  | 03-Feb-21 | Double 
| 27  | 24-Feb-21 | Toast Notification 
| 28  | 24-Feb-21 | Github Profiles 
| 29  | 28-Feb-21 | Double Click Heart 
| 30  | 01-Mar-21 | Auto Text Effect 
| 31  | 01-Mar-21 | Good, Cheap, Fast 
| 32  | 01-Mar-21 | Notes App 
| 33  | 01-Mar-21 | Password Generator 
| 34  | 02-Mar-21 | Animated Countdown 
| 35  | 23-Mar-21 | Image Carousel 
| 36  | 23-Mar-21 | Hover Board 
| 37  | 23-Mar-21 | Pokedex 
| 38  | 23-Mar-21 | Mobile Tab Navigation

| Repository                                                                                          | | --------------------------------------------------------------------------------------------------- | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/00-project-sample)         | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/01-expanding-cards)        | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/02-progress-steps)         | Nav Animation | [Repository](https://github.com/tinspham209/50projects50days/tree/master/03-rotating-nav-animation) | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/04-hidden-search-widget)   | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/05-blurry-loading)         | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/06-scroll-animation)       | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/07-split-landing-page)     | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/08-form-input-wave)        | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/09-sound-board)            | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/10-dad-jokes)              | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/11-event-keycodes)         | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/12-faq-collapse)           | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/13-random-choice-picker)   | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/14-animated-navigation)    | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/15-incrementing-counter)   | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/16-drink-water)            | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/17-movie-app)              | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/18-background-slider)      | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/19-theme-clock)            | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/20-button-ripple-effect)   | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/21-drag-n-drop)            | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/22-drawing-app)            | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/23-kinetic-loader)         | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/24-content-placeholder)    | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/25-sticky-navigation)      | Vertical Slider | [Repository](https://github.com/tinspham209/50projects50days/tree/master/26-double-vertical-slider) | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/27-toast-notification)     | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/28-github-profiles)        | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/29-double-click-heart)     | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/30-auto-text-effect)       | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/31-good-cheap-fast)        | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/32-notes-app)              | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/33-password-generator)     | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/34-animated-countdown)     | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/35-image-carousel)         | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/36-hoverboard)             | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/37-pokedex)                | | [Repository](https://github.com/tinspham209/50projects50days/tree/master/38-mobile-tab-navigation)  |

### Commit

#### Commit Message Format

```

(): 

  │       │             │

  │       │             └─⫸ Summary in present tense. Not capitalized. No period at the end.

  │       │

  │       └─⫸ Commit Scope: animations|bazel|benchpress|common|compiler|compiler-cli|core|

  │                          elements|forms|http|language-service|localize|platform-browser|

  │                          platform-browser-dynamic|platform-server|router|service-worker|

  │                          upgrade|zone.js|packaging|changelog|dev-infra|docs-infra|migrations|

  │                          ngcc|ve

  │

  └─⫸ Commit Type: build|ci|docs|feat|fix|perf|refactor|test

```

The `` and `` fields are mandatory, the `()` field is optional.

#### Commit Message Example

- `feat(similarityReports): get similarity reports and display in a grid`

- `update(similarityReports): add updatedDate col in the report grid`

- `fix(similarityReports): display correct message error`

- `update(global): change css system`

### After this project