GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • Sign in
  • ActionsCI/CD and automation
  • CodespacesCloud development environments
  • All Features
  • Documentation
  • Training
  • Certifications
  • Build with Copilot
  • Customize Copilot
  • Integrations
  • Trending repos
  • GitHub Sponsors
  • Developer articles
  • Enterprises

This view

  • Original page
  • New address

GeezerVison is showing github.com — GitHub - vanntile/JavaScript30: 30 Day Vanilla JS Challenge

BranchesTags
Open more actions menu
 
 

Latest commit

 

History

337 Commits
337 Commits

Folders and files

NameName
Last commit message
Last commit date
01 - JavaScript Drum Kit
01 - JavaScript Drum Kit
 
 
02 - JS and CSS Clock
02 - JS and CSS Clock
 
 
03 - CSS Variables
03 - CSS Variables
 
 
04 - Array Cardio Day 1
04 - Array Cardio Day 1
 
 
05 - Flex Panel Gallery
05 - Flex Panel Gallery
 
 
06 - Type Ahead
06 - Type Ahead
 
 
07 - Array Cardio Day 2
07 - Array Cardio Day 2
 
 
08 - Fun with HTML5 Canvas
08 - Fun with HTML5 Canvas
 
 
09 - Dev Tools Domination
09 - Dev Tools Domination
 
 
10 - Hold Shift and Check Checkboxes
10 - Hold Shift and Check Checkboxes
 
 
11 - Custom Video Player
11 - Custom Video Player
 
 
12 - Key Sequence Detection
12 - Key Sequence Detection
 
 
13 - Slide in on Scroll
13 - Slide in on Scroll
 
 
14 - JavaScript References VS Copying
14 - JavaScript References VS Copying
 
 
15 - LocalStorage
15 - LocalStorage
 
 
16 - Mouse Move Shadow
16 - Mouse Move Shadow
 
 
17 - Sort Without Articles
17 - Sort Without Articles
 
 
18 - Adding Up Times with Reduce
18 - Adding Up Times with Reduce
 
 
19 - Webcam Fun
19 - Webcam Fun
 
 
20 - Speech Detection
20 - Speech Detection
 
 
21 - Geolocation
21 - Geolocation
 
 
22 - Follow Along Link Highlighter
22 - Follow Along Link Highlighter
 
 
23 - Speech Synthesis
23 - Speech Synthesis
 
 
24 - Sticky Nav
24 - Sticky Nav
 
 
25 - Event Capture, Propagation, Bubbling and Once
25 - Event Capture, Propagation, Bubbling and Once
 
 
26 - Stripe Follow Along Nav
26 - Stripe Follow Along Nav
 
 
27 - Click and Drag
27 - Click and Drag
 
 
28 - Video Speed Controller
28 - Video Speed Controller
 
 
29 - Countdown Timer
29 - Countdown Timer
 
 
30 - Whack A Mole
30 - Whack A Mole
 
 
assets
assets
 
 
.gitignore
.gitignore
 
 
.imgbotconfig
.imgbotconfig
 
 
README.md
README.md
 
 
index.html
index.html
 
 

Repository files navigation

JavaScript30

Wes Bos' (@wesbos) JavaScript 30 Day Challenge. This is a plain vanilla JavaScript exercise, without any libraries, transpilers or frameworks. I have a README for each day when I have added custom functionality, that you can check below.

My own implementations can be found here.

Check the course at https://JavaScript30.com

I have beautified the HTML and CSS using atom-beautify and linted the JavaScript using JavaScript Standard Style.

Some Concepts learned

  • Using methods and properties from the following Web APIs and interfaces
    • MouseEvent, HTMLMediaElement, Fullscreen, WebStorage, Navigator, Geolocation, Canvas, Web Speech
  • Document Object Model Node List
  • ES6 Promises, template literals, array spreading, destructuring parameters, typed arrays, arrow function
  • transitioned event
  • use of the data attribute for custom element data
  • RegEx string filter
  • parent-children event delegation
  • JSON.stringify()
  • local servers (through npm packages)
  • and others

Table of contents

  1. JavaScript Drum Kit and my notes
  2. JS + CSS Clock
  3. CSS Variables
  4. Array Cardio, Day 1
  5. Flex Panel Gallery and my notes
  6. Type Ahead and my notes
  7. Array Cardio, Day 2
  8. Fun with HTML5 Canvas
  9. Dev Tools Domination
  10. Hold Shift and Check Checkboxes and my notes
  11. Custom Video Player and my notes
  12. Key Sequence Detection
  13. Slide in on Scroll
  14. JavaScript References vs. Copying
  15. LocalStorage and my notes
  16. Mouse Move Shadow
  17. Sort Without Articles
  18. Adding Up Times with Reduce
  19. Webcam Fun and my notes
  20. Speech Detection (not working in browsers for now)
  21. Geolocation and my notes
  22. Follow Along Link Highlighter
  23. Speech Synthesis and my notes
  24. Sticky Nav
  25. Event Capture, Propagation, Bubbling, and Once
  26. Stripe Follow Along Nav and my notes
  27. Click and Drag
  28. Video Speed Controller
  29. Countdown Timer
  30. Whack A Mole

About

30 Day Vanilla JS Challenge

vanntile.github.io/JavaScript30

Topics

challengejavascriptjavascript30

Resources

Readme
Activity

Stars

3 stars

Watchers

0 watching

Forks

0 forks
Report repository

Releases

Packages

Contributors

Languages

You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.