Articles

Will you create React/ Vue / Other-framework Courses?

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.

How to improve without receiving feedback

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.

I suspect that’s the case for others too. We’re all busy.

When I ask others for feedback, sometimes I don’t get responses. Sometimes I get subpar responses. I found it hard to get specific, detailed, and actionable advice from people unless they have a skin in the game for helping me out.

For example: You’re paying for their services, so they have an incentive to help you. Another example: You’re in a project together with them; if you succeed they succeed.

If you get specific and helpful feedback, great! Use that feedback and improve. But the question remains: How can you improve if you don’t get feedback?

How to create sites with winding SVG paths

I saw an article by Sarah Drasner about how she created Netlify’s million-developers site on CSS Tricks. I was intrigued by how the site was created. (Not the Vue parts, but she coded up the paths on the site).

What paths?

Here’s the Mobile and Desktop view, side by side. I’m talking about the winding paths that lead from one set of content to another set of content.

Million Devs site: mobile and desktop versions compared.

I always wanted to create a site with curved elements, similar to this. So I took the chance to inspect the code. What I realised blew my mind 🤯.

TCC: The course that gave me the strength to pursue my dreams

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 around different agencies, creating websites for a living, making friends, and knowing more people. I felt I could do this forever. But I was wrong.

Why use Getters and Setters functions

Getter and Setter functions are collectively known as accessor functions. In my previous two articles, I talked about how I created mix because I wanted to use Getter and Setter functions.

But why do we even use Getters and Setters in the first place?

Why use getters and setters?

I have two reasons.

  1. Syntax reasons
  2. Encapsulation

Copying properties from one object to another (including Getters and Setters)

Object.assign is the standard way to copy properties from one object to another. It is often used for copying properties that are one-layer deep. (One-layer deep means there are no nested objects).

It can be used to extend settings from a default object. Here’s an example:

const one = { one: 'one' }
const two = { two: 'two' }
const merged = Object.assign({}, one, two)

console.log(merged) // { one: ‘one’, two: ‘two’ }

Unfortunately, Object.assign doesn’t copy accessors. (Accessor is a term for Getter and Setter functions). Object.assign reads the value of a Getter function and copies that value instead.

let count = 0
const one = {}
const two = {
get count () { return count },
set count (value) { count = value }
}
const three = Object.assign({}, one, two)

console.log(‘two:’, two) console.log(‘three:’, three)

Try logging two and three in a Node environment. Accessors will be logged clearly. You’ll immediately see that three.count is NOT an accessor.

Accessors are not copied into three.

Getting the horizontal and vertical centers of an element

I often find myself needing to calculate the horizontal center and vertical center of an element.

One example is a popover.

To position the popover perfectly, I need to know the horizontal and vertical centers of the button that triggers the popover. Here’s one example of a calculation I had to make.

One of the popover calculations.

Polymorphism in JavaScript

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 is. (Fun fact: Most articles about Polymorphism in JavaScript covers less than 1/3 of what it actually is).

Hold on while i sign you up…

🤗
Woohoo! You’re in!
Now, hold on while I redirect you.