web dev

Javascript30 Lesson 4

What I learned from lesson 4 of JavaScript30

Lee Keitel

1 minute read

This lesson dealt with JavaScript array fundamentals rather than making a functional application. Not as fun, but still very important.

I've used array functions like map, filter, and reduce in other languages but not JavaScript. The implementations are simple to understand and doesn't take long to learn.

My solutions to the sort problems are a bit simpler then what Wes used in the video:

// Problem 3
// Original Answer
const ordered = inventors.sort((a, b) => a.year > b.year ? 1 : -1);


Javascript30 Lesson 3

What I learned from lesson 3 of JavaScript30

Lee Keitel

2 minute read

Lesson 3 dealt more with CSS than JavaScript. This lesson demonstrated the use of variables in standard CSS. Although CSS preprocessors have had variables for quite some time, the values of them can't be changed at runtime. Meaning, there's no way to change a single value and have all other dependent properties update with the new value. In contrast, when a variable in CSS is altered, every property that uses it will also be updated and repainted. This allows the programmer to change just one…

Javascript30 Lesson 2

What I learned from lesson 2 of JavaScript30

Lee Keitel

4 minute read

Lesson 2 of JavaScript30 was to make a realtime clock with second, minute, and hour hands. This lesson focused on both CSS and JavaScript. With CSS, styles were applied to adjust the start position of the hands, make them look like a real clock where they overshoot slightly before bouncing back into place, and ensuring a smooth transition between positions. JavaScript was used to adjust the rotation of the hands in accordance with the current time.

From this lesson I learned about the…

JavaScript30 - Lesson 1

What I learned from lesson 1 of JavaScript30

Lee Keitel

2 minute read

The first lesson of JavaScript30 is to make a page where pressing a key on the homerow of a qwerty keyboard caused the browser to play a sound such as a bass drum, cymbal, or snare drum. This lesson focused on event handlers and manipulating the HTML audio element.

I was already familiar with event handlers and query selectors. I've never used an audio element before so that was new. In particular I was already aware of being able to play and stop audio with JavaScript but I wasn't aware of being…

Javascript30 - My Journey

What is JavaScript30?

Lee Keitel

2 minute read

Although I've been doing basic web development for a few years, I've done a poor job of keeping up-to-date with modern JavaScript technologies and modern APIs. I've focused more on server-side development and neglected the frontend both JavaScript and CSS. Over the next few weeks I'll be working through a JavaScript course called JavaScript30 while documenting my progress along the way.

JavaScript30 is a free JavaScript course created by Wes Bos. I learned about the course listening to the Syntax…