React.js & Express.js ES6 Build and Deployment Get DigitalOcean account I have been using for me and setup for my customers, so recommend use it for your project just pick vps depend on how big of your project start at 5$ or 10$, 20$, price very flexibility. DO providing SSD cloud hosting but good price i dont think you can get same price on other providers with same quality. beside their support very fast and well documentation , friendly UI for end-user. so let get start register an account and deploy your app at DigitalOcean DigitalOcean.com Setup Ubuntu on DigitalOcean Cloud VPS This tutorial i will use Ubuntu and i also recommend this OS for your vps. but it is your choose. for me i use Ubuntu 16.04 version. for price it is depend on how big of your project how many trafics to. for me i start at 20$/month is good start and then we can upgrade. Choose a datacenter region: DigitalOcean has many datacenters that mean you can pick one for your project if your visitors almost from NY United States let select New York, so example if i target all visitors from Vietnam for a project so i can pick a datacenter near Vietnam is Singapore. Select additional options: if you want to have additional backup service, or private network. Add your SSH keys: you can genrate your ssh key on your computer and copy it to your vps and that mean when you login from ssh dont have to enter the password of root account any more, save your time and more security, if you would to know how to generate ssh key and use it on DigitalOcean hosting let see this article Droplet default is 1 if you want to setup mutiply droplets at once time let use it. name of your droplet and click submit, just get a cup of coffee and wait a moment for DigitalOcean setup for you. until you see “Happy coding!” Your cloud vps is ready to use. Check your email address that you did register in DigitalOcean you shold get an email notify about your VPS IP, root account and password. here is format of your email Droplet Name: [Name of your Droplet] IP Address: [your-vps-IP] Username: root Password: [your-root-password-generated-by-robot] Login to your vps with following command ssh root@YOUR-IP-ADDREESS now enter your root password that in your email. You will asking for change new password at the first time. Server will ask you current password again (this is password in your email) Enter new password Confirm password , and remember it for later. Done and happy setting up your cloud. Configure Firewall on your Cloud This is very important step we need to do. so we need to reconfigure our firewall software to allow access to the service I recommend open port only for 80,443, ssh (port 22), but it is depend on your project may need more port open for other service. in this project we need open port 80 for http access, 443 https (ssl) , and port 22 (for ssh login) that is enough. Install Nginx apt-get update

sudo apt-get install nginx By default Firewall is inactive, you can check it by run command sudo ufw status sudo ufw app list So let config FW allow those ports by sudo ufw allow 'Nginx Full'

sudo ufw allow 'OpenSSH'

sudo ufw enable Setup Nodejs on DigitalOcean Ubuntu 16.04 We are using Node.js for Backend and will serve static files of react application build. So Node.js is required visit to see the documentation https://nodejs.org/en/download/package-manager/ We use package management to install, here is command to install Node.js v9 curl -sL https://deb.nodesource.com/setup_9.x | sudo -E bash -

sudo apt-get install -y nodejs After successful Node.js installed we can check the version by typing in command line : and you see see "v9.3.0" node -v Setup MongoDB v3.6 on DigitalOcean Ubuntu 16.04 Cloud VPS We are using MongoDB for database in backend restful service so let install Mongodb by follow the documentation https://docs.mongodb.com/manual/tutorial/install-mongodb-on-ubuntu/ Import the public key used by the package management system sudo apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv 2930ADAE8CAF5059EE73BB4B58712A2291FA4AD5 Create a list file for MongoDB (Ubuntu 16.04) echo "deb [ arch=amd64,arm64 ] https://repo.mongodb.org/apt/ubuntu xenial/mongodb-org/3.6 multiverse" | sudo tee /etc/apt/sources.list.d/mongodb-org-3.6.list Reload local package database sudo apt-get update Install the latest stable version of MongoDB sudo apt-get install -y mongodb-org Start MongoDB (Port running default: 27017) sudo service mongod start If You Want to Stop MongoDB sudo service mongod stop Or Restart MongoDB sudo service mongod restart Install Nginx — Http Proxy Server. Let me explain to you very simple why we do use Nginx for this Nodejs Web application. Example: Our Chat app when we start it running on port 3000 that is default of Nodejs application running. we can change the port to 3001 or 3002, or 8080 … so if you pointed your domain tabvn.com to Degital Ocean cloud vps so this case we can visit the chat app in so we need just see nodejs web app in default port 80 such at , that is why we use Nginx. http://tabvn.com:3000 http://tabvn.com To install Nginx visit the documentation from official http://nginx.org/en/linux_packages.html So we will run following command on Ubuntu Cloud Hosting 16.04 apt-get update

sudo apt-get install nginx Start Nginx: open your IP address ex: you should see “Welcome to nginx!”, all Nginx config in our cloud is in /etc/nginx/nginx.conf http://123.456.789 sudo nginx Stop Nginx sudo nginx -s stop Reload Nginx nginx -s reload Fixed issue of bcrypt on Ubuntu 16.04 sudo apt-get install build-essential Nginx config sample support WebSocket Nginx Websocket document: http://nginx.org/en/docs/http/websocket.html server {        listen 80;        root /var/www/html;        location / {                proxy_pass http://127.0.0.1:3001;                proxy_http_version 1.1;                proxy_set_header Upgrade $http_upgrade;                proxy_set_header Connection "upgrade";        }} Video: https://www.youtube.com/watch?v=wJsH45eWNBo

Target

YouTube

Too Long; Didn't Read

In your car, at home, or at work — Bosch technology shapes many areas of life.

Deploy React.js (create-react-app) Node.js to DigitalOcean Cloud Hosting

Too Long; Didn't Read

Companies Mentioned

Tabvn

About Author

TOPICS

THIS ARTICLE WAS FEATURED IN...

Deploy React.js (create-react-app) Node.js to DigitalOcean Cloud Hosting

Too Long; Didn't Read

Companies Mentioned

Tabvn

About Author

TOPICS

THIS ARTICLE WAS FEATURED IN...

RELATED STORIES