CODEWITHSUNDEEP
reactjsnpmlocalhost
developer_beginning
developer_beginning

Reputation: 393

Running react code on other machine

Hi I am working on reactJS Would Like to understand how can I run my local React app running on http://localhost:8888/index.html#/?_k=pu9k2u through my IP address on some other machine ?

Whenever I do a "npm start" it always runs on localhost:8888

How do I change it to run on 0.0.0.0:8888 ?

I know how to change the port for the app,

Following is my webpack.congif.js

module.exports = {
  entry: './index.js',

  output: {
    filename: 'index.js',
    path: ''
  },

  devServer: {
    inline:true,
    port: 8888
  },

  module: {
    loaders: [
      { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015&presets[]=react' }
    ]
  }
}

Since I am very new to reactJS kindly explain the solution given below or provide with an updated webpack.config.js

How to make the webpack dev server run on port 80 and on 0.0.0.0 to make it publicly accessible?

Upvotes: 4

Views: 18674

Answers (3)

LightMan
LightMan

Reputation: 3575

This is what I do: instead of using an IP address I tell node to use the local hostname of the computer. This is done in the package.json file in the scripts section with the HOST param, there is a PORT param too:

  {
  ...,
  "scripts": {
    "start": "node scripts/start.js",
    "start-local": "HOST='BlueLight.local' node scripts/start.js",
    "build": "node scripts/build.js",
    "test": "node scripts/test.js --env=jsdom",
    ....
  }
  ...

My hostname is BlueLight so my local address is BlueLight.local, open the terminal and write hostname command to find out yours.

So any computer in my local network can open http://BlueLight.local:3000 you can even use mobile phones, and I even use iPhone or Android simulators.

Bear in mind that some security checks like WebRTC, live camera, and other https checks will not work since you don't have a SSL certificate for your local address. Some of them can be deactivated in the advanced settings of your browser.

Upvotes: 0

developer_beginning
developer_beginning

Reputation: 393

only by adding host: to webpack.config.js it worked for me 

devServer: {
  host:'000.000.00.00',
  port: 8888
},

then i started react code by giving webpack-dev-server --host 000.000.00.00 --port 888

Upvotes: 3

Dmitriy Kovalenko
Dmitriy Kovalenko

Reputation: 3636

You need to change hosting of the react application from localhost to your local ip address. (For example 10.10.54.124), you can get it using ipconfig command in Windows command prompt.

Next you need to open your port (ex. 214) via firewall, to access from the 3rd-party machines. And after that, all of the people, how are in your local, or VPN network can access your application by link 10.10.54.124:214.

P.S. That would work only for people how are in your local network

Upvotes: 0

Related Questions