As someone with a solid understanding of JavaScript and Ruby but not much of other programming languages, I’ve always wanted to learn more about a toolset many JavaScript developers are praising: TypeScript.

Another relatively new tool I have noticed being thrown around in the dev world is GraphQL.

With very little bandwidth to dive deep into both tools, I was delighted to find a comprehensive FREE video tutorial that covers both topics:
Building Your First GraphQL Server with Node and TypeScript

There is more to vanilla JavaScript than meets the eye.

At least that’s what I discovered after completing Wes Bos’ JavaScript30 Challenge in 30 days.

If you have not heard of JavaScript30 Challenge, it is a FREE video tutorial consisting of 30 coding exercises/challenges, each of which focuses on a specific JavaScript feature.

So, what can you achieve by completing these challenges? Here are 7 key takeaways from my own rewarding experience:

1. Save Time and Money

Did I mention this tutorial is 100% free? …

Aside from the two-pointer technique demonstrated in my previous post, I have been grokking another popular algorithmic mental model: the sliding window.

If you have never heard of the sliding-window technique, I strongly recommend watching this video tutorial before diving into the example below. Even if you don’t have 36 minutes to spare, be sure to watch the first 8 minutes, which contain multiple well-executed animations.

What is the sliding window technique?

As its name suggests, this technique involves taking a subset of data from a given array or string, expanding or shrinking that subset to satisfy certain conditions, hence the sliding effect.

When dealing with strings and arrays in the context of algorithm challenges, our first instinct usually revolves around built-in methods.

Let’s take a look at this seemingly easy problem:

/* Description:
Given a sorted (ascending) array of integers, 
write a function that returns a sorted (ascending) array 
which contains the square of each number.
*/// Examples:
square([0, 1, 2, 3, 4, 5])
// => [0, 1, 4, 9, 16, 25])square([-7, -3, 2, 3, 11])
// => [4, 9, 9, 49, 121]

Like many others, my immediate reaction was to make use of sort() method after mapping out (map())…

If you’ve been following my recent tweets, you might have noticed that I am currently coding along with Wes Bos’ JavaScript30 challenge.

While a lot of the challenges served as a refresher for my JavaScript knowledge, there were times when I had to pause the tutorial and shout internally, “Woah, why didn’t I learn about this earlier?”

I had that moment again when approaching the challenge of creating movable text shadows.

As it turns out, there is an HTML global attribute called contenteditable that allows the user to edit targeted text on the browser.

According to the MDN’s documentation, contenteditable…

Technical interviews come in all shapes and sizes. Some companies go for the traditional algorithm challenges, others tend to be more creative, such as this Fullstack Engineer interview I had the other day.

Toward the end of a fun, relaxing conversation, the interviewer gave me a quick challenge: Answer a series of trivia-like tech questions that involve varying levels of knowledge in software development.

I got roughly a third of them right, which wasn’t too bad considering the time constraints and my “freshness” in the field.

During the 5-minute exercise, I also jotted down as many questions as I could…

Last week I shared three handy dev tools that let us format our console outputs beyond the plain-old console.log(). Today I learned one more neat trick to "prettify" our console.

This trick is so simple, all you need to do is add a special indicator inside your console.log().

Let’s see how it works with pure strings:

1. Add this set of characters, %c, at the start of the string.
2. Pass in an additional argument, which contains the style of the string. As you can see below, the syntax is basically the style attributes of an HTML element.

That’s it! Feel free…

As JavaScript developers, we intuitively use console.log() to debug, print out variables, and log results of our current operations to make sure we are on the right programming path.

Indeed, console.log() seems powerful enough, but did you know there are other cool methods in the Console API that can also make your life easier?

Recently I came across console.table() in a tutorial, which prompted me to investigate alternative approaches to the plain-old console.log(). Here are 3 formatting tools that I have added to my debugging toolkit:

1. console.table()

As the name suggests, console.table() prints your output in a nicely formatted table, instead…