I want to start 2021 on a good note by giving away 10 copies of my JavaScript course, Learn JavaScript. This course will help you become great at JavaScript within a short span of time. The usual price for this course is $495, so I’m gonna give away ... more
I got fed-up searching Google for case conversion utilities. The useful ones I found (Voca and change-case) both require an environment that allows me to use npm. But I was using Vanilla JavaScript. I did not want to include any toolchains in this project, ... more
I used to think JavaScript doesn’t have Interfaces because it doesn’t have the Interface keyword, unlike Java. Interface keyword in Java But JavaScript DOES have interfaces. I found out about this when I tried Googling for the location API, which turned ... more
JavaScript is said to be a Prototype-based language, so “prototypes” must be an important concept. Right? Today I’m going to explain what Prototypes are, what you need to know, and how to use Prototypes effectively. What are prototypes? First of all, ... more
I was curious about testing JavaScript performance and did some research on it. When I talk about JavaScript performance here, I’m not talking about things like time-to-first-byte, time-to-interaction, etc… I’m talking about raw computing speed – how ... more
I complied a list of useful JavaScript stuff into a Github repository. This repository includes code for functions like: Mix (Deep assign library that works with accessors). Getting translate values Getting keyboard focusable elements Normalizing button ... more
I get this question once in a while from students who bought one of my books or courses. Each time, my answer is No. I wanted to give a thorough reasoning behind why I say No, and how this No helps me focus on the content I want to create. There are ... more
I often get requests from people who want me to look through their work and provide them with feedback. While asking for feedback is a praise-worthy thing – because you want to improve – I don’t have the time and resources to give feedback to everyone. ... more
I was living a comfortable life back in 2014. I was living my dreams. I freelanced and I earned an equal amount to my friends who held full-time jobs. I was free. Or so I thought. The first three years of freelancing were exciting. I simply loved hopping ... more
I created a library to merge objects last week. It’s called mix . mix lets you perform a deep merge between two objects. The difference between mix and other deep merging libraries is: mix lets you copy accessors while others don’t. You can find out ... more
I often find myself needing to calculate the horizontal center and vertical center of an element. One example is a popover. Your browser doesn't support embedded videos. Watch the video here instead. To position the popover perfectly, I need to know ... more
For the longest time, I thought that “Polymorphing” was about converting something into sheep (thanks to Warcraft). The sheep image stuck with me and made it hard to understand exactly what Polymorphism is. Today I want to explore what Polymorphism actually ... more
When this is used in an arrow function, this will be the this value in the surrounding lexical scope. Arrow functions change MANY things, so there are two best practices you need to know. Don’t create methods with arrow functions Create functions INISDE ... more
How do you get a translateX , translateY or translateZ value in JavaScript? Turns out, you need to read transform matrices. But it can be quite easy. Matrices Browsers turn transform values into 2d or 3d matrices depending on what transformations you ... more
There are many flavours to arrays in JavaScript. The possible methods you to create or change arrays are: unshift , shift , push , pop , splice , concat , slice , destructuring , rest operators , and spread operators . There are also looping methods ... more
I was able to create an Eleventy + Snowpack + Sass + PostCSS setup that works pretty well. I want to share this setup with you in this article. File structure There are basically two ways to structure source code: Put everything you write inside an src ... more
I was tinkering around with Dynamic Imports this week when I saw Snowpack in the JavaScript Weekly newsletter. It caught my eye and I gave it a whirl. I managed to get a decent Eleventy + Snowpack + Sass setup in a couple of hours. I’ll share this setup ... more
“I don’t get JavaScript. I can’t make components from scratch. My mind goes blank when I stare at a blank JavaScript file. I guess I can’t do it because I don’t know how to think like a programmer”. Sounds familiar? You’re not alone, my friend. Many ... more
Since I code on both Windows and Mac, I want my Visual Studio Code shortcuts to be interchangeable on both systems. So I dug deep into Visual Studio Code’s keyboard shortcuts for both systems and made my personal customisations. I want to share these ... more
I finally understood how to work with Node, Express, and MongoDB. I want to write a comprehensive tutorial so you won’t have to go through the same headache I went through. CRUD, Express and MongoDB CRUD, Express and MongoDB are big words for a person ... more
When I need to check a person’s details on Convertkit, I need to log in to Convertkit and search for the person’s email address. This process takes time, energy, and clicks. I’m not in the state to check a website when I’m doing work. I want to find ... more
We’re back to the end of the month. Here’s more resources for you. This time, I want to send you some design courses. Refactoring UI by Steve Schoger You’re totally missing out if you never heard of Refactoring UI. It’s one of the best resources for ... more
When you build JavaScript components, you need to manage focus for both keyboard users and screen readers. The WAI-ARIA specs say there are two ways to manage focus: Using element.focus and tabindex Using aria-activedescendant Which should you use and ... more
Accessibility is a big part of JavaScript. If you build anything with JavaScript, you need to make them accessible. I’ve been afraid of touching accessibility for a few years now. This fear magnified when I began writing the accessibility lessons for ... more
This is the third article in the Learn JavaScript design series. Today, I’ll talk about how I built the Account and Component Page. Account page I gave each student a default password. I want to let them change their password, so I created the Account ... more
I deleted many resources I found useful because I restricted myself to sharing only blog posts here. I want to change things up by sharing things I found helpful. I’ll send them once a month. Let me know if you enjoy this new format, or if you have any ... more
This is the second article where I explain how I designed Learn JavaScript’s course portal. If you missed the first part, you’ll want to read it first. Content page After I finished with the lessons page, I began work on the content page. I designed ... more
Learn JavaScript is my flagship JavaScript course. It helps people go from knowing nothing about JavaScript to becoming a professional JavaScript developer. Today, I want to share with you how I designed Learn JavaScript’s course portal. The lessons ... more
I built a login system with HTML, CSS, and JavaScript when I made Learn JavaScript’s student portal. I’d like to share this system with you since it seems to work well. How the system works The system goes like this: Let user login at the login page ... more
If you create JavaScript widgets, one of the key parts to accessibility is managing focus. To manage focus, you need to find keyboard-focusable elements. When you know the contents It’s easy to find keyboard-focusable elements if you know the contents ... more