Docker for Developers, Dockerize React, Node, Mongo and more

Docker for Developers, Dockerize React, Node, Mongo and more

English | MP4 | AVC 1920×1080 | AAC 44KHz 2ch | 7 Hours | 2.13 GB

Master the art of Dockerize images and never install unnecessary software again. Use docker w/ React, Node, Mongo & more

Build apps are not as simples as it uses to be. Today, your apps have to run in multiple environments (Mac, Windows, Linux), using a lot of different technologies (Redis, Mongo, Node, and so many others.

That is not all. It is the norm to expend days just to set up an environment right, to install all the dependencies and set all the environment variables, configure the connection, etc. And more often than not, after days of hard work when it is time to test the app it does not work, and when we ask for help the creator of the document he will say probably say “But it works on my machine!”

This course put an end on this. I will teach you how to use Docker so you can efficiently build apps that run smoothly and consistently across any machine, that you will be able to run in any device with Docker from zero to no time down.

We will build together many images and containers, step by step, from scratch and by the end, we will have a fully functional application using not 1 or 2 containers but 4. And we will be able to start it all (a reverse proxy, a React application, a Node application and a MongoDB) using just one command.

We will create a NIGIX container as a reverse proxy that will forward a request to React application running in another Docker container and/our Node application running in yet another Docker container depending on the request URL. Also, your Node application will be able to request and save data on our fourth container running MongoDB.

We will focus on the development environment first, and by the end, we will learn how to step up our game for production, creating leaner and safer images.

I’ll be with you every step the way. We will code together line by line, and I’ll even show how to set up your environment like mine. Hence, it is easier for you to follow and find any problem you may have, still, if you don’t, that is fine too, I’m always available to answer any questions you have along the journey.

We will build a more advance app by each class, adding new container as need and learn new ways to make our job more comfortable as we go.

We will start learning about the Docker CLI and pushing images from Docker Hub and creating containers with those images.

Later we will add ports and volumes to the images we used on the step before.

Then we will learn how to create our images using Dockerfiles.

This is when things start to get more interesting, we will create networks between multiple containers, so for example, our Node container will be able to communicate with our MongoDB container.

However, soon we will find out that manage a lot of containers using the CLI is not an easy job, that is when we will learn about Docker Compose.

Docker Compose is fantastic, but why to stop there, Kubernetes of K8’s is the next natural step to learn, it will make scaling and deploying a breeze, so it is a MUST for this course too.

After you finish this course, you can be sure that you will increase your productivity, creating lightweight applications that run the same no matter the environment with setups that takes no time.

So no more “Works at my machine” or 14 pages documents to set up environments that never works, let Dockerize and be happy and productive.

What you’ll learn

  • How to Dockerize apps
  • How to use Docker Images and Containers
  • How to mange multiple containers using Docker-Compose
  • How to deploy a production grade application using Kubernetes (K8’s)
  • Optimize your Development and Production setup for Docker
  • Resolve compatibility problems among different system and stages
  • Learn how to Dockerize React, Node, Mongo, NIGNX apps and any other
Table of Contents

Course introduction
1 Why docker (if you still need some convincing)

Docker Intro
2 Quick Run Through with a Docker Sample from Docker
3 Docker settings lets get this right
4 Running our first Docker Container using the Docker UI
5 Understand the image we pull from Docker Hub

Using the Docker Client Commands (CLI)
6 Testing the Docker Clients Commands we already master

Creating Volumes in Docker to use our code or keeping our data safe
7 Pulling a MongoDB image from Docker Hub
8 Persisting MongoDb data in a volume locally and keeping it safe
9 Mapping our Node code to the container and running it from there

Other important things to know
10 Mapping ports on the container, do they always have to be the same
11 Working Directory, because even our files need a place to call home

Making it easier with Dockerfiles
12 Creating our first Dockerfile

Staying connected on a Private Network
13 Connecting to MongoDB in a container from our local Node app
14 dockerignore, you can’t ignore it
15 Legacy Link connecting our Dockerized Node Application to our MongoDB Container
16 Network Bridge connecting our Dockerized Node app to MongoDB
17 Fixing legacy erros on the MongoDB driver

Docker Compose, managing multiples containers like a pro
18 Creating our docker compose file so we don’t need more the command line
19 Building and starting our containers using docker compose
20 Docker Compose CLI up, down, start, stop, logs and so much more

Docker compose, making it even better
21 Creating environment variables and reading it in Node
22 Removing our network as Docker will set it up for us

Final Project – Scaffolding our solution
23 Scaffolding the application
24 Commiting our application in GitHub
25 Changing from NPM to Yarn and installing express

Creating our Dockerized NodeJs app using express
26 Creating our express server

Final project lets put everything together and learn few more things
27 Creating our first route in express
28 Connecting our React app to our Node app
29 Fixing up CORS to accept requests from our React app

Final Project – Creating our Dockerfiles
30 Creating our Dockerfile for our React application
31 Creating a Dockerfile for our Node app

Final Project – Creating our Docker Compose file to handle multiple containers
32 Creating a Docker-Compose file to deal with running multiple containers
33 Changing our Back and Front end to work inside docker
34 Starting our Docker-Compose to manage our Node and our React Containers
35 Changing our Backend use docker environment variable
36 Changing our Frontend to use docker environment variable

Final Project – Perks nice to have that will make our life so much easier
37 Hot reload with a Dockerized React application
38 Nodemon on a dockerized Node Express Server

Final Project – Creating and Dockerizing our MongoDb
39 Creating a dockerized mongo DB to our solution
40 Connecting to our dockerized mongodb using Compass (external network)

Final Project – Connecting from our Dockerized Node app to Dockerized MongoDb
41 Connecting to our MongoDb using Mongoose from our Express server
42 HealthCheck end point for our mongo connection

Final Project – Developing our Node app directly inside a container
43 Moving our endpoints to Routers
44 Create a main file to import all the routes
45 Creating a Controller
46 Creating our Notes router
47 Creating a notes Schema in Mongoose
48 Adding our notes controller
49 Saving data into MongoDb using the Post endpoint
50 Adding a findAll get endpoint to retrieve all notes
51 Adding the findOne endpoint
52 Add a Delete end point
53 Creating a update end point
54 Fixing findByIdAndUpdate and findByIdAndUpdate setting useFindAndModify

Final Project – Creating our NGINX container
55 Creating our NGINX container
56 Creating our NGINX conf file
57 Setting Node in NGINX
58 Change react to use NGINX instead go direct to Node
59 Removing direct access to the Node, React and MongoDb Containers
60 Making a container depend on the other using depends on
61 Cleaning up the React project
62 Fixing hot reload in React while using NGINX

Creating the React Part of the Project
63 Installing SASS for React
64 Installing Materialize CSS and using its SASS files
65 Creating a Navbar
66 Export our Navbar to a new React Component
67 Creating our Note card
68 Creating a notes and a note component
69 Passing props to our component
70 Making our first request to our Node in the backend
71 Passing a function on the props to delete a note
72 Fixing up Materialize CSS effects
73 Making a call from our backend to delete a note in mongo
74 Adding a floating action button the application
75 Adding a modal to our React App
76 Create a text input with Character count
77 Create a textarea with character count
78 Adding State to our form
79 Refactoring our Inputs to its own component
80 Creating a reusable modal
81 Creating a modal footer to reuse with our modal
82 Creating a modal like a lego
83 Making our modal easier to understand
84 useContext to the rescue
85 Using the same StateContext from another component

What happens next
86 Wow, are you already here