{"id":21477362,"url":"https://github.com/richardbmk/javascript30","last_synced_at":"2025-06-27T14:08:07.619Z","repository":{"id":106619760,"uuid":"205910803","full_name":"Richardbmk/JavaScript30","owner":"Richardbmk","description":"This is a Wes Bos' (@wesbos) 30 days challenge workind on JavaScript. This challenge consist of 30 days of exercises using plain vanilla JavaScript, without no libraries, transpilers of frameworks.","archived":false,"fork":false,"pushed_at":"2020-06-03T11:18:16.000Z","size":45405,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-17T08:20:33.083Z","etag":null,"topics":["array","arrow-function","arrow-functions","destructuring","javascript","promises","spreading","template-literal","template-literals"],"latest_commit_sha":null,"homepage":"https://JavaScript30.com","language":"HTML","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/Richardbmk.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":"2019-09-02T18:04:28.000Z","updated_at":"2020-09-11T21:49:41.000Z","dependencies_parsed_at":"2024-01-11T01:27:21.285Z","dependency_job_id":null,"html_url":"https://github.com/Richardbmk/JavaScript30","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Richardbmk/JavaScript30","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Richardbmk%2FJavaScript30","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Richardbmk%2FJavaScript30/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Richardbmk%2FJavaScript30/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Richardbmk%2FJavaScript30/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Richardbmk","download_url":"https://codeload.github.com/Richardbmk/JavaScript30/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Richardbmk%2FJavaScript30/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262270427,"owners_count":23285165,"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":["array","arrow-function","arrow-functions","destructuring","javascript","promises","spreading","template-literal","template-literals"],"created_at":"2024-11-23T11:13:24.429Z","updated_at":"2025-06-27T14:08:07.571Z","avatar_url":"https://github.com/Richardbmk.png","language":"HTML","readme":"![](https://javascript30.com/images/JS3-social-share.png)\n\n# JavaScript30\nThis is a Wes Bos' ([@wesbos](https://github.com/wesbos)) 30 days challenge workind on JavaScript.\nThis challenge consist of 30 days of exercises using plain vanilla JavaScript, without no libraries,\ntranspilers of frameworks.\n\nCheck the original course at [https://JavaScript30.com](https://JavaScript30.com)\n\n## Some Concepts learned\n I will be updating this readme file, since I didn't finish the chanllenge yet. So far a learned this concepts:\n \n- Using methods and properties from the following `Web APIs`  and `interfaces`\n  - `MouseEvent`, `HTMLMediaElement`, `Navigator`, `Canvas`,\n- `Document Object Model` Node List\n - ES6 `Promises`,  `template literals`, `array spreading`, `destructuring parameters`, `typed arrays`, `arrow function`\n - `transitioned` event\n\n\n## Table of contents\n\n1. [x] [JavaScript Drum Kit](https://richardbmk.github.io/JavaScript30/01%20-%20JavaScript%20Drum%20Kit)\n2. [x] [JS + CSS Clock](https://richardbmk.github.io/JavaScript30/02%20-%20JS%20and%20CSS%20Clock)\n3. [x] [CSS Variables](https://richardbmk.github.io/JavaScript30/03%20-%20CSS%20Variables)\n4. [x] [Array Cardio, Day 1](https://richardbmk.github.io/JavaScript30/04%20-%20Array%20Cardio%20Day%201)\n5. [x] [Flex Panel Gallery](https://richardbmk.github.io/JavaScript30/05%20-%20Flex%20Panel%20Gallery)\n6. [x] [Type Ahead](https://richardbmk.github.io/JavaScript30/06%20-%20Type%20Ahead)\n7. [x] [Array Cardio, Day 2](https://richardbmk.github.io/JavaScript30/07%20-%20Array%20Cardio%20Day%202/)\n8. [x] [Fun with HTML5 Canvas](https://richardbmk.github.io/JavaScript30/08%20-%20Fun%20with%20HTML5%20Canvas/)\n9. [x] [Dev Tools Domination](https://richardbmk.github.io/JavaScript30/09%20-%20Dev%20Tools%20Domination/)\n10. [x] [Hold Shift and Check Checkboxes](https://richardbmk.github.io/JavaScript30/10%20-%20Hold%20Shift%20and%20Check%20Checkboxes/)\n11. [x] [Custom Video Player](https://richardbmk.github.io/JavaScript30/11%20-%20Custom%20Video%20Player)\n12. [x] [Key Sequence Detection](https://richardbmk.github.io/JavaScript30/12%20-%20Key%20Sequence%20Detection/)\n13. [x] [Slide in on Scroll](https://richardbmk.github.io/JavaScript30/13%20-%20Slide%20in%20on%20Scroll/)\n14. [x] [JavaScript References vs. Copying](https://richardbmk.github.io/JavaScript30/14%20-%20JavaScript%20References%20VS%20Copying/)\n15. [x] [LocalStorage](https://richardbmk.github.io/JavaScript30/15%20-%20LocalStorage)\n16. [x] [Mouse Move Shadow](https://richardbmk.github.io/JavaScript30/16%20-%20Mouse%20Move%20Shadow/)\n17. [x] [Sort Without Articles](https://richardbmk.github.io/JavaScript30/17%20-%20Sort%20Without%20Articles/)\n18. [x] [Adding Up Times with Reduce](https://richardbmk.github.io/JavaScript30/18%20-%20Adding%20Up%20Times%20with%20Reduce)\n19. [ ] [~~Webcam Fun~~](https://richardbmk.github.io/JavaScript30/19%20-%20Webcam%20Fun)\n20. [x] [Speech Detection](https://richardbmk.github.io/JavaScript30/20%20-%20Speech%20Detection)\n21. [x] [Geolocation](https://richardbmk.github.io/JavaScript30/21%20-%20Geolocation)\n22. [x] [Follow Along Link Highlighter](https://richardbmk.github.io/JavaScript30/22%20-%20Follow%20Along%20Link%20Highlighter)\n23. [x] [Speech Synthesis](https://richardbmk.github.io/JavaScript30/22%20-%20Follow%20Along%20Link%20Highlighter)\n24. [x] [Sticky Nav](https://richardbmk.github.io/JavaScript30/24%20-%20Sticky%20Nav)\n25. [x] [Event Capture, Propagation, Bubbling, and Once](https://richardbmk.github.io/JavaScript30/25%20-%20Event%20Capture%2C%20Propagation%2C%20Bubbling%20and%20Once)\n26. [ ] [~~Stripe Follow Along Nav~~](https://richardbmk.github.io/JavaScript30/26%20-%20Stripe%20Follow%20Along%20Nav)\n27. [x] [Click and Drag](https://richardbmk.github.io/JavaScript30/27%20-%20Click%20and%20Drag)\n28. [x] [Video Speed Controller](https://richardbmk.github.io/JavaScript30/28%20-%20Video%20Speed%20Controller)\n29. [ ] [~~Countdown Timer~~](https://richardbmk.github.io/JavaScript30/29%20-%20Countdown%20Timer)\n30. [ ] [~~Whack A Mole~~](https://richardbmk.github.io/JavaScript30/30%20-%20Whack%20A%20Mole)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frichardbmk%2Fjavascript30","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frichardbmk%2Fjavascript30","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frichardbmk%2Fjavascript30/lists"}