How can I setup my react app in ubuntu server

Question

I completed few tasks in react js and I want to move them to server for my client review. But I don't know, how to ru this react app in server. Currently I am using http://localhost:3000

Here I have couple of questions. 1. Do we need to configure all the necessary settings in ubuntu server as well..? 2. I have a IP address pointed to my Ubuntu. So, how can I use that IP for running the app in server?

Here is my webpack.production.js file

var path = require('path');
var webpack = require('webpack');
module.exports = {
  entry: './main.js',
  output: {
    path: path.join(__dirname, '/dist/assets'),
    filename: '[name].bundle.js',
    publicPath: '/',
    sourceMapFilename: '[name].map'
  },

  plugins: [
    new webpack.LoaderOptionsPlugin({
      minimize: true,
      debug: false
    }),
    new webpack.optimize.UglifyJsPlugin({
      beautify: false,
      mangle: {
        screw_ie8: true,
        keep_fnames: true
      },
      compress: {
        screw_ie8: true
      },
      comments: false
    })
  ],
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015', 'react']
        }
      }
    ]
  }
}

"scripts": {
    "start": "if-env NODE_ENV=production && npm run start:prod || npm run start:dev",
    "start:dev": "webpack-dev-server --inline  --history-api-fallback",
    "start:prod": "webpack && node server.js",
    "build": "webpack -p --config ./webpack.production.config.js",
    "build:dev": "webpack --env=dev --progress --profile --colors",
    "build:dist": "webpack --env=production --progress --profile --colors"
  }

thanks

Answer 1

If you're using Webpack to create the bundle you need to move the index.html and the bundle.js to your client's server and configure a HTTP server like Nginx or Apache to point to the index.html file.

Answer 2

That question is very broad. In case you have a Server, you need to login there using ssh and install Apache or another Server like nginx. I guess your reacft app does not depend on PHP, or node, so it is static html with JS. So basically:

sudo apt-get install apache2

Will install the server and to check if it is running just use a browser and navigate to http://<your server ip> and you should see a page saying: »It's working«

If so:

cd /var/www/html
rm -rf *
exit

cd /your/local/project
scp -r * user@<your server ip>:/var/www/html

That should upload all your file to /var/www/html. If you then get a Forbidden response, you need to sudo chown -R www-data:www-data * in /var/www/html

Have a look here https://help.ubuntu.com/lts/serverguide/httpd.html

But, however, setting up a server becomes more complex, depending on your needs: like node/php/mysql support and of course the OS, the instructions above are suitable for ubuntu. Additionally no considerations about security are included, so be careful if do not know what you are doing!