docker react does not work in localhost

Question

I am trying to run my react app with docker, when I run the container, everything seems fine but I can't access it on localhost (or 127.0.0.1). Here is my configuration:

Dockerfile:

FROM node:carbon

RUN mkdir -p /usr/src/app

WORKDIR /usr/src/app

COPY package.json /usr/src/app

RUN npm install

COPY . /usr/src/app

EXPOSE 8090

CMD ["npm", "run", "start-test"]

package.json

"start-test": "./node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.dev.config --inline --hot --history-api-fallback --port 8090 --public localhost:8090 --host 0.0.0.0"

webpack.common.js

const path = require('path');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');

module.exports = {
  entry: {
    app: [
      // 'react-hot-loader/patch',
      'babel-polyfill',
      path.join(__dirname, 'src', 'index.js'),
    ],
  },
  output: {
    filename: '[name].bundle.js',
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/',
  },
  module: {...},
  plugins: [
    new CleanWebpackPlugin(['dist']),
    new HtmlWebpackPlugin({
      template: './src/index.html',
      title: 'Production',
      // hash: true,
      filename: './index.html',
    }),
    new webpack.NamedModulesPlugin(),
  ],
  resolve: {
    extensions: [' ', '.js', '.jsx', '.json'],
    modules: [
      path.join(__dirname, 'src'),
      path.join(__dirname, 'node_modules'),
    ],
  },
};

webpack.config

module.exports = merge(common, {
  devtool: 'inline-source-map',
  devServer: {
    contentBase: './dist',
    disableHostCheck: true,
  },
  module: {
    rules: [
      {
        test: /\.scss$/,
        use: ['style-loader', 'css-loader', 'sass-loader'],
      },
    ],
  },
  plugins: [
    new ExtractTextPlugin({
      filename: 'app.css',
      disable: true,
    }),
  ],
});

Everything is fine when I build by using

docker build --no-cache . -t seyaa/client

Then I start the container using

docker run  seyaa/client

Here is the end of the console

> redux-minimal@1.0.0 start-test /usr/src/app
> ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.dev.config --inline --hot --history-api-fallback --port 8090 --public localhost:8090 --host 0.0.0.0

clean-webpack-plugin: /usr/src/app/dist has been removed.
Project is running at http://localhost:8090/
webpack output is served from /
Content not from webpack is served from ./dist
404s will fallback to /index.html
Hash: 64fdd9746e89b58394d3
Version: webpack 3.11.0
Time: 13617ms

The terminal looks fine but I can not access to http://localhost:8090 or http://127.0.0.1:8090 or http://0.0.0.0:8090

Any help would be appreciated.

Thanks

Edit: I am running on a mac

Check with ipconfig if docker created a bridge. Find the pid of the docker with "ps -ef | grep docker", and check on what IP/Port docker is listening with "lsof -Pn -p PID | grep LISTEN". — Gerard H. Pille, Feb 25 '18 at 18:59
when dealing with ports always mention what OS is your host running ... if linux issue this to see if port 8090 is active `sudo netstat -peanut` .... other OS have similar tools — Scott Stensland, Feb 25 '18 at 19:02
Thank you for your answer, here is the result of the comand `ps -ef | grep docker 501 29882 628 0 8:06pm ttys000 0:00.03 docker run seyaa/client 501 29963 23000 0 8:08pm ttys004 0:00.00 grep --color=auto -- exclude-dir=.bzr --exclude-dir=CVS --exclude-dir=.git --exclude-dir=.hg --exclude-dir=.svn docker` then when I do lsof -Pn -p 29963 | grep LISTEN or with 23000, nothing happens. Any idea ? Thank you — Joelito, Feb 25 '18 at 19:09
It doesnt seem to be listening on 8090 for some reason .. :( — Joelito, Feb 25 '18 at 19:19
I must say, I don't see you starting seyaa/client. So we see the "docker run" without a command to run, but the docker itself isn't running. — Gerard H. Pille, Feb 25 '18 at 19:51

score 2 · Answer 1 · answered Feb 25 '18 at 19:58

2

If that's the output from your container, then you're listening on localhost in the container, which is not the same as on the host. Make the server listen on 0.0.0.0 instead of localhost (check this post) then try hitting localhost on your host machine. You're also not exposing any ports through to your host by the looks of it, so you'll also need to change your docker run to be something like docker run -p 8090:8090 seyaa/client.

answered Feb 25 '18 at 19:58

johnharris85

17,264
5
48
52

when you run `docker ps` you should see `0.0.0.0:8090->8090/tcp` in the PORTS column. – Håken Lid Feb 25 '18 at 20:06

score 0 · Answer 2 · answered Feb 25 '18 at 19:52

0

A container must be started before you can run a command in it.

docker start seyaa/client

Then you may run eg. a shell

docker run seyaa/client /bin/sh

answered Feb 25 '18 at 19:52

Gerard H. Pille

2,528
1
13
17

docker react does not work in localhost

2 Answers2

Linked