Dockerizing a react application

Creating react application

npx create-react-app my-app
cd my-app
npm install

Creating Dockerfile

What to add in a Dockerfile

Step 1: Adding a base image

FROM node:alpine

Step 2: Adding a working directory

WORKDIR '/usr/app'

Step 3: Copying application

COPY ./ ./

Step 4: Running application-specific commands

RUN npm install

Step 5: Adding startup command

CMD ["npm","start"]

Building Dockerfile

docker build .

Running docker image

docker run -it -p 3000:3000 {image-id}

Temporary containers

Refactoring docker file

After making a change in the application

Dockerizing a react project for production.

Nginx

Building production docker file

docker build .

Running production build

docker run -it -p 8080:80 {image-id}

--

--

--

Full stack developer

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

The need to bind “this” in React Event Handlers

Whats new in RxJS v6.5

Improve your interactive maps with Vue.js and Leaflet

Create a REST API with Foal

StoryServer Public Alpha (or Early Beta) — v0.90.150 released 2019 March 2

A Simple Approach to Managing API Calls

https://youtube.com/channel/UCte6EKDb-3vTSXJXw0L9BSg

How we used state machines to improve state management

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Rohan Aggarwal

Rohan Aggarwal

Full stack developer

More from Medium

How to secure your GraphQL API (Part 2, the Typetta way)

Understanding Nodejs(V8) and Spring Webflux(Netty) — based on Event Loop design

Fixing a MongoDB sorting error.

Server-Sent Event (SSE) Chat Application using Spring Boot and React Js