Introduction

This article will show how to install React Framework module using a certain tool in Microsoft Windows. The name of the tool is ‘npm’ which stands for ‘node package manager’. It is a tool which is basically available to manage and administering package. Furthermore, according to the official website of ‘npm’ in this link, there are two main function or definition of the npm itself. The first one, it is an online repository for the publishing of open-source Node.js projects. The second one, it is a command-line utility for interacting with said repository that aids in package installation, version management, and dependency management. So, once there is a specific package need for further installation, it is possible by using a single command-line command. It is inline with this article where the main purpose is to perform how to installing React Framework module.

Installation Preparation by checking the existance of ‘npm’

So, the first step is to make sure that ‘npm’ tool exist. It is easy to make sure whether the ‘npm’ tool is available or not. Just execute the following command :

npm

The following is the execution of the above command :

C:\Users\Personal>npm
Usage: npm 
where  is one of:
    access, adduser, audit, bin, bugs, c, cache, ci, cit,
    clean-install, clean-install-test, completion, config,
    create, ddp, dedupe, deprecate, dist-tag, docs, doctor,
    edit, explore, fund, get, help, help-search, hook, i, init,
    install, install-ci-test, install-test, it, link, list, ln,
    login, logout, ls, org, outdated, owner, pack, ping, prefix,
    profile, prune, publish, rb, rebuild, repo, restart, root,
    run, run-script, s, se, search, set, shrinkwrap, star,
    stars, start, stop, t, team, test, token, tst, un,
    uninstall, unpublish, unstar, up, update, v, version, view,
    whoami
npm  -h  quick help on 
npm -l            display full usage info
npm help    search for help on 
npm help npm      involved overview
Specify configs in the ini-formatted file:
    C:\Users\Personal\.npmrc
or on the command line via: npm  --key value
Config info can be viewed via: npm help config
[email protected] C:\Program Files\nodejs\node_modules\npm
C:\Users\Personal>

Another command execution which is way more simple is just to execute ‘npm’ by adding a specific parameter for showing the version of it. The following is the command pattern of it :

npm --version

The execution of the above command pattern is in the following output :

C:\Users\Personal>npm --version
6.14.4
C:\Users\Personal>

Installing the ‘create-react-app’ module using ‘npm’

So, according to the above command execution of ‘npm’, the ‘npm’ tool is exist and it is available for further execution. Since the main purpose is for React Framework module installation, just execute the following command :

npm install -g module_name

The execution of the above command pattern in order to create an application using React Framework application template is in the following command :

C:\node\chat-app\client>npm install -g create-react-app
C:\Users\Personal\AppData\Roaming\npm\create-react-app -> C:\Users\Personal\AppData\Roaming\npm\node_modules\create-react-app\index.js
+ [email protected]
added 99 packages from 47 contributors in 35.281s

Checking the existance of ‘create-react-app’ module using ‘npm’ after previous installation

In order to check whether the create-react-app module is exist as the result of the above installation command using npm, just execute the following command to check it :

npm list -g

The following is the execution of the above command pattern :

 
C:\Users\Personal>npm list -g
C:\Users\Personal\AppData\Roaming\npm
`-- [email protected]
  +-- [email protected]
  | +-- [email protected]
  | | +-- @types/[email protected]
  | | `-- [email protected]
  | |   `-- [email protected]
  | `-- [email protected]
  |   `-- [email protected]
  +-- [email protected]

Apparently, the module with the name of ‘create-react-app’ exist as the result of the previous installation command using ‘npm’ tool.