- Folder Structure
- Yarn Commands
- Local Environment Docker Compose
- Local Environment Monitoring
- Dockerfile
.gitignore
docker-compose.yml
Dockerfile
Dockerfile.dev
package.json
README.md
yarn.lock
nginx/
nginx.conf
public/
favicon.ico
index.html
manifest.json
src/
App.css
App.js
App.test.js
index.css
index.js
logo.svg
registerServiceWorker.js
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
Launches the test runner in the interactive watch mode.
See the section about running tests for more information.
Builds the app for production to the build
folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.
Your app is ready to be deployed!
Jest has an integrated coverage reporter that works well with ES6 and requires no configuration. Run yarn test -- --coverage
Build Docker image in docker-compose file using build command
docker-compose build
Up the docker containers
docker-compose up
Up the docker containers in daemon mode
docker-compose up -d
Stop the docker-compose containers
docker-compose stop
Analyzes resource usage and performance characteristics of running containers. cAdvisor (Container Advisor) provides container users an understanding of the resource usage and performance characteristics of their running containers. It is a running daemon that collects, aggregates, processes, and exports information about running containers. Specifically, for each container it keeps resource isolation parameters, historical resource usage, and histograms of complete historical resource usage. This data is exported by container and machine-wide. https://github.com/google/cadvisor
Check out http://localhost:8080 for the CAdvisor Dashboard
Portainer is a lightweight management UI which allows you to easily manage your different Docker environments (Docker hosts or Swarm clusters). Portainer is meant to be as simple to deploy as it is to use. It consists of a single container that can run on any Docker engine (can be deployed as Linux container or a Windows native container, supports other platforms too). Portainer allows you to manage all your Docker resources (containers, images, volumes, networks and more) !
Check out http://localhost:9000 for the Portainer Dashboard
Multi Stage Dockerfile is used to build the react application. Dockerfile uses the node image to build the react application and publishes the build files to the nginx image. Using nginx alpine image the user will be able to naviagate the react application
FROM node:13.1.0-buster-slim as build
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
COPY package.json /app/package.json
RUN yarn install --silent
COPY . /app
RUN npm run build
FROM nginx:1.16.1-alpine
COPY --from=build /app/build /usr/share/nginx/html
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx/nginx.conf /etc/nginx/conf.d
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
nginx.conf
server {
listen 80;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}