Coding Challenge - 10 JavaScript Projects in 1 Hour

YouTube video is now Live, click below:

I took on a challenge to completed 10 Projects in 1 Hour while streaming everything on Twitch.

You can find the projects here.

1. Hamburger Button

• button + hamburger icon
• menu > li > a -> hidden
• toggle on click
• animation

1. Toast Notification

• toast container floating
• toast design
• button
• click show random toast message

1. Auto Write Text

• text
• index
• show text based on index
• increment index

1. Popup / Modal

• button
• click on button to activate popup
• popup container
• popup with text
• close btn popup with click event

1. Purple Heart Rain

• heart css
• falling animation
• create heart
• add class
• add it to body
• interval

1. Background Changer

• button w/ click
• generate color
• change bg color on click

1. Dark mode toggle

• text
• css for dark mode
• toggle
• toggle event

1. Carousel

• 3/4 images
• carousel container
• images container
• images with fixed width and height
• index
• automatic switch index and update container transform property

1. Sound Board

• sounds (HAVE THESE READY SIR)
• array with names
• loop over array
• create buttons w/ text
• play sound on click

1. Zoom effect

• image
• track mouse movement
• set transform origin on hover

Other ideas

1. Date - show date
2. Image of the day - image library needed

• https://picsum.photos/200/300

1. Something with API
2. Random Number from 1 to 6
3. Scroll to top
4. Fixed nav on scroll
5. Loader
6. Converter
7. Random Password Generator
8. / \ random stuff