I am following some tutorials to build an isomorphic app with express and react. I am confusing with the webpack-dev-server.
The webpack tutorial says about the webpack-dev-server:
This binds a small express server on localhost:8080 which serves your static assets as well as the bundle (compiled automatically).
It automatically updates the browser page when a bundle is recompiled (socket.io). Open http://localhost:8080/webpack-dev-server/bundle in your browser.
Since I have express server, do I really need webpack-dev-server? Or what's the advantages and disadvantages of using it? And if I want to use react-hot-loader, is the webpack-dev-server necessary?
Best Answer
Yes and no. You can use a hybrid approach, which essentially setup the webpack-dev-server as a proxy. You have your express server that serves everything except for assets. If it's an asset, the request gets forwarded/proxied to the webpack-dev-server. See the answer here for more details: How to allow for webpack-dev-server to allow entry points from react-router
Alternatively, you can use webpack-dev-middleware and webpack-hot-middleware instead if you don't want to deal with all the messy proxying logic and having 2 servers running. See the example here: https://github.com/glenjamin/webpack-hot-middleware/blob/master/example/server.js
Live-reloading and hot module replacement. Very useful feature for development in my opinion
Nope, it works on top of Webpack's hot module replacement interface. You can create your own 'hot server' if you want. The webpack-dev-server client just listen to socket.io for hot updates and calls postMessage (https://github.com/webpack/webpack-dev-server/blob/8e8f540b2f7b35f7b6c3ce616a7fd2215aaa6eea/client/index.js#L64-L67) which is then picked up by the server https://github.com/webpack/webpack/blob/bac9b48bfb0f7dd9732f2faafb43ebb22ee2a2a7/hot/only-dev-server.js#L59-L67.
Or what I recommend is that you can just use the webpack-dev-middleware and webpack-hot-middleware that I mentioned above instead. This way, you don't have to worrying about proxy logic and you can easily integrate hot reloading into your existing express server without the need for webpack-dev-server