Frontend Development Tutorials 👨🏼‍💻 🔥

The HTTP/2 protocol

A detailed description of how the HTTP/2 protocol works

call() and apply() in JavaScript

Find out how to use call() and apply() and their difference in JavaScript

Unidirectional Data Flow in React

Working with React you might encounter the term Unidirectional Data Flow. What does it mean?

How to reference a DOM element in React

Find out how to ref a DOM element in React

How to count the number of properties in a JavaScript object

Find out how to calculate how many properties has a JavaScript object

How to sort an array of objects by a property value in JavaScript

Find out how to sort an array of objects by a property value in JavaScript

How to set default parameter values in JavaScript

Find out how to add a default parameter value into a JavaScript function

How to encode a URL with JavaScript

You might need to encode a URL if you are sending it as part of a GET request, for example.

How to empty a JavaScript array

Given a JavaScript array, see how to clear it and empty all its elements

How to replace a DOM element

Given a DOM element, how do you replace it with another?

How to get the scroll position of an element in JavaScript

When you are building a user interface in the browser, you might have an element which can be scrolled, and it's a common need to know the horizontal and vertical scrolling it currently has.

How to merge two objects in JavaScript

Find out how to merge 2 JavaScript objects and create a new object that combines the properties

Zeit Now Tutorial

Find out how to use the Now platform created by Zeit

Introduction to Gatsby

Gatsby is a platform for building apps and websites using React

What is a CDN?

Discover what is a CDN and why it's useful

The social proof principle

What is scarcity? How can it help you grow your business?

What is the JAMstack?

Find out what does JAMstack mean, and the advantages of this set of technologies

Use the Chrome DevTools to debug a Node.js app

When we're programming it's common to have the need to quickly test and do some experiments with a piece of code.

How to use MongoDB with Node.js

In this tutorial I'll show you how to interact with a MongoDB database from Node.js

The scarcity principle applied to software products

What is scarcity? How can it help you grow your software-based business?

How MongoDB is different from a SQL database

Generally speaking there are 2 major types of databases: SQL databases, and NoSQL databases

The MongoDB basics tutorial

MongoDB is a database, the part of the application responsible for storing and retrieving information.

How to use the macOS terminal

The terminal is one key piece of your programming arsenal. It allows you to perform tasks that are otherwise impossible to achieve.

Angular

Placeholder for upcoming Angular tutorials

How to hide a DOM element using plain JavaScript

Find out how to hide and then show again elements in vanilla JavaScript

Should you use or learn jQuery in 2018?

To use or not to use? To learn or not to learn? Let's see how you can avoid jQuery altogether, and the reasons you should keep using it

WebRTC, the Real Time Web API

How to use WebRTC to create a direct webcam communication application with this simple tutorial

How much JavaScript you need to know to use React?

Find out if you have to learn something before diving into learning React

How to hide the address bar in Chrome

Useful for screenshots and screencasts, or just to increase the real estate of your screen

The JSONP Guide

JSONP is a way to load data from 3rd party servers, bypassing the same-origin policy

Introduction to JSON

JSON is a great format to store data, widely used in JavaScript but not only - discover all about it!

Run a web server from any folder

An introduction to WebAssembly

Discover why WebAssembly is a very important part of the Web platform of the future

What is a Single Page Application?

Modern Web Applications are also called Single Page Applications. What does this mean?

Should you use Vue or React?

Many people asked me to write my opinion on React vs Vue.js. Here are my thoughts.

Should you use jQuery or React?

The tl;dr is, it depends!

Props vs State in React

What's the difference between state and props in React?

How to get the index of an iteration in a for-of loop in JavaScript

How to loop inside React JSX

How to loop in a React component JSX

React: How to show a different component on click

Toggle the visibility of components by telling React to display another component when you click something

HTML Canvas API Tutorial

A guide to the Canvas API, one way offered by browsers to draw to the screen

React concepts: declarative

What does it mean when you read that React is declarative

React PropTypes

How to use PropTypes to set the required type of a prop

The React Context API

The Context API is a neat way to pass state across the app without having to use props

The React Fragment

How to use React.Fragment to create invisible HTML tags

React Props

How to use props to pass data around your React components

The React State

How to interact with the state of your components

React Events

Learn how to interact with events in a React application

The Virtual DOM

The Virtual DOM is a technique that React uses to optimize interacting with the browser

React Components

A brief introduction to React Components

Introduction to React

An introduction to the React view library

How to add a click event to a list of DOM elements returned from querySelectorAll

How to iterate a NodeList and attach an event listener to each element

How to change a DOM node value

Given a DOM element, how do you change its value?

How to check if a DOM element has a class

How do you check if a particular DOM element you have the reference of, has a class?

How to remove a class from a DOM element

TL;DR: Use the remove() method on element.classList

How to generate a random number between two numbers in JavaScript

The simplest possible way to randomly pick a number between two

How to loop over DOM elements from querySelectorAll

TL;DR: Use the for..of loop

How to add a class to a DOM element

TL;DR: Use the add() method on element.classList

How to wait for the DOM ready event in plain JavaScript

How to run JavaScript as soon as we can, but not sooner

Async vs sync code

The difference between running code synchronously or asynchronously

Why should you use Node.js in your next project?

When is it a good idea to use Node.js over other technologies? Why Node.js and not another solution? This post aims to answer that question.

How to write a JSON object to file in Node.js

Discover how to save a JSON object to file in Node.js, and retrieve it later

How to determine if a date is today in JavaScript

Discover how to find out if a Date object represents a today datetime

How to get the last updated date of a file using Node.js

Discover how to retrieve the last updated date of a file with Node.js

How to use Async and Await with Array.map()

Using async/await combined with map() can be a little tricky. Find out how.

How to remove a file with Node.js

Discover how to remove a file from the filesystem with Node.js

How to create an empty file in Node.js

Discover how create an empty file in a filesystem folder in Node.js

Disconnect time from money

How to make your earnings not depending on the hours you work, but to the number of products sold

The HTTP Status Codes List

Every HTTP response comes with a status code that signals with a clear number information about how the request was processed

Caching in HTTP

A detailed description of the caching options available through the HTTP protocol

The curl guide to HTTP requests

curl is an awesome tool that lets you create network requests from the command line

The HTTPS protocol

The HTTPS protocol is an extension of HTTP, the Hyper Text Transfer Protocol, that provide secure communication

The HTTP protocol

A detailed description of how the HTTP protocol, and the Web, work

The ES2018 Guide

ECMAScript is the standard upon which JavaScript is based, and it's often abbreviated to ES. Discover everything about ECMAScript, and the last features added in ES2018, aka ES9

What is an RFC?

RFCs, Request for Comments, are publications from the technology community

The ES2017 Guide

ECMAScript is the standard upon which JavaScript is based, and it's often abbreviated to ES. Discover everything about ECMAScript, and the last features added in ES2017, aka ES8

How to initialize a new array with values in JavaScript

Find out how you can initialize a new array with a set of values in JavaScript

Why should I create an email list?

95 people on 100 will never get back to your blog. They just found it by chance. Give them a reason to stay in touch.

The ES2016 Guide

ECMAScript is the standard upon which JavaScript is based, and it's often abbreviated to ES. Discover everything about ECMAScript, and the last features added in ES2016, aka ES7

How to get the current URL in JavaScript

Find out the ways JavaScript offers you to get the current URL that's opened in the browser

How to create a multiline string in JavaScript

Discover how to create a multiline string

The ES6 Guide

ECMAScript is the standard upon which JavaScript is based, and it's often abbreviated to ES. Discover everything about ECMAScript, and the last features added in ES6, aka ES2015

The best podcasts for frontend developers

Some nice podcasts to listen to while commuting or in general when you are away from keyboard

How to check if a string starts with another in JavaScript

Checking if a string starts with another substring is a common thing to do. See how to perform this check in JavaScript

How to get the unique properties of a set of object in a JavaScript array

Given an array of objects, here's what you can do if you want to get the values of a property, but not duplicated.

Product / market fit

Your product must meet the needs of a niche, solving a problem

How to validate an email address in JavaScript

There are lots of ways to validate an email address. Learn the correct way, and also find out all the options you have, using plain JavaScript

How to check if a file exists in Node.js

How to check if a file exists in the filesystem using Node.js, using the `fs` module

Remote working for software developers

Is remote working making you a more effective developer? A happier developer? How can you improve?

Node, the difference between development and production

Learn how to set up different configurations for production and development environments

The niche

Define your niche, your tribe. Those who belong to that tribe will strive to buy your product or at least will be strongly attracted, because it is specially made for them

Manage Cookies with Express

How to use the `Response.cookie()` method to manipulate your cookies

Handling CORS in Express

How to allow cross site requests by setting up CORS

Handling file uploads in forms using Express

How to manage storing and handling files uploaded via forms, in Express

The idea is nothing

Ideas are worthless. Execution plus idea is everything.

Handling forms in Express

How to process forms using Express

Work with HTTP headers in Express

Learn how to access and change HTTP headers using Express

Setup Let's Encrypt for Express

How to set up HTTPS using the popular free solution Let's Encrypt

Middleware in Express

A middleware is a function that hooks into the routing process, and performs some operation at some point, depending on what it want to do.

Have a purpose for your business

Having a purpose is a high-motivating factor to overcome challenges