Blog posts

What do async and await really mean?

Road marks: there and back

async...await syntax only appeared in JavaScript recently - it was introduced in ECMAScript 2017. However, it still remains a bit of mystery. Most articles I read state that async…await is syntactic sugar over JavaScript promises. But what does that mean exactly?

Are async and await two parts of the same syntax, or they are two separate things?

Do we have to use them together with each other? Or can we use async without await and vice versa?

How different they are from promises?

Why would we use them over promises?

Let’s find out.

Read more →

Blog posts

How to make a copy of an array in JavaScript

Copy machine

Making copies of arrays in JavaScript is not as straightforward as it seems. It certainly not as easy as b = a.

Let’s look at an example:

let a = [1, 2, 3]
const b = a
console.log( a === a)
---
a is array of  [ 1, 2, 3 ]
b is array of  [ 1, 2, 3 ]
Is a equal b?  true

So far so good. Here’s what we did:

  • a is an array.
  • We assigned it to b.
  • Now b is also an array.
  • It contains the same elements as a.
  • And a equals b.

Is the job done? Not quite.

Read more →

Blog posts

A two-minute guide to deploying your React app to Netlify cloud

Plug into cloud

Up until a couple of years ago, I hosted this site, all of my React applications, code demos etc on virtual private servers (VPS). I tried AWS, Digital Ocean and others. Some of them were more convenient to deal with. But frankly, all of them were a huge pain in the butt. In the start, I had to spin up my own VPS, configure a web server, security, firewall, user logins, SSH keys, SSL certificates, DNS records. And that took a day if I worked fast. Then I had to figure out a way to deploy my apps.

If that was it I could live with it. But that was just a starting step. Then comes maintenance: security updates, OS upgrades and so on. Over years that added to a massive amount of time. The time that I would rather spend making things. And did I mention that I had to pay for my virtual servers?

Then I discovered Netlify cloud. I switched and never looked back. Today this site ozmoroz.com is hosted on Netlify. As well as my code examples such as this CSS Transitions demo.

Netlify cloud platform makes deploying applications to the cloud extremely easy. Setting up your app on Netlify takes just a couple of minutes. After that, all subsequent deployments are as easy as pushing your code to Git.

It gets better. Netlify is effectively free. You’ll need to pay when you hit certain limits. However, they are very generous. I host multiple sites and apps on Netlify, and I am yet to pay a cent.

Sounds good? I encourage you to check it out yourself. In this step-by-step guide, I’ll show your how to deploy your React app to Netlify.

Read more →

Blog posts

You may not need Redux

Erasing complexity

If you were starting a new React project a few years ago, that almost always meant that you’d include Redux. React and Redux were thought to be one indivisible entity. When I was learning React myself I did that with the help of Stephen Grider’s excellent course Modern React with Redux. That course is a true bestseller. Nearly 200,000 students watched it since it was released. Stephen keeps it updated so that it includes the latest React features. You got it - that bestselling course on React has “Redux” in its title.

The year is now 2020 as I am writing it from a social distancing safety of my home. Quite a lot has changed in React in those few years. We now have hooks, we mostly write functional components and we now have a new and improved context API.

The big question is: Do we still need Redux?

I personally didn’t use Redux in any of project I started over the last couple of year or so. I don’t expect to use it in future either. Here’s why.

Read more →

Blog posts

Introduction to asynchronous operations in Javascript

Synchronous / Asynchronous

If you are learning JavaScript, you no doubt came across things like callbacks, promises, generators, and async / await. Those are asynchronous programming paradigms. In Javascript they are everywhere. If you want to understand JavaScript, you need to understand them. However, there is a problem.

Although there is no shortage of tutorials explaining callbacks, promises and async / await, most of them leave you scratching your head because they don’t answer one question:

What the heck asynchronous mean?

Most of the tutorials and articles I read just assume you already know that. What if you don’t? That’s why you are here.

Keep reading, and I will explain:

  • What synchronous and asynchronous mean
  • Why we need asynchronous operations
  • How asynchronous operations work
  • What kind of operations can be asynchronous in JavaScript
  • How you can make your own asynchronous operations
Read more →