{"id":20763294,"url":"https://github.com/tinspham209/50projects50days","last_synced_at":"2025-09-28T00:31:15.311Z","repository":{"id":42662373,"uuid":"319833233","full_name":"tinspham209/50projects50days","owner":"tinspham209","description":"50 unique mini-projects to sharpen your HTML, CSS \u0026 JavaScript skills","archived":false,"fork":false,"pushed_at":"2023-12-15T08:40:26.000Z","size":39944,"stargazers_count":2,"open_issues_count":1,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-11-17T10:45:47.891Z","etag":null,"topics":["css","html","javascript","learning-frontend"],"latest_commit_sha":null,"homepage":"","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tinspham209.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-12-09T03:41:15.000Z","updated_at":"2023-12-01T13:36:15.000Z","dependencies_parsed_at":"2024-11-17T10:53:45.253Z","dependency_job_id":null,"html_url":"https://github.com/tinspham209/50projects50days","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tinspham209%2F50projects50days","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tinspham209%2F50projects50days/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tinspham209%2F50projects50days/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tinspham209%2F50projects50days/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tinspham209","download_url":"https://codeload.github.com/tinspham209/50projects50days/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234470300,"owners_count":18838629,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","html","javascript","learning-frontend"],"created_at":"2024-11-17T10:43:41.151Z","updated_at":"2025-09-28T00:31:05.281Z","avatar_url":"https://github.com/tinspham209.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Project: 50 Projects for learn, sharpen your HTML/CSS, JS Dom Skills\n\n## Date: 9 - Dec - 2020\n\n\u003cimg src=\"./screenshot.jpg\" alt=\"Screenshot\"/\u003e\n\n### Functions\n\n- 50 unique mini-projects to sharpen your HTML, CSS \u0026 JavaScript skills\n- create interesting projects\n\n### Tech-Stack\n\n- HTML/CSS\n- JavaScript\n- Animation\n- Fetch API\n\n### Project\n\n|  #  | Date      | Project                | Repository                                                                                          |\n| :-: | --------- | ---------------------- | --------------------------------------------------------------------------------------------------- |\n| 00  | 09-Dec-20 | Project Sample         | [Repository](https://github.com/tinspham209/50projects50days/tree/master/00-project-sample)         |\n| 01  | 09-Dec-20 | Expanding Cards        | [Repository](https://github.com/tinspham209/50projects50days/tree/master/01-expanding-cards)        |\n| 02  | 09-Dec-20 | Progress Steps         | [Repository](https://github.com/tinspham209/50projects50days/tree/master/02-progress-steps)         |\n| 03  | 09-Dec-20 | Rotating Nav Animation | [Repository](https://github.com/tinspham209/50projects50days/tree/master/03-rotating-nav-animation) |\n| 04  | 12-Dec-20 | Hidden Search Widget   | [Repository](https://github.com/tinspham209/50projects50days/tree/master/04-hidden-search-widget)   |\n| 05  | 12-Dec-20 | Blurry Loading         | [Repository](https://github.com/tinspham209/50projects50days/tree/master/05-blurry-loading)         |\n| 06  | 12-Dec-20 | Scroll Animation       | [Repository](https://github.com/tinspham209/50projects50days/tree/master/06-scroll-animation)       |\n| 07  | 04-Jan-21 | Split Landing Page     | [Repository](https://github.com/tinspham209/50projects50days/tree/master/07-split-landing-page)     |\n| 08  | 04-Jan-21 | Form Input Wave        | [Repository](https://github.com/tinspham209/50projects50days/tree/master/08-form-input-wave)        |\n| 09  | 04-Jan-21 | Sound Board            | [Repository](https://github.com/tinspham209/50projects50days/tree/master/09-sound-board)            |\n| 10  | 06-Jan-21 | Dad Jokes              | [Repository](https://github.com/tinspham209/50projects50days/tree/master/10-dad-jokes)              |\n| 11  | 06-Jan-21 | Event KeyCodes         | [Repository](https://github.com/tinspham209/50projects50days/tree/master/11-event-keycodes)         |\n| 12  | 06-Jan-21 | FAQ Collapse           | [Repository](https://github.com/tinspham209/50projects50days/tree/master/12-faq-collapse)           |\n| 13  | 11-Jan-21 | Random Choice Picker   | [Repository](https://github.com/tinspham209/50projects50days/tree/master/13-random-choice-picker)   |\n| 14  | 11-Jan-21 | Animated Navigation    | [Repository](https://github.com/tinspham209/50projects50days/tree/master/14-animated-navigation)    |\n| 15  | 11-Jan-21 | Incrementing Counter   | [Repository](https://github.com/tinspham209/50projects50days/tree/master/15-incrementing-counter)   |\n| 16  | 18-Jan-21 | Drink Water            | [Repository](https://github.com/tinspham209/50projects50days/tree/master/16-drink-water)            |\n| 17  | 20-Jan-21 | Movie App              | [Repository](https://github.com/tinspham209/50projects50days/tree/master/17-movie-app)              |\n| 18  | 25-Jan-21 | Background Slider      | [Repository](https://github.com/tinspham209/50projects50days/tree/master/18-background-slider)      |\n| 19  | 25-Jan-21 | Theme Clock            | [Repository](https://github.com/tinspham209/50projects50days/tree/master/19-theme-clock)            |\n| 20  | 26-Jan-21 | Button Ripple Effect   | [Repository](https://github.com/tinspham209/50projects50days/tree/master/20-button-ripple-effect)   |\n| 21  | 26-Jan-21 | Drag \u0026 Drop            | [Repository](https://github.com/tinspham209/50projects50days/tree/master/21-drag-n-drop)            |\n| 22  | 26-Jan-21 | Drawing App            | [Repository](https://github.com/tinspham209/50projects50days/tree/master/22-drawing-app)            |\n| 23  | 28-Jan-21 | Kinetic Loader         | [Repository](https://github.com/tinspham209/50projects50days/tree/master/23-kinetic-loader)         |\n| 24  | 28-Jan-21 | Content Placeholder    | [Repository](https://github.com/tinspham209/50projects50days/tree/master/24-content-placeholder)    |\n| 25  | 03-Feb-21 | Sticky Navigation      | [Repository](https://github.com/tinspham209/50projects50days/tree/master/25-sticky-navigation)      |\n| 26  | 03-Feb-21 | Double Vertical Slider | [Repository](https://github.com/tinspham209/50projects50days/tree/master/26-double-vertical-slider) |\n| 27  | 24-Feb-21 | Toast Notification     | [Repository](https://github.com/tinspham209/50projects50days/tree/master/27-toast-notification)     |\n| 28  | 24-Feb-21 | Github Profiles        | [Repository](https://github.com/tinspham209/50projects50days/tree/master/28-github-profiles)        |\n| 29  | 28-Feb-21 | Double Click Heart     | [Repository](https://github.com/tinspham209/50projects50days/tree/master/29-double-click-heart)     |\n| 30  | 01-Mar-21 | Auto Text Effect       | [Repository](https://github.com/tinspham209/50projects50days/tree/master/30-auto-text-effect)       |\n| 31  | 01-Mar-21 | Good, Cheap, Fast      | [Repository](https://github.com/tinspham209/50projects50days/tree/master/31-good-cheap-fast)        |\n| 32  | 01-Mar-21 | Notes App              | [Repository](https://github.com/tinspham209/50projects50days/tree/master/32-notes-app)              |\n| 33  | 01-Mar-21 | Password Generator     | [Repository](https://github.com/tinspham209/50projects50days/tree/master/33-password-generator)     |\n| 34  | 02-Mar-21 | Animated Countdown     | [Repository](https://github.com/tinspham209/50projects50days/tree/master/34-animated-countdown)     |\n| 35  | 23-Mar-21 | Image Carousel         | [Repository](https://github.com/tinspham209/50projects50days/tree/master/35-image-carousel)         |\n| 36  | 23-Mar-21 | Hover Board            | [Repository](https://github.com/tinspham209/50projects50days/tree/master/36-hoverboard)             |\n| 37  | 23-Mar-21 | Pokedex                | [Repository](https://github.com/tinspham209/50projects50days/tree/master/37-pokedex)                |\n| 38  | 23-Mar-21 | Mobile Tab Navigation  | [Repository](https://github.com/tinspham209/50projects50days/tree/master/38-mobile-tab-navigation)  |\n\n### Commit\n\n#### \u003ca name=\"commit-header\"\u003e\u003c/a\u003eCommit Message Format\n\n```\n\u003ctype\u003e(\u003cscope\u003e): \u003cshort summary\u003e\n  │       │             │\n  │       │             └─⫸ Summary in present tense. Not capitalized. No period at the end.\n  │       │\n  │       └─⫸ Commit Scope: animations|bazel|benchpress|common|compiler|compiler-cli|core|\n  │                          elements|forms|http|language-service|localize|platform-browser|\n  │                          platform-browser-dynamic|platform-server|router|service-worker|\n  │                          upgrade|zone.js|packaging|changelog|dev-infra|docs-infra|migrations|\n  │                          ngcc|ve\n  │\n  └─⫸ Commit Type: build|ci|docs|feat|fix|perf|refactor|test\n```\n\nThe `\u003ctype\u003e` and `\u003csummary\u003e` fields are mandatory, the `(\u003cscope\u003e)` field is optional.\n\n#### \u003ca name=\"commit-header\"\u003e\u003c/a\u003eCommit Message Example\n\n- `feat(similarityReports): get similarity reports and display in a grid`\n- `update(similarityReports): add updatedDate col in the report grid`\n- `fix(similarityReports): display correct message error`\n- `update(global): change css system`\n\n### After this project\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftinspham209%2F50projects50days","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftinspham209%2F50projects50days","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftinspham209%2F50projects50days/lists"}