Hooks have been officially added to React as of React 16.8. One of the main benefits of Hooks in React is that you can use state and effect (which is generally a combination of different life cycles into one) in a component without creating a class.

In this tutorial, you’ll learn how to exactly use hooks in React. We will build a simple website that gives the user some options to pick from in order to generate some random number trivia.

You can check out the demo for the website here, and the source code on the GitHub repository.

Let’s…

What’s a better way to learn how to make a Chrome extension than making the web cuter with Pikachu images?

In this tutorial, I will show you how you can create a simple Chrome extension that replaces images on websites with Pikachu images. We will discuss topics like content scripts, background scripts, and messages between scripts in Chrome extensions.

The code for this tutorial is available here.

First thing you need to do when creating any chrome extension is start with creating a manifest.json file in the root of the extension’s directory. …

This was originally posted on my personal blog.

In this tutorial, we’ll go over how to create a simple custom React hook, testing it locally, and then publishing it on NPM. The React hook we’ll create isuseOnlinewhich detects if the user goes offline and shows them a message that they're offline.

After implementing it, we’ll check how we can test it locally, then publishing it on NPM.

If you’re checking out this tutorial to learn only how to create a custom hook to use it in an existing project without intending on publishing it as a package on NPM, then…

This article was originally published on my personal blog

Whenever you want to loop through an array in Javascript, the common approach taken is using theforloop. Although this is a valid choice, there are many other approaches that you can take to loop through an array in Javascript.

forEach

forEachallows you to loop through all items in an array. For example, a for loop like this:

for (let i = 0; i < arr.length; i++) {
	console.log(arr[i]);
}

will become:

arr.forEach((item) => console.log(item));

This eliminates the need to keep using the index to access the item, especially when the items in…

This article was originally published on my personal blog.

Learning Git is very important for every developer. And for many beginners, it can be very confusing, as well.

In this article, I’ll go over the basic Git commands you’ll need to know as a beginner in a simple manner.

Cloning a Repository

This one is simple in itself. You just created a repository and you want to clone it on your machine. Just run:

git clone <REPOSITORY_GIT_URL>

Adding a Repository Into an Existing Project

Let’s say you already are working on a project and decided later on to create a repository for it. …

This article was originally published on my personal blog.

Throughout my years of working in CSS, the property that causes the biggest mess in the layout isfloat. Wheneverfloatis used, unexpected behavior occurs at some point in your layout and design. I've also seen a few beginners who stumbled upon issues like this. They use float then when problems arise, they find it hard to link it back to the floated element.

For this reason, I’m giving you a few options you can use to achieve the same effect you need withfloatwhile avoiding the mess. …

This article was originally published on my personal blog.

If you own a blog like me, but also cross-post your articles on platforms like Dev, Hashnode, and Medium, it gets tedious to post your articles in different places.

So, I created a simple CLI to cross-post my articles on these platforms easily. You can find it on NPM and check the code on GitHub.

Installation

In your terminal:

npm i -g cross-post-blog

Usage

Set Configuration

For the simplicity of the CLI, and considering most of the APIs of each of the platforms do not allow or provide endpoints for user authentication, you will need…

This article was originally published on my personal blog.

Not long ago I wrote an article about tips for beginners to open source. It was to help some confusions beginners have when they contribute to open source projects. In this article, I will try to give out some tips for maintainers of open source projects.

I personally have been maintaining a couple of open source projects and I have learned a thing or two along the way, so I’m writing this in the hopes that it will help new or beginner maintainers. …