In JavaScript, there are three popular methods that we usually use to perform data transformation: map, filter, and reduce.

In this article, we will take a closer look at these functions and some related code examples.

.map ( )

The map() method takes an array, loops over that, and in each iteration, it applies a callback function to the current array element. The function maps the values of the original array to a new array, and that’s why it is called “map”.

Let’s suppose we have an array of bank movements in US Dollars and we want to convert them to Euros.

const…

Do you want to take your developer skills to the next level or do you want to impress your future employer? Then build this LinkedIn Clone!

Part 4

In part 3 of this series, we built the Feed & the Widgets component, and we connected the feed component to Firestore.

In this last article, we will set up Redux to manage the state of the user, build the login page, and finally deploy to Firebase!

1. — Setting up Redux

Redux is a JavaScript library for managing application state. In the first episode, we created a React application starter with the Redux Toolkit. This created a template…

Do you want to take your developer skills to the next level or do you want to impress your future employer? Then build this LinkedIn Clone!

If you get stuck, don’t worry! I will provide you with the whole code at the end of each section. In addition, in the last installment of this tutorial, I will give you access to the full source code on my GitHub.

Part 3

In part 2 of this series, we completed the Header component, built the Sidebar component, and finished the top part of the Feed component.

In this part, we will conclude the Feed…

Do you want to take your developer skills to the next level or do you want to impress your future employer? Build this LinkedIn Clone!

If you get stuck, don’t worry! I will provide you with the whole code at the end of each section. In addition, in the last instalment of this tutorial, I will give you access to the full source code on my GitHub.

In part 1 of this series, we set up our React project with the Redux Toolkit, built the left part of the <Header/> component, and set up Firebase for authentication, database, and hosting.

…

Do you want to take your developer skills to the next level or impress your future employer? Then build this LinkedIn Clone!

In this four-part series, I will show you how to build a completely functional LinkedIn Clone from scratch. If you get stuck, don’t worry! I will provide you with the whole code at the end of each section. In addition, in the last installment of this tutorial, I will give you access to the full source code on my GitHub.

Before we get started

Before we get started, let’s take a look at the technologies that we are going to use:

• React.js…

Do you want to take your developer skills to the next level or impress your future employer? Then build this Google Clone!

Part 4

In part 3 of this series, we set the Google Search API, created the useGoogleSearch custom Hook, and completed the search results header.

In this last part, we will finish the search results page and deploy our application with Firebase!

1. Complete the Search Results Page

• In SearchPage.js , wrap the <div> with the className of searchPage__results in curly braces, including term and the JavaScript logical && operator. …

Do you want to take your developer skills to the next level or impress your future employer? Then build this Google clone!

If you get stuck, don’t worry! I will provide you with the whole code at the end of each section. In addition, in the last installment of this tutorial, I will give you access to the full source code on my GitHub.

Part 3

In part 2 of this series, we built the UI of the <Search/> component, added the search functionality, finished the homepage, made the <Search/> component reusable, and implemented the global state management with React Hooks and…

Do you want to take your developer skills to the next level or impress your future employer? Then build this Google clone!

If you get stuck, don’t worry! I will provide you with the whole code at the end of each section. In addition, in the last installment of this tutorial, I will give you access to the full source code on my GitHub.

Part 2

In part 1 of this series, we set up our React project, installed and set up the React Router, created the homepage header, and added and styled the Google logo.

In this part, we will work…