Step-by-step tutorial on how to create a simple Chrome extension using ReactJS and add context menu functionality with Manifest V3.

I stumble upon the need to write a chrome extension, so this is my series on modern chrome extension writing using Manivest V3.

At firts it took me hours to figure out how to do context menus correctly, so… Here it is:

A step-by-step tutorial on how to create a simple Chrome extension using ReactJS and add context menu functionality with Manifest V3.

Prerequisites

Before we begin, you should have the following installed on your machine:

• Node.js (v12 or higher)
• NPM (v6 or higher)
• Chrome Browser (v94 or higher)

Step 1: Create a new ReactJS project

Open up your terminal and create a new ReactJS project using the following command:

npx create-react-app my-chrome-extension

This command will create a new ReactJS project in a folder called my-chrome-extension.

Step 2: Create the manifest.json file