Chapter 3 – React and Node.JS Virtual Environment Set in Macbook

In this article, I would walk through the up-to-date steps to create a virtual development environment for React and Node.js. By the end of this piece, you are able to deploy your Web3 Dapp, or React App in this environment without interrupting your main system.

In this article, I would walk through the up-to-date steps to create a virtual development environment for React and Node.js. By the end of this piece, you are able to deploy your Web3 Dapp, or React App in this environment without interrupting your main system.

Table of Contents: React and Node.JS Virtual Environment Set in Macbook

Install Virtualenv

First thing first, we would need to create a directory folder in your Macbook and install the virtualenv package in the main system using Visual studio code.

Please be sure to use sudo to install because it can resolve the permission issues that might come up in the upcoming steps. Here is the command sample

Sudo pip install virtualenv

Virtualenv & Source

Once it’s done, we can create a virtualenv folder in the directory you created above and activate the new virtual environment. Here you go.

Virtualenv newENV

Source newENV/bin/activate

The latest version of virtualenv has already included the no-site-package. Hend it’s unnecessary to command when creating a new virtual enviroment folder.

Install nodeenv & Certifi Issue Solution

Now we need to install the nodeenv which is a tool to create isolated node.js environment for your React App development environment.

Pip install nodeenv

Then, it’s required to add a node.js virtual environment into the current virtual environment created earlier. For the latest node.js version, please check the official website searching in Google.com

Nodeenv –node=18.15.0 -p

In this step, some users raise this command in VSC is not allowed to complete due to certifi failure issues. The main reason of this issue is because the certificate command file from the Python package in the main system is not activated yet. Thus, we need to add a script in the virtual environment and run it to activate.

If you would like to have the full version of this script, please subscribe to us with the message “Chapter 3 React JS Certifi script, we’ll send you very soon.

Add the latest npm packages

Now things go smoothly and the next step is to add the latest node packages by the command as follows:

npm i -g create-react-app@5.0.1

Create a new React App

Last but not least, we can create a new react app and start the prorduction using the comand as follows

Npx create-react-app newAppname

Npm start

Full Certifi Script for Resolving the Permission Issue

If you are interested in Certifi Script for Resolving the Permission Issue, please subscribe to our newsletter by adding the message “Chatper3 react js”. We would send you the script immediately to your mailbox.

I hope you enjoy reading Certifi Script for Resolving the Permission Issue. If you did, please support us by doing one of the things listed below, because it always helps out our channel.