Creating an Express.js Environment with Webpack, React, and Babel Configurations

2017-03-31

Troy Kearney

Creating an Express.js Environment with Webpack, React, and Babel Configurations

Tutorial on setting up a custom Express.js server with Webpack and Babel for React development.

Overview

  • Introduction
  • Prerequisites
  • Setting up Express
  • Adding Babel to the mix
  • Adding Webpack configurations
  • Bringing in React

Introduction

There are a two main different ways one could set up an environment for a React project; using create-react-app (which takes care of just about everything for you), or creating your own Express.js file server with your own Webpack and Babel configurations.

The other minor issue I have with create-react-app and similar tools is that there is a lot of “black magic” going on, and I would like to know at least the basics of what’s going on under the hood.

Today I’m going to walk through creating a very basic file server using Express.js with some Webpack and Babel configurations and implement a very basic React application to get you started.

The code for this article can be found here.