Create a Reactjs Application

Upgrade Nodejs

The default installed version of Nodjs in Ubuntu 16.04 is 4.x and I could not upgrade it to the latest 6.x from normal update using apt update. So, we need to add sources for nodejs to upgrade to the latest version. We need latest version which functions better and the create-react-app works perfectly.

So, to upgrade, we need to create a new sources list file for nodejs.

1. Create a new file /etc/apt/sources.list.d/nodesource.list with the following contents: deb https://deb.nodesource.com/node_6.x xenial main
   deb-src https://deb.nodesource.com/node_6.x xenial main
   
2. Add public key which is needed:
   curl -s https://deb.nodesource.com/gpgkey/nodesource.gpg.key | sudo apt-key add -
3. Update Repository
   sudo apt update
4. Check
   sudo apt-cache policy nodejs
   You will see which version gonna install
5. Install
   sudo apt install nodejs   

Alternative 1 for the above mentioned method will be NVM (Node Version Manager). The installation of nvm is carried out as follows:


1) cd /tmp
2) wget https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh
3) chmod +x install.sh
4) sudo bash install.sh
5) Restart terminal
6) Now, you can check the available versions:
   nvm ls-remote
7) Finally, install the version wanted (I prefer LTS one!)
    sudo nvm install v6.11.2

[
In case, if nvm ls-remote returns N/A message, you have to insert the following tow lines as the environmental variables.

export NVM_NODEJS_ORG_MIRROR=http://nodejs.org/dist
export CURL_CA_BUNDLE=/etc/ssl/certs/ca-certificates.crt

So far so good, if multiple versions are installed, then we have to select the one as default using
(*Lists the versions installed *)
nvm ls  
(*Select the one as default*)
use [Version]

]

Alternative 2
Another simple approach is to install npm package manager.
$sudo apt install npm

Then install node
$sudo npm install -g n
$sudo n latest 
or
$sudo n 8.9.0
 
Create Reactjs Project

After installation of nodejs, now we create a reactjs application. The easiest method is install create-react-app package and start with a new scratch project.

npm install -g create-react-project
create-react-app my-app
cd my-app
npm start

Thats it! Now you can see the running react application in localhost:8000

After the application is ready for deployment, we use the following command to build.

npm run build

This process creates a build directory with all files we need to deploy.