10 Mini Projects

Page section: blog

I completed the 10 mini projects in the video by Florin Pop.

This was a great exercise and I’m sure I learned a lot. I think this way of learning is much better than going through trying to learn different parts of the JS language one by one. You learn in context which is the way we learn our very first language, talking, when we’re young. I would suspect the brain is more programmed to learn this way so it definitely makes sense to learn this way.

The video is not even attempting to be a tutorial. It was an exercise where Florin pushed himself to see if he could make the following projects in 1 hour.

  1. A hamburger hide/display menu
  2. Toaster notification
  3. Type out text
  4. Purple hearts raining down over the screen
  5. Popup modal
  6. A background changer
  7. A dark mode toggle switch
  8. An image carousel
  9. A sound board
  10. A zoom rollover effect

There are different ways to approach this. At one end you can follow along and copy the code out line by line. At the other end you can just get the idea for the project and make it with no other input. I watched each project and then tried to make it referring back to the video when I needed too. Some I needed to reference the video more than others.

Some of these I had no clue how they were done in particular the typing text which was interesting. Others were easier. I tried the image carousel more or less on my own and made it differently than Florin did. So I remade it again.

The zoom effect was mostly CSS and I did all this first before adding the JS. I think the way I did was actually better than Florin did which was cool to see.

Any way will definitely be making more projects including modifying and improving some of these.

Wes Bos has a course of 30 projects to try. Not for complete beginners but I feel I’m definitely beyond that initial stage now.