Docker + ReactJS tutorial: Development to Production workflow + multi-stage builds + docker compose

In this video I will walk you through how to setup a react app in a docker container. I'll go over some of the challenges that you may face, and we'll take a look at how we can setup both a development and a production environment to host react apps in docker containers.

In the video i forgot to point out that when you're running react in docker containers you will may to add the "-it" flag during the docker run command. This seems to vary based on what version of CRA you are running. As an example:

docker run -it d --name react-app -p 3000:3000 react-image

▬▬▬▬▬▬ T I M E S T A M P S ⏰ ▬▬▬▬▬▬
00:00 Intro
00:12 Initialize React App
00:46 Building an Image with Dockerfile
12:56 Creating first container
14:20 Docker networking - forwarding ports
19:25 dockerignore files
24:07 Bind mounts to sync src code
35:22 Read only bind mounts
37:44 Environment variables
43:02 Docker Compose
58:15 Multi-stage Build for Production with NGINX
1:11:42 Development vs production workflow
1:22:57 docker build with --target flag

#docker

If you like this video please subscribe to this channel. Don't let me go hungry!

▬▬▬▬▬▬ Support this garbage Channel 🍒 ▬▬▬▬▬▬

▬▬▬▬▬▬ Stalk me on Social Media 😲 ▬▬▬▬▬▬

[piyushmahapatra]

Why on earth is this Channel so under rated!
I wish you all the Success bro!

[whatnowZA]

This tutorial is hands down the best I've ever come across. everything is well detailed and straight to the point.

Note: to anyone following up on a Windows machine, I had a problem using -e CHOKIDAR_USEPOLLING=true, it was updating the code inside the container but the changes were not displaying on the browser, use -e WATCHPACK_POLLING=true instead.

Thank you Sanjeev

[nebolos]

This is one of the most comprehensible and straightforward Docker tutorial on Youtube. Great channel and great content always.

[Lavimoe]

For recent React, you need to set "WATCHPACK_POLLING=true" instead to get auto update working instead of "CHOKIDAR_USEPOLLING=true"

[bloom]

wow 5 minutes in, I have to stop and say this is just absolutely mind blowing how well you are teaching please never stop with content like this. what a gem of a channel

[jamesmcgee]

You're a great teacher. I'm pretty new to Docker and have watched other tutorials on YT and even read books on Docker over at Safari Online, but you're tutorial is the first one where you explain docker via a common, real-world example ("the rubber meets the road"). Good stuff. You've got a subscriber.

[thydevdom]

2 days of headaches trying to get "Live Reload" to work and I finally found you who got it to work. So many people made it so complicated. I knew there had to be an easy way to correctly Mount/Sync files. Thank you Sanjeev. You've definitely earned a sub from me!

[_sjoe]

I really appreciate the amount of detail you go into. So many online tutorials are borderline useless because they just go through the motions without truly explaining anything. Thanks, keep it up!

[anirudha]

Best crash course on react + docker so far

[lokeshkumarjain]

The most comprehensible and straightforward Docker tutorial on Youtube

[brycenmedart]

Just wanted to pop in and say this is an amazing tutorial on setting up docker. I am a full stack dev but have not had much experience with Docker and wanted to learn what it is all about. With your video I was able to incorporate docker around my current project and deploy without any issues! Thanks again!

[alecmather]

This is by FAR the best docker tutorial I've seen so far, super underrated video, thank you so much bro <3

[jossanymoura]

I am still on minute 25 but I decided to pause it to congratulate you for the amazing content and teaching. Perfect video for starters. I hope that everybody would teach hands on like you! Congrats for the excelent content!

[ManishKarkera]

This is probably the first tech video ever where I have been voluntarily compelled to click the like button even without having completed the whole video. I have ended up subscribing your channel just so that it might help you. Cant praise you enough how you have covered all the essential bits about docker and paced the video to near perfection. Thanks Sanjeev.

[SuboptimalEng]

I really like how you explained the package.json optimization, nice work!

[wdeva]

you mostly cover deployment parts. There are few resources on that your videos help me a lot. Thank you sir

[shubhamchandramishra]

The best, worth watching Docker tutorial out there. Thanks

[upawastaken]

This is the best tutorial I have ever come across. Not just for Docker but in general. The process from start to end is very clearly presented and thus makes it easy to follow. The amount of effort that's gone in making this video is insane. Thank you so much Sanjeev!

[ramilocosta]

Sanjeev, thanks for doing it. It's a massive content. Very assertive, easy to understand. Nailed. Wish you all the success

[Laflamablanca]

For anyone wondering the difference between docker-compose and docker compose, basically the hyphened version is v1 and the other is v2. V1 is no longer being developed so always use v2.

Side note, v1 was written in python and v2 is written in Golang.