├── api
    ├── .gitignore
    ├── .dockerignore
    ├── README.md
    ├── Dockerfile
    ├── main.go
    └── main_test.go
├── front
    ├── .dockerignore
    ├── src
    │   ├── index.css
    │   ├── index.js
    │   ├── App.test.js
    │   ├── App.css
    │   ├── assets
    │   │   └── images
    │   │   │   ├── nginx-logo.svg
    │   │   │   ├── react-logo.svg
    │   │   │   ├── docker-logo.svg
    │   │   │   ├── kubernetes-logo.svg
    │   │   │   └── gopher.svg
    │   ├── App.js
    │   └── registerServiceWorker.js
    ├── public
    │   ├── favicon.ico
    │   ├── manifest.json
    │   └── index.html
    ├── .editorconfig
    ├── Dockerfile
    ├── .gitignore
    ├── package.json
    └── README.md
├── logo.png
├── .makefile-utils.sh
├── Dockerfile.prod
├── docker-compose.prod.yml
├── docker-compose.yml
├── docker-compose.override.yml
├── deployments
    ├── front.yml
    └── api.yml
├── .circleci
    └── config.yml
├── nginx
    └── site.conf
├── bin
    └── production.sh
├── Makefile
└── README.md


/api/.gitignore:
--------------------------------------------------------------------------------
1 | /tmp


--------------------------------------------------------------------------------
/api/.dockerignore:
--------------------------------------------------------------------------------
1 | tmp


--------------------------------------------------------------------------------
/front/.dockerignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | .git


--------------------------------------------------------------------------------
/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/topheman/docker-experiments/HEAD/logo.png


--------------------------------------------------------------------------------
/.makefile-utils.sh:
--------------------------------------------------------------------------------
1 | #!/bin/bash
2 | 
3 | function image_exists() {
4 |     docker images -q $1
5 | }


--------------------------------------------------------------------------------
/front/src/index.css:
--------------------------------------------------------------------------------
1 | body {
2 |   margin: 0;
3 |   padding: 0;
4 |   font-family: sans-serif;
5 | }
6 | 


--------------------------------------------------------------------------------
/front/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/topheman/docker-experiments/HEAD/front/public/favicon.ico


--------------------------------------------------------------------------------
/front/.editorconfig:
--------------------------------------------------------------------------------
1 | # http://editorconfig.org
2 | root = true
3 | 
4 | [*]
5 | # to match prettier defaults
6 | indent_style = space
7 | indent_size = 2


--------------------------------------------------------------------------------
/Dockerfile.prod:
--------------------------------------------------------------------------------
1 | FROM nginx:alpine
2 | 
3 | COPY ./front/build /usr/share/nginx/html
4 | 
5 | COPY ./nginx/site.conf /etc/nginx/conf.d/default.conf
6 | 
7 | EXPOSE 80
8 | 
9 | # CMD ["nginx"]


--------------------------------------------------------------------------------
/front/src/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom';
3 | import './index.css';
4 | import App from './App';
5 | import registerServiceWorker from './registerServiceWorker';
6 | 
7 | ReactDOM.render(<App />, document.getElementById('root'));
8 | registerServiceWorker();
9 | 


--------------------------------------------------------------------------------
/front/src/App.test.js:
--------------------------------------------------------------------------------
 1 | import React from 'react';
 2 | import ReactDOM from 'react-dom';
 3 | import App from './App';
 4 | 
 5 | it('renders without crashing', () => {
 6 |   const div = document.createElement('div');
 7 |   ReactDOM.render(<App />, div);
 8 |   ReactDOM.unmountComponentAtNode(div);
 9 | });
10 | 


--------------------------------------------------------------------------------
/api/README.md:
--------------------------------------------------------------------------------
 1 | # api
 2 | 
 3 | ## Development
 4 | 
 5 | Once you `docker-compose up -d`, the whole stack spins up and your api server will run inside a container which will expose the port 5000.
 6 | 
 7 | ## Test
 8 | 
 9 | To run the unit tests, run the following command:
10 | 
11 | ```shell
12 | docker-compose run --rm api go test -run ''
13 | ```


--------------------------------------------------------------------------------
/front/Dockerfile:
--------------------------------------------------------------------------------
 1 | FROM node:10-alpine
 2 | 
 3 | ARG NODE_ENV=development
 4 | ENV NODE_ENV=$NODE_ENV
 5 | 
 6 | RUN cd /usr
 7 | RUN mkdir -p front
 8 | 
 9 | # Set a working directory
10 | WORKDIR /usr/front
11 | 
12 | COPY ./package.json .
13 | COPY ./package-lock.json .
14 | 
15 | RUN npm install
16 | 
17 | CMD ["npm", "start"]
18 | 
19 | EXPOSE 3000


--------------------------------------------------------------------------------
/front/.gitignore:
--------------------------------------------------------------------------------
 1 | # See https://help.github.com/ignore-files/ for more about ignoring files.
 2 | 
 3 | # dependencies
 4 | /node_modules
 5 | 
 6 | # testing
 7 | /coverage
 8 | 
 9 | # production
10 | /build
11 | 
12 | # misc
13 | .DS_Store
14 | .env.local
15 | .env.development.local
16 | .env.test.local
17 | .env.production.local
18 | 
19 | npm-debug.log*
20 | yarn-debug.log*
21 | yarn-error.log*
22 | 


--------------------------------------------------------------------------------
/front/public/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "short_name": "React App",
 3 |   "name": "Create React App Sample",
 4 |   "icons": [
 5 |     {
 6 |       "src": "favicon.ico",
 7 |       "sizes": "64x64 32x32 24x24 16x16",
 8 |       "type": "image/x-icon"
 9 |     }
10 |   ],
11 |   "start_url": "./index.html",
12 |   "display": "standalone",
13 |   "theme_color": "#000000",
14 |   "background_color": "#ffffff"
15 | }
16 | 


--------------------------------------------------------------------------------
/docker-compose.prod.yml:
--------------------------------------------------------------------------------
 1 | version: "3.4"
 2 | 
 3 | services:
 4 |   nginx:
 5 |     image: "topheman/docker-experiments_nginx:1.0.1"
 6 |     build:
 7 |       context: .
 8 |       dockerfile: ./Dockerfile.prod
 9 |     ports:
10 |       - "80:80"
11 |     # Already copied in Dockerfile - we map them to simplify debugging
12 |     volumes:
13 |       - ./front/build:/usr/share/nginx/html
14 |       - ./nginx/site.conf:/etc/nginx/conf.d/default.conf
15 |     depends_on:
16 |       - api


--------------------------------------------------------------------------------
/docker-compose.yml:
--------------------------------------------------------------------------------
 1 | version: "3.4"
 2 | 
 3 | services:
 4 |   # no ports exposed by default, (api is proxied through docker networks)
 5 |   # in development, it's exposed on port 5000, see docker-composed.override.yml
 6 |   api:
 7 |     image: topheman/docker-experiments_api_production:1.0.1
 8 |     build:
 9 |       target: production
10 |       context: ./api
11 |     # the container will restart the api if it exits with code > 0 (won't work in dev cause of fresh)
12 |     restart: on-failure


--------------------------------------------------------------------------------
/docker-compose.override.yml:
--------------------------------------------------------------------------------
 1 | version: "3.4"
 2 | 
 3 | services:
 4 |   api:
 5 |     image: topheman/docker-experiments_api_development:1.0.1
 6 |     command: sh -c "echo \"development\" && go get github.com/pilu/fresh && fresh"
 7 |     build:
 8 |       target: builder
 9 |     volumes:
10 |       - ./api:/go/src/github.com/topheman/docker-experiments/api
11 |     ports:
12 |       # only expose in development (in production, the api server will be proxied via nginx)
13 |       - "5000:5000"
14 |   front:
15 |     image: topheman/docker-experiments_front_development:1.0.1
16 |     build:
17 |       context: ./front
18 |     ports:
19 |       - 3000:3000
20 |     volumes:
21 |       - ./front:/usr/front
22 |       - front-deps:/usr/front/node_modules
23 | 
24 | volumes:
25 |   front-deps:


--------------------------------------------------------------------------------
/deployments/front.yml:
--------------------------------------------------------------------------------
 1 | apiVersion: extensions/v1beta1
 2 | kind: Deployment
 3 | metadata:
 4 |   name: docker-experiments-front-deployment
 5 | spec:
 6 |   template:
 7 |     metadata:
 8 |       labels:
 9 |         app: docker-experiments
10 |         tier: front
11 |     spec:
12 |       containers:
13 |         - image: topheman/docker-experiments_nginx:1.0.1
14 |           name: nginx
15 |           lifecycle:
16 |             preStop:
17 |               exec:
18 |                 command: ["/usr/sbin/nginx","-s","quit"]
19 | ---
20 | apiVersion: v1
21 | kind: Service
22 | metadata:
23 |   name: docker-experiments-front-service
24 | spec:
25 |   selector:
26 |     app: docker-experiments
27 |     tier: front
28 |   ports:
29 |     - protocol: TCP
30 |       port: 80
31 |       targetPort: 80
32 |   type: LoadBalancer


--------------------------------------------------------------------------------
/front/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "front",
 3 |   "version": "1.0.1",
 4 |   "private": true,
 5 |   "dependencies": {
 6 |     "axios": "^0.18.0",
 7 |     "react": "^16.4.1",
 8 |     "react-dom": "^16.4.1",
 9 |     "react-scripts": "^1.1.4"
10 |   },
11 |   "scripts": {
12 |     "docker-start": "docker-compose up -d",
13 |     "docker-build": "docker-compose run --rm front npm run build",
14 |     "docker-test": "npm run -s docker-test:unit",
15 |     "docker-test:unit": "docker-compose run --rm -e CI=true front npm run -s test",
16 |     "docker-test:unit:watch": "docker-compose run --rm front npm run -s test",
17 |     "start": "react-scripts start",
18 |     "build": "react-scripts build",
19 |     "test": "react-scripts test --env=jsdom",
20 |     "eject": "react-scripts eject"
21 |   },
22 |   "proxy": {
23 |     "/api": {
24 |       "target": "http://api:5000",
25 |       "changeOrigin": true,
26 |       "pathRewrite": {
27 |         "^/api": ""
28 |       }
29 |     }
30 |   }
31 | }
32 | 


--------------------------------------------------------------------------------
/.circleci/config.yml:
--------------------------------------------------------------------------------
 1 | version: 2
 2 | jobs:
 3 |   build:
 4 |     machine:
 5 |       # We need the latest version of docker-engine because we use docker-compose file format v3.4
 6 |       # For the compatibility between docker-engine version and docker-compose file format, see https://docs.docker.com/compose/compose-file/#compose-and-docker-compatibility-matrix
 7 |       # For the list of available circleci images, see https://circleci.com/docs/2.0/configuration-reference/#machine
 8 |       image: circleci/classic:201808-01
 9 |     steps:
10 |       - checkout
11 |       - run:
12 |           name: "Infos"
13 |           command: |
14 |             docker-compose --version
15 |             docker version
16 |       - run:
17 |           name: "Build development images"
18 |           command: docker-compose build
19 |       - run:
20 |           name: "Test front"
21 |           command: docker-compose run --rm -e CI=true front npm run -s test
22 |       - run:
23 |           name: "Test api"
24 |           command: docker-compose run --rm api go test -run ''


--------------------------------------------------------------------------------
/front/src/App.css:
--------------------------------------------------------------------------------
 1 | .App {
 2 |   text-align: center;
 3 | }
 4 | 
 5 | .App-logo {
 6 |   animation: App-logo-spin infinite 20s linear;
 7 |   height: 80px;
 8 | }
 9 | 
10 | .App-logo:hover {
11 |   animation: App-logo-spin infinite 1.5s ease-in-out;
12 | }
13 | 
14 | .App-header {
15 |   background-color: #222;
16 |   height: 150px;
17 |   padding: 20px;
18 |   color: white;
19 | }
20 | 
21 | .App-github-link a {
22 |   color: white;
23 | }
24 | 
25 | @media screen and (max-width: 500px) {
26 |   .App-logo {
27 |     height: 43px;
28 |   }
29 | }
30 | 
31 | .App-title {
32 |   font-size: 1.5em;
33 | }
34 | 
35 | .App-intro {
36 |   font-size: large;
37 | }
38 | 
39 | .App-button {
40 |   cursor: pointer;
41 |   color: white;
42 |   background: black;
43 |   border: 1px solid black;
44 |   padding: 5px;
45 |   border-radius: 5px;
46 |   font-size: 1rem;
47 | }
48 | 
49 | .App-button:hover {
50 |   color: black;
51 |   background: white;
52 | }
53 | 
54 | @keyframes App-logo-spin {
55 |   from { transform: rotate(0deg); }
56 |   to { transform: rotate(360deg); }
57 | }
58 | 


--------------------------------------------------------------------------------
/deployments/api.yml:
--------------------------------------------------------------------------------
 1 | apiVersion: extensions/v1beta1
 2 | kind: Deployment
 3 | metadata:
 4 |   name: docker-experiments-api-deployment
 5 | spec:
 6 |   replicas: 2
 7 |   template:
 8 |     metadata:
 9 |       labels:
10 |         app: docker-experiments
11 |         tier: api
12 |         track: stable
13 |     spec:
14 |       containers:
15 |         - name: docker-experiments-api-container
16 |           image: topheman/docker-experiments_api_production:1.0.1
17 |           ports:
18 |             - name: golang # Can be referred in services
19 |               containerPort: 5000 # Not hostPort (we only expose the container inside the pod)
20 | ---
21 | apiVersion: v1
22 | kind: Service
23 | metadata:
24 |   # named like the docker-compose service "api"
25 |   # so that nginx config stays same between docker-compose and kubernetes
26 |   name: api
27 | spec:
28 |   selector:
29 |     app: docker-experiments
30 |     tier: api
31 |   ports:
32 |     - protocol: TCP
33 |       port: 5000
34 |       targetPort: golang
35 |   # default type (only exposed to the pods - not to the outside, like LoadBalancer)
36 |   type: ClusterIP


--------------------------------------------------------------------------------
/nginx/site.conf:
--------------------------------------------------------------------------------
 1 | upstream api {
 2 |   # reference to kubernetes/docker-compose service
 3 |   server api:5000;
 4 | }
 5 | 
 6 | # simple nginx configuration file
 7 | server {
 8 |   listen 80;
 9 | 
10 |   root /usr/share/nginx/html;
11 | 
12 |   # Proxy api
13 |   location /api {
14 |     rewrite ^/api/(.*)$ /$1 break;
15 |     proxy_set_header Host $host;
16 |     proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
17 |     proxy_pass_header Set-Cookie;
18 |     add_header Cache-Control "no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0";
19 |     proxy_pass http://api/;
20 |   }
21 | 
22 |   # Serve front
23 |   location / {
24 |     gzip_static on;
25 |     expires max;
26 |     add_header Cache-Control public;
27 |     add_header ETag "";
28 |   }
29 | 
30 |   # service-worker should not be cached by browser - https://github.com/topheman/docker-experiments/blob/master/front/README.cra.md#offline-first-considerations
31 |   location /service-worker.js {
32 |     # kill cache
33 |     add_header Last-Modified $date_gmt;
34 |     add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
35 |     if_modified_since off;
36 |     expires off;
37 |     etag off;
38 |   }
39 | 
40 | }


--------------------------------------------------------------------------------
/front/src/assets/images/nginx-logo.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="utf-8"?>
 2 | <!-- Generator: Adobe Illustrator 20.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 3 | <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 4 | 	 viewBox="0 0 73 83" style="enable-background:new 0 0 73 83;" xml:space="preserve">
 5 | <style type="text/css">
 6 | 	.st0{fill:#00AB4E;}
 7 | 	.st1{fill:#00853E;}
 8 | 	.st2{fill:#004C2C;}
 9 | 	.st3{fill:#FFFFFF;}
10 | </style>
11 | <path class="st0" d="M36.5,0.5c-0.9,0-1.7,0.2-2.5,0.7L2.8,19.2c-1.5,0.9-2.5,2.5-2.5,4.3v36.1c0,0.9,0.2,1.7,0.7,2.5l35.5-20.5
12 | 	C36.5,41.5,36.5,14.9,36.5,0.5z"/>
13 | <path class="st1" d="M1,62c0.4,0.7,1,1.4,1.8,1.8L34,81.9c1.5,0.9,3.4,0.9,4.9,0l31.3-18.1c0.8-0.4,1.4-1.1,1.8-1.8L36.5,41.5
14 | 	C36.5,41.5,13.5,54.8,1,62z"/>
15 | <path class="st2" d="M72,62c0.4-0.7,0.7-1.6,0.7-2.5l0-36.1c0-1.8-0.9-3.4-2.5-4.3L39,1.1c-0.8-0.4-1.6-0.7-2.5-0.7l0,41
16 | 	C36.5,41.5,59.5,54.8,72,62z"/>
17 | <path class="st3" d="M44.7,57.1c1.4,1.7,3.6,2.5,5.6,2.5c2.7,0,4.7-1.8,4.7-4l0-28.2c0-2.2-1.8-4-4-4h-0.1c-2.3,0-4.1,1.8-4.1,4.1
18 | 	l0,20.1c0,0.1-0.1,0.1-0.2,0.1L28.3,25.9c-1.4-1.7-3.6-2.5-5.6-2.5c-2.7,0-4.7,1.8-4.7,4l0,28.2c0,2.2,1.8,4,4,4h0.1
19 | 	c2.3,0,4.1-1.8,4.1-4.1l0-20.1c0-0.1,0.1-0.1,0.2-0.1L44.7,57.1z"/>
20 | </svg>
21 | 


--------------------------------------------------------------------------------
/front/public/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 6 |     <meta name="theme-color" content="#000000">
 7 |     <!--
 8 |       manifest.json provides metadata used when your web app is added to the
 9 |       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
10 |     -->
11 |     <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
12 |     <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
13 |     <!--
14 |       Notice the use of %PUBLIC_URL% in the tags above.
15 |       It will be replaced with the URL of the `public` folder during the build.
16 |       Only files inside the `public` folder can be referenced from the HTML.
17 | 
18 |       Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
19 |       work correctly both with client-side routing and a non-root public URL.
20 |       Learn how to configure a non-root public URL by running `npm run build`.
21 |     -->
22 |     <title>React App</title>
23 |   </head>
24 |   <body>
25 |     <noscript>
26 |       You need to enable JavaScript to run this app.
27 |     </noscript>
28 |     <div id="root"></div>
29 |     <!--
30 |       This HTML file is a template.
31 |       If you open it directly in the browser, you will see an empty page.
32 | 
33 |       You can add webfonts, meta tags, or analytics to this file.
34 |       The build step will place the bundled scripts into the <body> tag.
35 | 
36 |       To begin the development, run `npm start` or `yarn start`.
37 |       To create a production bundle, use `npm run build` or `yarn build`.
38 |     -->
39 |   </body>
40 | </html>
41 | 


--------------------------------------------------------------------------------
/api/Dockerfile:
--------------------------------------------------------------------------------
 1 | FROM golang:1.10.3-alpine as builder
 2 | 
 3 | # Volumes and commands may be overriden in docker-compose*.yml files.
 4 | # To build the image in production mode without docker-compose, run:
 5 | # `docker build ./api -t topheman/docker-experiments_api_production`
 6 | # `docker run -d -p 5000:5000 topheman/docker-experiments_api_production`
 7 | ENV APP_ENV "development"
 8 | 
 9 | # alpine comes without git. We need it for go get
10 | RUN apk update && apk upgrade && apk add --no-cache git
11 | 
12 | COPY . /go/src/github.com/topheman/docker-experiments/api
13 | WORKDIR /go/src/github.com/topheman/docker-experiments/api
14 | 
15 | RUN go get -v ./
16 | RUN go build
17 | 
18 | # With the following target, we create a small image for production:
19 | # - no need for golang compiler / tools
20 | # - only copy the binary that was compiled at the previous step
21 | # We don't use this target in development
22 | # Infos: https://medium.com/@chemidy/create-the-smallest-and-secured-golang-docker-image-based-on-scratch-4752223b7324
23 | 
24 | FROM alpine as production
25 | 
26 | ENV APP_ENV "production"
27 | 
28 | COPY --from=builder /go/bin/api /usr/bin/api
29 | 
30 | CMD echo "production"; api
31 | 
32 | # The Dockerfile should still be usable without docker-compose, so, by default,
33 | # it's a production image, the CMD will run the binary that was compiled
34 | # If you create a development image, the `command` specified in the docker-compose.override.yml
35 | # will override and use pilu/fresh which manages building and restarting dev server when sources change
36 | # Infos: https://medium.com/@craigchilds94/hot-reloading-go-programs-with-docker-glide-fresh-d5f1acb63f72
37 | 
38 | # CMD echo "APP_ENV=$APP_ENV"; \
39 | # 	if [ "$APP_ENV" = "production" ]; \
40 | # 	then \
41 | # 	api; \
42 | # 	else \
43 | # 	go get github.com/pilu/fresh && \
44 | # 	fresh; \
45 | # 	fi
46 | 
47 | EXPOSE 5000


--------------------------------------------------------------------------------
/bin/production.sh:
--------------------------------------------------------------------------------
 1 | #!/usr/bin/env bash
 2 | USERNAME="topheman"
 3 | DOCKER_IMAGE_PREFIX="$USERNAME/docker-experiments_"
 4 | DOCKER_IMAGE_NAME_API_PRODUCTION=$DOCKER_IMAGE_PREFIX"api_production"
 5 | DOCKER_IMAGE_NAME_FRONT_DEVELOPMENT=$DOCKER_IMAGE_PREFIX"front_development"
 6 | 
 7 | isImageBuilt() {
 8 | 	local output=$(docker images $1 | grep $USERNAME)
 9 | 	if [[ -z "$output" ]]; then
10 | 		echo "[Check] $1: missing 😕"
11 | 		return 1
12 | 	else
13 | 		echo "[Check] $1: exists 👍"
14 | 		return 0
15 | 	fi
16 | }
17 | 
18 | checkAllImages() {
19 | 	local exitCode=0
20 | 	isImageBuilt $DOCKER_IMAGE_NAME_API_PRODUCTION
21 | 	exitCode=`expr $exitCode + $?`
22 | 	isImageBuilt $DOCKER_IMAGE_NAME_FRONT_DEVELOPMENT
23 | 	exitCode=`expr $exitCode + $?`
24 | 	return $exitCode
25 | }
26 | 
27 | build() {
28 | 	echo "[Build] Building JavaScript bundle inside front container"
29 | 	docker-compose run --rm front npm run build
30 | 	if [[ $? -gt 0 ]]; then
31 | 		echo "[Fail] Frontend bundling failed"
32 | 		return 1
33 | 	fi
34 | 	return 0
35 | }
36 | 
37 | help() {
38 | 	echo -e "
39 | ⚠️   Still in progress ...
40 | 
41 | \033[1mDescription\033[0m
42 | 	This script ensures that the docker images necessary for the production are available,
43 | 	then it will build the frontend bundle and inject it in the nginx production image
44 | 	and configure that image to reverse proxy /api to serve the backend production container.
45 | 
46 | \033[1mOptions\033[0m
47 | 	--help
48 | 		Displays help (default)
49 | 	--build
50 | 		Will build the production image / bundle frontend
51 | "
52 | }
53 | 
54 | if [[ $@ = *"--build"* ]]; then
55 | 	echo "[Check] Verifying all images"
56 | 	checkAllImages
57 | 	if [[ $? -gt 0 ]]; then
58 | 		echo "[Fail] Some image is missing - aborting 🚫"
59 | 		exit 1
60 | 	fi
61 | 	build
62 | 	if [[ $? -gt 0 ]]; then
63 | 		echo "[Fail] Build fail - aborting 🚫"
64 | 		exit 2
65 | 	fi
66 | else
67 | 	help
68 | 	exit
69 | fi


--------------------------------------------------------------------------------
/api/main.go:
--------------------------------------------------------------------------------
 1 | package main
 2 | 
 3 | import (
 4 | 	"encoding/json"
 5 | 	"fmt"
 6 | 	"log"
 7 | 	"net/http"
 8 | 	"os"
 9 | 	"runtime"
10 | 	"time"
11 | 
12 | 	"github.com/gorilla/mux"
13 | )
14 | 
15 | var startTime time.Time
16 | 
17 | func uptime() float64 {
18 | 	return time.Since(startTime).Seconds()
19 | }
20 | 
21 | type infos struct {
22 | 	Hostname string  `json:"hostname"`
23 | 	Version  string  `json:"version"`
24 | 	Cpus     int     `json:"cpus"`
25 | 	AppEnv   string  `json:"APP_ENV"`
26 | 	Uptime   float64 `json:"uptime"`
27 | }
28 | 
29 | func makeInfos() *infos {
30 | 	hostname, err := os.Hostname()
31 | 	if err != nil {
32 | 		hostname = "Unknown"
33 | 	}
34 | 	return &infos{hostname, runtime.Version(), runtime.NumCPU(), os.Getenv("APP_ENV"), uptime()}
35 | }
36 | 
37 | func rootRouteHTML(w http.ResponseWriter, _ *http.Request) {
38 | 	infos := makeInfos()
39 | 	w.Header().Set("Content-Type", "text/html; charset=utf-8")
40 | 	fmt.Fprintf(w, `<h1>Welcome</h1>
41 | 	<ul>
42 | 		<li>Hostname: %s</li>
43 | 		<li>Version: %s</li>
44 | 		<li>Number of CPUs: %d</li>
45 | 		<li>APP_ENV: %s</li>
46 | 	</ul>`, infos.Hostname, infos.Version, infos.Cpus, infos.AppEnv)
47 | }
48 | 
49 | func rootRouteJSON(w http.ResponseWriter, r *http.Request) {
50 | 	infos := makeInfos()
51 | 	w.Header().Set("Content-Type", "application/json; charset=utf-8")
52 | 	json.NewEncoder(w).Encode(infos)
53 | }
54 | 
55 | // only here to demonstrate the resilience of containers restarted on failure by docker-compose/kubernetes
56 | // DON'T DO THAT ON PRODUCTION
57 | func exitRoute(w http.ResponseWriter, r *http.Request) {
58 | 	os.Exit(1)
59 | }
60 | 
61 | // MakeRouter Public router factory - this is unit tested
62 | func MakeRouter() *mux.Router {
63 | 	router := mux.NewRouter()
64 | 	router.HandleFunc("/", rootRouteJSON).Methods("GET").HeadersRegexp("Accept", "application/json")
65 | 	router.HandleFunc("/", rootRouteJSON).Methods("GET").Queries("format", "json")
66 | 	router.HandleFunc("/", rootRouteHTML).Methods("GET")
67 | 	router.HandleFunc("/exit", exitRoute).Methods("GET")
68 | 	return router
69 | }
70 | 
71 | func init() {
72 | 	startTime = time.Now()
73 | }
74 | 
75 | func main() {
76 | 	router := MakeRouter()
77 | 	log.Fatal(http.ListenAndServe(":5000", router))
78 | }
79 | 


--------------------------------------------------------------------------------
/front/README.md:
--------------------------------------------------------------------------------
 1 | # front
 2 | 
 3 | This is the frontend part, based on create-react-app. The CRA readme is accessible [here](README.cra.md).
 4 | 
 5 | ## Development
 6 | 
 7 | Once you `docker-compose up -d`, the whole stack spins up and your webpack server will run inside a container which will expose the port 3000.
 8 | 
 9 | ## Tasks
10 | 
11 | npm tasks (such as `npm test`) are run inside the container. To avoid having to write each time `docker-compose run front npm run my-task`, I added `docker-*` tasks that you can trigger from your host machine:
12 | 
13 | * `npm run docker-test`: runs all tests in a container
14 | * `npm run docker-test:unit`: runs all unit tests in a container
15 | * `npm run docker-test:unit:watch`: runs all unit tests in a container in watch mode
16 | * `npm run docker-build`: runs `npm run build` in a container (which will create the `./build` folder on the host machine)
17 | 
18 | ## Manage dependencies
19 | 
20 | As you can see in [docker-compose.override.yml](../docker-compose.override.yml), the `node_modules` folder is binded to the named volume `front-deps`, so that those will be persisted outside of the container (but without mapping to a local `node_modules` folder of the host).
21 | 
22 | Keep in mind that the `npm install` should be done from the container (based on Linux), because the OS of your host might be something else (like Windows or Mac OS) - native modules relying on C will need to be compiled according to your OS.
23 | 
24 | * `docker-compose run front npm install`: will run `npm install` from inside the container
25 | * `docker-compose run front sh -c "rm -rf ./node_modules/*"`: will clear the `node_modules` folder from inside the container (you can't just remove it like `rm -rf ./node_modules`, you will have an error since the volume is mounted from the container)
26 | * `docker-compose run front sh -c "rm -rf ./node_modules/* && npm install"`: clear `node_modules` and run `npm install`
27 | 
28 | ## Miscellaneous
29 | 
30 | ### Proxy
31 | 
32 | In development mode, we use the create-react-app's [proxy](#proxying-api-requests-in-development) to proxy calls from `/api` to `http://api:5000` (the requests go from the `front` container to the `api` container via the docker subnet, without your host machine having access and are expose on `http://localhost:3000/api`). Check the `proxy` section of the [`package.json`](package.json).


--------------------------------------------------------------------------------
/api/main_test.go:
--------------------------------------------------------------------------------
 1 | package main
 2 | 
 3 | import (
 4 | 	"io"
 5 | 	"net/http"
 6 | 	"net/http/httptest"
 7 | 	"testing"
 8 | )
 9 | 
10 | func TestRouter(t *testing.T) {
11 | 	// create a test server using our router
12 | 	router := MakeRouter()
13 | 	ts := httptest.NewServer(router)
14 | 	defer ts.Close()
15 | 
16 | 	makeRequest := func(method string, path string, headers map[string]string, body io.Reader) *http.Request {
17 | 		req, err := http.NewRequest(method, ts.URL+path, body)
18 | 		if err != nil {
19 | 			t.Fatal(err)
20 | 		}
21 | 		if len(headers) > 0 {
22 | 			for key, value := range headers {
23 | 				req.Header.Set(key, value)
24 | 			}
25 | 		}
26 | 		return req
27 | 	}
28 | 
29 | 	tests := []struct {
30 | 		name   string
31 | 		req    *http.Request
32 | 		assert func(title string, res *http.Response)
33 | 	}{
34 | 		{
35 | 			name: "with(Accept:application/json)",
36 | 			req:  makeRequest("GET", "/", map[string]string{"Accept": "application/json"}, nil),
37 | 			assert: func(title string, res *http.Response) {
38 | 				expectedContentType := "application/json; charset=utf-8"
39 | 				contentType := res.Header.Get("Content-Type")
40 | 				if contentType != expectedContentType {
41 | 					t.Error(title, "Wrong Content-Type header", "| expected:", expectedContentType, "| received:", contentType)
42 | 				}
43 | 			},
44 | 		},
45 | 		{
46 | 			name: "with(?format=json)",
47 | 			req:  makeRequest("GET", "/?format=json", nil, nil),
48 | 			assert: func(title string, res *http.Response) {
49 | 				expectedContentType := "application/json; charset=utf-8"
50 | 				contentType := res.Header.Get("Content-Type")
51 | 				if contentType != expectedContentType {
52 | 					t.Error(title, "Wrong Content-Type header", "| expected:", expectedContentType, "| received:", contentType)
53 | 				}
54 | 			},
55 | 		},
56 | 		{
57 | 			name: "with(default)",
58 | 			req:  makeRequest("GET", "/", nil, nil),
59 | 			assert: func(title string, res *http.Response) {
60 | 				expectedContentType := "text/html; charset=utf-8"
61 | 				contentType := res.Header.Get("Content-Type")
62 | 				if contentType != expectedContentType {
63 | 					t.Error(title, "Wrong Content-Type header", "| expected:", expectedContentType, "| received:", contentType)
64 | 				}
65 | 			},
66 | 		},
67 | 	}
68 | 
69 | 	for _, test := range tests {
70 | 		t.Run(test.name, func(t *testing.T) {
71 | 			res, err := http.DefaultClient.Do(test.req)
72 | 			if err != nil {
73 | 				t.Fatal(err)
74 | 			}
75 | 			test.assert(test.name, res)
76 | 			defer res.Body.Close()
77 | 		})
78 | 	}
79 | }
80 | 


--------------------------------------------------------------------------------
/front/src/assets/images/react-logo.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
2 |     <g fill="#61DAFB">
3 |         <path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
4 |         <circle cx="420.9" cy="296.5" r="45.7"/>
5 |         <path d="M520.5 78.1z"/>
6 |     </g>
7 | </svg>
8 | 


--------------------------------------------------------------------------------
/front/src/App.js:
--------------------------------------------------------------------------------
 1 | import React, { Component } from 'react';
 2 | import reactLogo from './assets/images/react-logo.svg';
 3 | import dockerLogo from './assets/images/docker-logo.svg';
 4 | import nginxLogo from './assets/images/nginx-logo.svg';
 5 | import kubernetesLogo from './assets/images/kubernetes-logo.svg';
 6 | import gopher from './assets/images/gopher.svg';
 7 | import './App.css';
 8 | import axios from 'axios';
 9 | 
10 | const CancelToken = axios.CancelToken;
11 | const source = CancelToken.source();
12 | 
13 | class App extends Component {
14 |   state = {
15 |     loading: false,
16 |     error: null,
17 |     data: null
18 |   }
19 |   componentDidMount() {
20 |     this.fetchInfos()
21 |   }
22 |   componentWillUnmount() {
23 |     source.cancel({
24 |       type: "componentWillUnmount",
25 |       message:"Component unmounting, cancelling inflight requests"
26 |     });
27 |   }
28 |   fetchInfos() {
29 |     this.setState({
30 |       error: null,
31 |       loading: true,
32 |       data: null
33 |     });
34 |     axios.get('/api', { cancelToken: source.token }).then(result => {
35 |       this.setState({
36 |         data: result.data,
37 |         loading: false
38 |       })
39 |     })
40 |     .catch(error => {
41 |       if (axios.isCancel(error) && error.message && error.message.type === "componentWillUnmount") {
42 |         console.error(error.message.message);
43 |       }
44 |       else {
45 |         this.setState({
46 |           error,
47 |           loading: false
48 |         });
49 |       }
50 |     })
51 |   }
52 |   exit() {
53 |     axios.get('/api/exit');
54 |   }
55 |   render() {
56 |     const {loading, error, data} = this.state;
57 |     return (
58 |       <div className="App">
59 |         <header className="App-header">
60 |           <img src={kubernetesLogo} style={{marginRight: 20}} className="App-logo" alt="kubernetes logo" />
61 |           <img src={dockerLogo} className="App-logo" alt="docker logo" />
62 |           <img src={reactLogo} className="App-logo" alt="react logo" />
63 |           <img src={nginxLogo} style={{marginRight: 20}} className="App-logo" alt="nginx logo" />
64 |           <img src={gopher} style={{marginLeft: 12}} className="App-logo" alt="golang logo" />
65 |           <h1 className="App-title">docker-experiments</h1>
66 |           <p className="App-github-link"><a href="https://github.com/topheman/docker-experiments" title="Sources on github">sources on github</a></p>
67 |         </header>
68 |         <p>Basic infos retrieved from the dockerized golang api:</p>
69 |         {loading && <p>Loading ...</p>}
70 |         {error && <p>An error occured</p>}
71 |         {data && <ul style={{listStyle: "none", paddingLeft: 0}}>{Object.entries(data).map(([key, value]) => <li key={key}>
72 |           <strong>{key}</strong>: <span>{key !== 'uptime' ? value : `${parseInt(value, 10)}s`}</span>
73 |         </li>)}</ul>}
74 |         <p>
75 |           <button onClick={() => this.fetchInfos()} className="App-button">Reload infos</button>       
76 |         </p>
77 |         {process.env.NODE_ENV === 'production' && <p>
78 |           <a onClick={() => this.exit()} className="App-button"><code>exit 1</code> the api server</a> and see the container restart the api server on failure, thanks to docker-compose or kubernetes (reload infos to check uptime).
79 |         </p>}
80 |       </div>
81 |     );
82 |   }
83 | }
84 | 
85 | export default App;
86 | 


--------------------------------------------------------------------------------
/front/src/registerServiceWorker.js:
--------------------------------------------------------------------------------
  1 | // In production, we register a service worker to serve assets from local cache.
  2 | 
  3 | // This lets the app load faster on subsequent visits in production, and gives
  4 | // it offline capabilities. However, it also means that developers (and users)
  5 | // will only see deployed updates on the "N+1" visit to a page, since previously
  6 | // cached resources are updated in the background.
  7 | 
  8 | // To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
  9 | // This link also includes instructions on opting out of this behavior.
 10 | 
 11 | const isLocalhost = Boolean(
 12 |   window.location.hostname === 'localhost' ||
 13 |     // [::1] is the IPv6 localhost address.
 14 |     window.location.hostname === '[::1]' ||
 15 |     // 127.0.0.1/8 is considered localhost for IPv4.
 16 |     window.location.hostname.match(
 17 |       /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
 18 |     )
 19 | );
 20 | 
 21 | export default function register() {
 22 |   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
 23 |     // The URL constructor is available in all browsers that support SW.
 24 |     const publicUrl = new URL(process.env.PUBLIC_URL, window.location);
 25 |     if (publicUrl.origin !== window.location.origin) {
 26 |       // Our service worker won't work if PUBLIC_URL is on a different origin
 27 |       // from what our page is served on. This might happen if a CDN is used to
 28 |       // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
 29 |       return;
 30 |     }
 31 | 
 32 |     window.addEventListener('load', () => {
 33 |       const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
 34 | 
 35 |       if (isLocalhost) {
 36 |         // This is running on localhost. Lets check if a service worker still exists or not.
 37 |         checkValidServiceWorker(swUrl);
 38 | 
 39 |         // Add some additional logging to localhost, pointing developers to the
 40 |         // service worker/PWA documentation.
 41 |         navigator.serviceWorker.ready.then(() => {
 42 |           console.log(
 43 |             'This web app is being served cache-first by a service ' +
 44 |               'worker. To learn more, visit https://goo.gl/SC7cgQ'
 45 |           );
 46 |         });
 47 |       } else {
 48 |         // Is not local host. Just register service worker
 49 |         registerValidSW(swUrl);
 50 |       }
 51 |     });
 52 |   }
 53 | }
 54 | 
 55 | function registerValidSW(swUrl) {
 56 |   navigator.serviceWorker
 57 |     .register(swUrl)
 58 |     .then(registration => {
 59 |       registration.onupdatefound = () => {
 60 |         const installingWorker = registration.installing;
 61 |         installingWorker.onstatechange = () => {
 62 |           if (installingWorker.state === 'installed') {
 63 |             if (navigator.serviceWorker.controller) {
 64 |               // At this point, the old content will have been purged and
 65 |               // the fresh content will have been added to the cache.
 66 |               // It's the perfect time to display a "New content is
 67 |               // available; please refresh." message in your web app.
 68 |               console.log('New content is available; please refresh.');
 69 |             } else {
 70 |               // At this point, everything has been precached.
 71 |               // It's the perfect time to display a
 72 |               // "Content is cached for offline use." message.
 73 |               console.log('Content is cached for offline use.');
 74 |             }
 75 |           }
 76 |         };
 77 |       };
 78 |     })
 79 |     .catch(error => {
 80 |       console.error('Error during service worker registration:', error);
 81 |     });
 82 | }
 83 | 
 84 | function checkValidServiceWorker(swUrl) {
 85 |   // Check if the service worker can be found. If it can't reload the page.
 86 |   fetch(swUrl)
 87 |     .then(response => {
 88 |       // Ensure service worker exists, and that we really are getting a JS file.
 89 |       if (
 90 |         response.status === 404 ||
 91 |         response.headers.get('content-type').indexOf('javascript') === -1
 92 |       ) {
 93 |         // No service worker found. Probably a different app. Reload the page.
 94 |         navigator.serviceWorker.ready.then(registration => {
 95 |           registration.unregister().then(() => {
 96 |             window.location.reload();
 97 |           });
 98 |         });
 99 |       } else {
100 |         // Service worker found. Proceed as normal.
101 |         registerValidSW(swUrl);
102 |       }
103 |     })
104 |     .catch(() => {
105 |       console.log(
106 |         'No internet connection found. App is running in offline mode.'
107 |       );
108 |     });
109 | }
110 | 
111 | export function unregister() {
112 |   if ('serviceWorker' in navigator) {
113 |     navigator.serviceWorker.ready.then(registration => {
114 |       registration.unregister();
115 |     });
116 |   }
117 | }
118 | 


--------------------------------------------------------------------------------
/Makefile:
--------------------------------------------------------------------------------
  1 | UTILS := $(shell dirname $(abspath $(lastword $(MAKEFILE_LIST))))/.makefile-utils.sh
  2 | 
  3 | OK_COLOR     = \033[0;32m
  4 | NO_COLOR     = \033[m
  5 | 
  6 | DOCKER_USER = topheman
  7 | DOCKER_IMAGE_PREFIX = $(DOCKER_USER)/docker-experiments
  8 | DOCKER_IMAGE_NAME_FRONT_DEV = $(DOCKER_IMAGE_PREFIX)_front_development
  9 | DOCKER_IMAGE_NAME_API_DEV = $(DOCKER_IMAGE_PREFIX)_api_development
 10 | DOCKER_IMAGE_NAME_API_PROD = $(DOCKER_IMAGE_PREFIX)_api_production
 11 | DOCKER_IMAGE_NAME_NGINX = $(DOCKER_IMAGE_PREFIX)_nginx
 12 | 
 13 | TAG_LATEST = latest
 14 | TAG ?= 1.0.1
 15 | 
 16 | # development docker-compose
 17 | COMPOSE              = docker-compose
 18 | COMPOSE_RUN          = $(COMPOSE) run --rm
 19 | COMPOSE_RUNCI        = $(COMPOSE_RUN) -e CI=true
 20 | COMPOSE_RUN_FRONT    = $(COMPOSE_RUN) front
 21 | COMPOSE_RUNCI_FRONT  = $(COMPOSE_RUNCI) front
 22 | COMPOSE_RUN_API      = $(COMPOSE_RUN) api
 23 | 
 24 | # production docker-compose
 25 | COMPOSEPROD          = docker-compose -f ./docker-compose.yml -f ./docker-compose.prod.yml
 26 | 
 27 | # kubernetes
 28 | KUBECTL_CONFIG       = -f ./deployments/api.yml -f ./deployments/front.yml
 29 | 
 30 | default: help
 31 | 
 32 | .PHONY: build-front-assets dev-logs-api dev-logs-front dev-logs dev-ps dev-start-d dev-start dev-stop docker-build-prod docker-images-clean docker-images-id docker-images-name docker-images kube-ps kube-start-no-rebuild kube-start kube-stop prod-logs-api prod-logs-front prod-logs prod-ps prod-start-d-no-rebuild prod-start-d prod-start-no-rebuild prod-start prod-stop test-api test-front test
 33 | 
 34 | # rename ?
 35 | build-front-assets: ## Build frontend assets into ./front/build folder
 36 | 	$(COMPOSE_RUN_FRONT) npm run build
 37 | 
 38 | test-front: ## Test react frontend
 39 | 	$(COMPOSE_RUNCI_FRONT) npm run -s test
 40 | 
 41 | test-api: ## Test golang backend
 42 | 	$(COMPOSE_RUN_API) go test -run ''
 43 | 
 44 | test: test-front test-api ## 🌡  Test both frontend and backend
 45 | 
 46 | docker-images: ## List project's docker images
 47 | 	@docker images --filter=reference='$(DOCKER_IMAGE_PREFIX)*'
 48 | 
 49 | docker-images-name: ## List project's docker images formatted as <name>:<tag>
 50 | 	@docker images --format "{{.Repository}}:{{.Tag}}" --filter=reference='$(DOCKER_IMAGE_PREFIX)*'
 51 | 
 52 | docker-images-id: ## List project's docker images formatted as <id>
 53 | 	@docker images --quiet --filter=reference='$(DOCKER_IMAGE_PREFIX)*'
 54 | 
 55 | docker-images-clean: ## Clean dangling images (tagged as <none>)
 56 | 	docker rmi $(shell docker images -q --filter="dangling=true")
 57 | 
 58 | docker-build-prod: ## Build production images
 59 | 	$(MAKE) build-front-assets
 60 | 	docker build ./api -t $(DOCKER_IMAGE_NAME_API_PROD):$(TAG)
 61 | 	docker build . -f Dockerfile.prod -t $(DOCKER_IMAGE_NAME_NGINX):$(TAG)
 62 | 
 63 | dev-start: ## 🐳  Start development stack
 64 | 	$(COMPOSE) up
 65 | dev-start-d: ## Start development stack (in daemon mode)
 66 | 	$(COMPOSE) up -d
 67 | dev-stop: ## Stop development stack
 68 | 	$(COMPOSE) down
 69 | dev-ps: ## List development stack active containers
 70 | 	$(COMPOSE) ps
 71 | dev-logs: ## 🐳  Follow ALL logs (dev)
 72 | 	$(COMPOSE) logs -f
 73 | dev-logs-front: ## Follow front logs (dev)
 74 | 	$(COMPOSE) logs -f front
 75 | dev-logs-api: ## Follow api logs (dev)
 76 | 	$(COMPOSE) logs -f api
 77 | 
 78 | prod-start: ## 🐳  Start production stack (bundles frontend before)
 79 | 	$(MAKE) build-front-assets
 80 | 	$(COMPOSEPROD) up --build
 81 | prod-start-d: ## Start production stack (in daemon mode)
 82 | 	$(MAKE)build-front-assets 
 83 | 	$(COMPOSEPROD) up --build -d
 84 | prod-start-no-rebuild: ## 🐳  Start production stack without recreating docker images
 85 | 	$(COMPOSEPROD) up
 86 | prod-start-d-no-rebuild: ## Start production stack (in daemon mode)  without recreating docker images
 87 | 	$(COMPOSEPROD) up -d
 88 | prod-stop: ## Stop production stack
 89 | 	$(COMPOSEPROD) down
 90 | prod-ps: ## List production stack active containers
 91 | 	$(COMPOSEPROD) ps
 92 | prod-logs: ## 🐳  Follow ALL logs (prod)
 93 | 	$(COMPOSEPROD) logs -f
 94 | prod-logs-front: ## Follow front logs (prod)
 95 | 	$(COMPOSEPROD) logs -f front
 96 | prod-logs-api: ## Follow api logs (prod)
 97 | 	$(COMPOSEPROD) logs -f api
 98 | 
 99 | kube-start-no-rebuild: ## Create kubernetes deployment without recreating docker images
100 | 	kubectl create $(KUBECTL_CONFIG)
101 | kube-start: ## ☸️  Create kubernetes deployment with fresh docker images
102 | 	$(MAKE) docker-build-prod
103 | 	@echo ""
104 | 	$(MAKE) kube-start-no-rebuild
105 | 	@echo "\nYou may use $(OK_COLOR)make kube-start-no-rebuild$(NO_COLOR) next time to avoid rebuilding images each time\n"
106 | kube-stop: ## Delete kubernetes deployment with fresh docker images
107 | 	kubectl delete $(KUBECTL_CONFIG)
108 | kube-ps: ## List kubernetes pods and services
109 | 	kubectl get pods,services
110 | 
111 | help:
112 | 	@grep -E '^[a-zA-Z0-9_-]+:.*?## .*$$' $(MAKEFILE_LIST) | sort | awk 'BEGIN {FS = ":.*?## "}; {printf "\033[36m%-30s\033[0m %s\n", $$1, $$2}'
113 | 
114 | list-phony:
115 | 	# List all the tasks to add the to .PHONY (choose between inlined and linefeed)
116 | 	# bash variables are expanded with $$
117 | 	# make|sed 's/\|/ /'|awk '{printf "%s+ ", $1}'
118 | 	# make|sed 's/\|/ /'|awk '{print $1}'
119 | 	@$(MAKE) help|sed 's/\|/ /'|awk '{printf "%s ", $$1}'
120 | 	@echo "\n"
121 | 	@$(MAKE) help|sed 's/\|/ /'|awk '{print $$1}'
122 | 
123 | # deprecated - example of how to call a function from an other .sh file
124 | image-exists:
125 | 	@. $(UTILS); image_exists $(DOCKER_IMAGE_NAME_NGINX):$(TAG)


--------------------------------------------------------------------------------
/front/src/assets/images/docker-logo.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="utf-8"?>
 2 | <!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 3 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 4 | <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 5 |    width="466px" height="423.891px" viewBox="0 0 466 423.891" enable-background="new 0 0 466 423.891" xml:space="preserve">
 6 | <rect x="-43.5" y="37.005" display="none" fill-rule="evenodd" clip-rule="evenodd" fill="#E7E7E7" width="792" height="612"/>
 7 | <g>
 8 |   <path id="outline_7_" fill="#23b8ef" fill-rule="evenodd" clip-rule="evenodd" d="M242.133,168.481h47.146v48.194h23.837
 9 |     c11.008,0,22.33-1.962,32.755-5.494c5.123-1.736,10.872-4.154,15.926-7.193c-6.656-8.689-10.053-19.661-11.054-30.476
10 |     c-1.358-14.71,1.609-33.855,11.564-45.368l4.956-5.732l5.905,4.747c14.867,11.946,27.372,28.638,29.577,47.665
11 |     c17.901-5.266,38.921-4.02,54.701,5.088l6.475,3.734l-3.408,6.652c-13.345,26.046-41.246,34.113-68.524,32.687
12 |     c-40.817,101.663-129.68,149.794-237.428,149.794c-55.666,0-106.738-20.81-135.821-70.197l-0.477-0.807l-4.238-8.621
13 |     C4.195,271.415,0.93,247.6,3.145,223.803l0.664-7.127h40.315v-48.194h47.143v-47.145h94.292V74.191h56.574V168.481z"/>
14 |   <g display="none">
15 |     <path display="inline" fill="#394D54" d="M61.093,319.89c6.023,0,11.763-0.157,17.219-0.464c0.476-0.026,0.932-0.063,1.402-0.092
16 |       c0.005-0.002,0.008-0.002,0.012-0.002c13.872-0.855,25.876-2.708,35.902-5.57c0.002-0.002,0.004-0.002,0.006-0.002
17 |       c1.823-0.521,3.588-1.07,5.282-1.656c1.894-0.657,2.896-2.725,2.241-4.618c-0.656-1.895-2.722-2.899-4.618-2.24
18 |       c-12.734,4.412-29.535,6.842-50.125,7.298c-0.002,0-0.004,0-0.005,0c-10.477,0.232-21.93-0.044-34.352-0.843c0,0,0,0-0.001,0
19 |       c-0.635-0.038-1.259-0.075-1.9-0.118c-1.995-0.128-3.731,1.374-3.869,3.375c-0.136,1.999,1.376,3.73,3.375,3.866
20 |       c2.537,0.173,5.03,0.321,7.49,0.453c0.392,0.021,0.77,0.034,1.158,0.054l0,0C47.566,319.697,54.504,319.89,61.093,319.89z"/>
21 |   </g>
22 |   <g id="Containers_8_">
23 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M86.209,179.744h3.227v34.052h-3.227V179.744z M80.02,179.744
24 |       h3.354v34.052H80.02V179.744z M73.828,179.744h3.354v34.052h-3.354V179.744z M67.636,179.744h3.354v34.052h-3.354V179.744z
25 |        M61.446,179.744H64.8v34.052h-3.354V179.744z M55.384,179.744h3.224v34.052h-3.224V179.744z M51.981,176.338h40.858v40.86H51.981
26 |       V176.338z"/>
27 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M133.354,132.598h3.229v34.051h-3.229V132.598z M127.165,132.598
28 |       h3.354v34.051h-3.354V132.598z M120.973,132.598h3.354v34.051h-3.354V132.598z M114.781,132.598h3.354v34.051h-3.354V132.598z
29 |        M108.593,132.598h3.352v34.051h-3.352V132.598z M102.531,132.598h3.222v34.051h-3.222V132.598z M99.124,129.193h40.863v40.859
30 |       H99.124V129.193z"/>
31 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M133.354,179.744h3.229v34.052h-3.229V179.744z M127.165,179.744
32 |       h3.354v34.052h-3.354V179.744z M120.973,179.744h3.354v34.052h-3.354V179.744z M114.781,179.744h3.354v34.052h-3.354V179.744z
33 |        M108.593,179.744h3.352v34.052h-3.352V179.744z M102.531,179.744h3.222v34.052h-3.222V179.744z M99.124,176.338h40.863v40.86
34 |       H99.124V176.338z"/>
35 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M180.501,179.744h3.225v34.052h-3.225V179.744z M174.31,179.744
36 |       h3.355v34.052h-3.355V179.744z M168.12,179.744h3.354v34.052h-3.354V179.744z M161.928,179.744h3.354v34.052h-3.354V179.744z
37 |        M155.736,179.744h3.354v34.052h-3.354V179.744z M149.676,179.744h3.222v34.052h-3.222V179.744z M146.271,176.338h40.861v40.86
38 |       h-40.861V176.338z"/>
39 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M180.501,132.598h3.225v34.051h-3.225V132.598z M174.31,132.598
40 |       h3.355v34.051h-3.355V132.598z M168.12,132.598h3.354v34.051h-3.354V132.598z M161.928,132.598h3.354v34.051h-3.354V132.598z
41 |        M155.736,132.598h3.354v34.051h-3.354V132.598z M149.676,132.598h3.222v34.051h-3.222V132.598z M146.271,129.193h40.861v40.859
42 |       h-40.861V129.193z"/>
43 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M227.647,179.744h3.226v34.052h-3.226V179.744z M221.457,179.744
44 |       h3.354v34.052h-3.354V179.744z M215.265,179.744h3.354v34.052h-3.354V179.744z M209.073,179.744h3.354v34.052h-3.354V179.744z
45 |        M202.884,179.744h3.354v34.052h-3.354V179.744z M196.821,179.744h3.224v34.052h-3.224V179.744z M193.416,176.338h40.861v40.86
46 |       h-40.861V176.338z"/>
47 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M227.647,132.598h3.226v34.051h-3.226V132.598z M221.457,132.598
48 |       h3.354v34.051h-3.354V132.598z M215.265,132.598h3.354v34.051h-3.354V132.598z M209.073,132.598h3.354v34.051h-3.354V132.598z
49 |        M202.884,132.598h3.354v34.051h-3.354V132.598z M196.821,132.598h3.224v34.051h-3.224V132.598z M193.416,129.193h40.861v40.859
50 |       h-40.861V129.193z"/>
51 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M227.647,85.451h3.226v34.053h-3.226V85.451z M221.457,85.451
52 |       h3.354v34.053h-3.354V85.451z M215.265,85.451h3.354v34.053h-3.354V85.451z M209.073,85.451h3.354v34.053h-3.354V85.451z
53 |        M202.884,85.451h3.354v34.053h-3.354V85.451z M196.821,85.451h3.224v34.053h-3.224V85.451z M193.416,82.048h40.861v40.86h-40.861
54 |       V82.048z"/>
55 |     <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M274.792,179.744h3.224v34.052h-3.224V179.744z M268.602,179.744
56 |       h3.352v34.052h-3.352V179.744z M262.408,179.744h3.354v34.052h-3.354V179.744z M256.218,179.744h3.354v34.052h-3.354V179.744z
57 |        M250.026,179.744h3.354v34.052h-3.354V179.744z M243.964,179.744h3.227v34.052h-3.227V179.744z M240.561,176.338h40.86v40.86
58 |       h-40.86V176.338z"/>
59 |   </g>
60 |   <path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFFFF" d="M137.428,283.445c6.225,0,11.271,5.049,11.271,11.272
61 |     c0,6.225-5.046,11.271-11.271,11.271c-6.226,0-11.272-5.046-11.272-11.271C126.156,288.494,131.202,283.445,137.428,283.445"/>
62 |   <path fill-rule="evenodd" clip-rule="evenodd" d="M137.428,286.644c1.031,0,2.015,0.194,2.923,0.546
63 |     c-0.984,0.569-1.65,1.635-1.65,2.854c0,1.82,1.476,3.293,3.296,3.293c1.247,0,2.329-0.693,2.89-1.715
64 |     c0.395,0.953,0.615,1.999,0.615,3.097c0,4.458-3.615,8.073-8.073,8.073c-4.458,0-8.074-3.615-8.074-8.073
65 |     C129.354,290.258,132.971,286.644,137.428,286.644"/>
66 |   <path fill="#FFFFFF" d="M167.394,364.677c-27.916-13.247-43.239-31.256-51.765-50.915c-10.37,2.961-22.835,4.852-37.317,5.664
67 |     c-5.457,0.307-11.196,0.464-17.219,0.464c-6.942,0-14.26-0.205-21.94-0.613c25.6,25.585,57.094,45.283,115.408,45.645
68 |     C158.866,364.921,163.14,364.837,167.394,364.677z"/>
69 | </g>
70 | </svg>
71 | 


--------------------------------------------------------------------------------
/front/src/assets/images/kubernetes-logo.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 2 | <!-- Created with Inkscape (http://www.inkscape.org/) -->
 3 | 
 4 | <svg
 5 |    xmlns:dc="http://purl.org/dc/elements/1.1/"
 6 |    xmlns:cc="http://creativecommons.org/ns#"
 7 |    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
 8 |    xmlns:svg="http://www.w3.org/2000/svg"
 9 |    xmlns="http://www.w3.org/2000/svg"
10 |    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
11 |    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
12 |    width="722.8457"
13 |    height="701.96637"
14 |    id="svg2"
15 |    version="1.1"
16 |    inkscape:version="0.48.4 r9939"
17 |    sodipodi:docname="logo.svg"
18 |    inkscape:export-filename="/home/thockin/src/kubernetes/new.png"
19 |    inkscape:export-xdpi="460.95001"
20 |    inkscape:export-ydpi="460.95001">
21 |   <defs
22 |      id="defs4" />
23 |   <sodipodi:namedview
24 |      id="base"
25 |      pagecolor="#ffffff"
26 |      bordercolor="#666666"
27 |      borderopacity="1.0"
28 |      inkscape:pageopacity="0.0"
29 |      inkscape:pageshadow="2"
30 |      inkscape:zoom="16.190509"
31 |      inkscape:cx="277.56851"
32 |      inkscape:cy="157.54494"
33 |      inkscape:document-units="px"
34 |      inkscape:current-layer="g3052"
35 |      showgrid="false"
36 |      inkscape:window-width="1519"
37 |      inkscape:window-height="822"
38 |      inkscape:window-x="51"
39 |      inkscape:window-y="25"
40 |      inkscape:window-maximized="0"
41 |      inkscape:snap-global="false"
42 |      fit-margin-top="10"
43 |      fit-margin-left="10"
44 |      fit-margin-right="10"
45 |      fit-margin-bottom="10" />
46 |   <metadata
47 |      id="metadata7">
48 |     <rdf:RDF>
49 |       <cc:Work
50 |          rdf:about="">
51 |         <dc:format>image/svg+xml</dc:format>
52 |         <dc:type
53 |            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
54 |         <dc:title />
55 |       </cc:Work>
56 |     </rdf:RDF>
57 |   </metadata>
58 |   <g
59 |      inkscape:label="Layer 1"
60 |      inkscape:groupmode="layer"
61 |      id="layer1"
62 |      transform="translate(-6.3260942,-174.7524)">
63 |     <g
64 |        id="g3052">
65 |       <path
66 |          style="fill:#326ce5;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
67 |          d="m 365.3125,184.8125 a 46.724621,46.342246 0 0 0 -17.90625,4.53125 l -244.34375,116.75 a 46.724621,46.342246 0 0 0 -25.28125,31.4375 L 17.5,599.78125 A 46.724621,46.342246 0 0 0 23.84375,635.3125 46.724621,46.342246 0 0 0 26.5,639 l 169.125,210.28125 a 46.724621,46.342246 0 0 0 36.53125,17.4375 L 503.375,866.65625 A 46.724621,46.342246 0 0 0 539.90625,849.25 L 708.96875,638.9375 A 46.724621,46.342246 0 0 0 718,599.71875 l -60.375,-262.25 a 46.724621,46.342246 0 0 0 -25.28125,-31.4375 l -244.375,-116.6875 A 46.724621,46.342246 0 0 0 365.3125,184.8125 z"
68 |          id="path3055"
69 |          inkscape:connector-curvature="0"
70 |          inkscape:export-filename="new.png"
71 |          inkscape:export-xdpi="250.55"
72 |          inkscape:export-ydpi="250.55" />
73 |       <path
74 |          inkscape:connector-curvature="0"
75 |          id="path3059"
76 |          d="m 367.73366,274.05962 c -8.07696,8.2e-4 -14.62596,7.27591 -14.625,16.25 1e-5,0.13773 0.0282,0.26934 0.0312,0.40625 -0.0119,1.21936 -0.0708,2.68836 -0.0312,3.75 0.19262,5.176 1.3209,9.13749 2,13.90625 1.23028,10.20666 2.26117,18.66736 1.625,26.53125 -0.61869,2.9654 -2.80288,5.67741 -4.75,7.5625 l -0.34375,6.1875 c -8.77682,0.72717 -17.61235,2.05874 -26.4375,4.0625 -37.97461,8.62218 -70.67008,28.18307 -95.5625,54.59375 -1.61522,-1.10193 -4.44103,-3.12914 -5.2813,-3.75 -2.61117,0.35262 -5.25021,1.15829 -8.6875,-0.84375 -6.54491,-4.40563 -12.50587,-10.48693 -19.71875,-17.8125 -3.30498,-3.50419 -5.69832,-6.84101 -9.625,-10.21875 -0.89172,-0.76707 -2.25258,-1.80455 -3.25,-2.59375 -3.06988,-2.44757 -6.6907,-3.72402 -10.1875,-3.84375 -4.49589,-0.15394 -8.82394,1.60385 -11.65625,5.15625 -5.03521,6.31538 -3.42312,15.96805 3.59375,21.5625 0.0712,0.0567 0.14702,0.10078 0.21875,0.15625 0.96422,0.78162 2.14496,1.78313 3.03125,2.4375 4.16687,3.07655 7.9732,4.65145 12.125,7.09375 8.747,5.40181 15.99837,9.88086 21.75,15.28125 2.24602,2.39417 2.63858,6.61292 2.9375,8.4375 l 4.6875,4.1875 c -25.09342,37.76368 -36.70686,84.40946 -29.8437,131.9375 l -6.125,1.78125 c -1.6143,2.08461 -3.89541,5.36474 -6.2813,6.34375 -7.52513,2.37021 -15.99424,3.24059 -26.21875,4.3125 -4.80031,0.39915 -8.94218,0.16095 -14.03125,1.125 -1.12008,0.21218 -2.68072,0.61877 -3.90625,0.90625 -0.0426,0.009 -0.0824,0.0216 -0.125,0.0312 -0.0668,0.0155 -0.15456,0.0479 -0.21875,0.0625 -8.62014,2.08279 -14.15774,10.006 -12.375,17.8125 1.78316,7.80833 10.20314,12.55677 18.875,10.6875 0.0626,-0.0143 0.1535,-0.0167 0.21875,-0.0312 0.0979,-0.0224 0.18409,-0.0699 0.28125,-0.0937 1.20885,-0.26536 2.72377,-0.5606 3.78125,-0.84375 5.00334,-1.33963 8.62694,-3.30796 13.125,-5.03125 9.67694,-3.47077 17.69173,-6.37022 25.5,-7.5 3.26118,-0.25542 6.69711,2.01216 8.40625,2.96875 l 6.375,-1.09375 c 14.67018,45.48282 45.41416,82.24502 84.34375,105.3125 l -2.65625,6.375 c 0.95742,2.47542 2.01341,5.8247 1.30022,8.26932 -2.83868,7.3612 -7.70097,15.13097 -13.23772,23.79318 -2.68085,4.00192 -5.42453,7.10761 -7.84375,11.6875 -0.5789,1.09589 -1.31618,2.77932 -1.875,3.9375 -3.75884,8.04236 -1.00164,17.3052 6.21875,20.78125 7.26575,3.49788 16.28447,-0.19134 20.1875,-8.25 0.006,-0.0114 0.0257,-0.0198 0.0312,-0.0312 0.004,-0.009 -0.004,-0.0225 0,-0.0312 0.55593,-1.14255 1.34353,-2.64437 1.8125,-3.71875 2.07213,-4.74702 2.76161,-8.81506 4.21875,-13.40625 3.86962,-9.72014 5.99567,-19.91903 11.32258,-26.27411 1.45868,-1.74023 3.83681,-2.4095 6.30242,-3.06964 l 3.3125,-6 c 33.93824,13.0268 71.92666,16.52246 109.875,7.90625 8.65697,-1.96557 17.01444,-4.50945 25.09375,-7.5625 0.93098,1.65133 2.66113,4.8257 3.125,5.625 2.50559,0.81518 5.24044,1.23614 7.46875,4.53125 3.98539,6.80898 6.7109,14.86416 10.03125,24.59375 1.45738,4.59111 2.17762,8.65933 4.25,13.40625 0.47234,1.08195 1.256,2.60486 1.8125,3.75 3.89482,8.08484 12.94212,11.78667 20.21875,8.28125 7.2195,-3.4779 9.97974,-12.7399 6.21875,-20.78125 -0.55889,-1.15814 -1.3273,-2.84164 -1.90625,-3.9375 -2.41946,-4.57976 -5.1627,-7.65448 -7.84375,-11.65625 -5.53721,-8.66192 -10.12968,-15.8577 -12.96875,-23.21875 -1.18711,-3.79657 0.20028,-6.15774 1.125,-8.625 -0.55378,-0.63477 -1.73881,-4.22009 -2.4375,-5.90625 40.4574,-23.88816 70.29856,-62.02129 84.3125,-106.0625 1.8924,0.29742 5.18154,0.87936 6.25,1.09375 2.19954,-1.4507 4.22194,-3.34352 8.1875,-3.03125 7.80832,1.12937 15.82288,4.02973 25.5,7.5 4.49815,1.72306 8.1216,3.72313 13.125,5.0625 1.05749,0.28309 2.57238,0.5472 3.78125,0.8125 0.0972,0.0238 0.1833,0.0714 0.28125,0.0937 0.0653,0.0146 0.15615,0.0169 0.21875,0.0312 8.67236,1.86695 17.09384,-2.87871 18.875,-10.6875 1.78074,-7.80696 -3.7543,-15.73201 -12.375,-17.8125 -1.25393,-0.28513 -3.03225,-0.76938 -4.25,-1 -5.08912,-0.96378 -9.23092,-0.7261 -14.03125,-1.125 -10.22456,-1.07138 -18.6935,-1.94269 -26.21875,-4.3125 -3.06826,-1.19028 -5.25103,-4.84124 -6.31255,-6.34375 l -5.90625,-1.71875 c 3.06226,-22.15442 2.23655,-45.21134 -3.0625,-68.28125 -5.34839,-23.28471 -14.80037,-44.58084 -27.40625,-63.34375 1.51505,-1.37729 4.37619,-3.91091 5.1875,-4.65625 0.23716,-2.62417 0.0334,-5.37553 2.75,-8.28125 5.75134,-5.40069 13.00329,-9.87898 21.75,-15.28125 4.15167,-2.44252 7.98954,-4.01698 12.15625,-7.09375 0.94225,-0.69576 2.2289,-1.79759 3.21875,-2.59375 7.01538,-5.59633 8.63058,-15.24842 3.59375,-21.5625 -5.03683,-6.31408 -14.79712,-6.90883 -21.8125,-1.3125 -0.99856,0.79085 -2.35353,1.82252 -3.25,2.59375 -3.9265,3.37796 -6.35145,6.71439 -9.65625,10.21875 -7.21249,7.32595 -13.17407,13.43777 -19.71875,17.84375 -2.83601,1.65106 -6.98996,1.07978 -8.87505,0.96875 l -5.5625,3.96875 c -31.7188,-33.26057 -74.90466,-54.52546 -121.40605,-58.6563 -0.13006,-1.94872 -0.30045,-5.47117 -0.34375,-6.53125 -1.90371,-1.82165 -4.20342,-3.37686 -4.78125,-7.3125 -0.63617,-7.86389 0.42597,-16.32459 1.65625,-26.53125 0.6791,-4.76876 1.80738,-8.73025 2,-13.90625 0.0438,-1.17663 -0.0265,-2.88401 -0.0312,-4.15625 -9.6e-4,-8.97409 -6.54804,-16.25082 -14.625,-16.25 z m -18.3125,113.4375 -4.34375,76.71875 -0.3125,0.15625 c -0.29134,6.86335 -5.93996,12.34375 -12.875,12.34375 -2.84081,0 -5.46294,-0.91229 -7.59375,-2.46875 l -0.125,0.0625 -62.90625,-44.59375 c 19.33365,-19.01115 44.06291,-33.06039 72.5625,-39.53125 5.20599,-1.18203 10.40966,-2.0591 15.59375,-2.6875 z m 36.65625,0 c 33.27347,4.09232 64.04501,19.15882 87.625,42.25 l -62.5,44.3125 -0.21875,-0.0937 c -5.54745,4.05169 -13.36343,3.04639 -17.6875,-2.375 -1.77132,-2.22096 -2.70072,-4.83239 -2.8125,-7.46875 l -0.0625,-0.0312 z m -147.625,70.875 57.4375,51.375 -0.0625,0.3125 c 5.18437,4.50697 5.94888,12.32794 1.625,17.75 -1.7712,2.22105 -4.14208,3.71074 -6.6875,4.40625 l -0.0625,0.25 -73.625,21.25 c -3.74728,-34.26517 4.32855,-67.57364 21.375,-95.34375 z m 258.15625,0.0312 c 8.5341,13.83256 14.99655,29.28214 18.84375,46.03125 3.80106,16.54828 4.75499,33.06697 3.1875,49.03125 l -74,-21.3125 -0.0625,-0.3125 c -6.6265,-1.81104 -10.69893,-8.55162 -9.15625,-15.3125 0.63203,-2.76962 2.10222,-5.11264 4.09375,-6.84375 l -0.0312,-0.15625 57.125,-51.125 z m -140.65625,55.3125 23.53125,0 14.625,18.28125 -5.25,22.8125 -21.125,10.15625 -21.1875,-10.1875 -5.25,-22.8125 z m 75.4375,62.5625 c 0.99997,-0.0505 1.99558,0.0396 2.96875,0.21875 l 0.125,-0.15625 76.15625,12.875 c -11.1455,31.3131 -32.47281,58.44018 -60.96875,76.59375 l -29.5625,-71.40625 0.0937,-0.125 c -2.71561,-6.30999 0.002,-13.70956 6.25,-16.71875 1.59965,-0.77041 3.27089,-1.19701 4.9375,-1.28125 z m -127.90625,0.3125 c 5.81174,0.0815 11.02462,4.11525 12.375,10.03125 0.63219,2.76958 0.3245,5.51375 -0.71875,7.9375 l 0.21875,0.28125 -29.25,70.6875 c -27.34716,-17.5486 -49.12927,-43.82403 -60.78125,-76.06245 l 75.5,-12.8125 0.125,0.15625 c 0.84451,-0.15541 1.701,-0.2304 2.53125,-0.21875 z m 63.78125,30.9688 c 2.02445,-0.0744 4.07865,0.34098 6.03125,1.28125 2.55951,1.23253 4.53673,3.17319 5.78125,5.5 l 0.28125,0 37.21875,67.25 c -4.83029,1.61923 -9.79609,3.00308 -14.875,4.15625 -28.46453,6.4629 -56.83862,4.50467 -82.53125,-4.25 l 37.125,-67.125 0.0625,0 c 2.22767,-4.16441 6.45247,-6.64887 10.90625,-6.8125 z"
77 |          style="font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;baseline-shift:baseline;color:#000000;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0.25;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate;font-family:Sans;-inkscape-font-specification:Sans"
78 |          sodipodi:nodetypes="ccccccccsccccscssccsccccccccscccsccccccccccccccscccscsccsccccscscsccccccccscccscsccccsccccscscscccccccccccccccscccsccccccccccccscccccscccccccccccccccccccccccscccscccccccccscccscccc"
79 |          inkscape:export-filename="./path3059.png"
80 |          inkscape:export-xdpi="250.55"
81 |          inkscape:export-ydpi="250.55" />
82 |     </g>
83 |   </g>
84 | </svg>
85 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
  1 | # docker-experiments
  2 | 
  3 | [![CircleCI](https://circleci.com/gh/topheman/docker-experiments/tree/master.svg?style=svg)](https://circleci.com/gh/topheman/docker-experiments)
  4 | 
  5 | <p align="center"><img src="./logo.png" width=530 /></p>
  6 | 
  7 | This started as a simple use case to discover `docker` and `docker-compose` 🐳 :
  8 | 
  9 | * A [front](front) made with create-react-app, running in a nodejs container for development
 10 | * A very simple [api](api) made in go (the challenge is also not to have everything in JavaScript)
 11 | 
 12 | I also setup **deployments on a local kubernetes** ☸️ and tests are running on [CircleCI](https://circleci.com/gh/topheman/docker-experiments) on each push.
 13 | 
 14 | ## TL;DR
 15 | 
 16 | You are a true developer? You don't RTFM? After all, this is why we have docker ... not to bother with all the boring setup/install steps ... 😉
 17 | 
 18 | ```shell
 19 | git clone https://github.com/topheman/docker-experiments.git
 20 | cd docker-experiments
 21 | docker-compose up -d
 22 | ```
 23 | 
 24 | You are good to go with a development server running at [http://localhost:3000](http://localhost:3000), with the front in react, the api in go and everything hot reloading. 👏
 25 | 
 26 | Try to take a few minutes to read the doc bellow ... 😇
 27 | 
 28 | ## Summary
 29 | 
 30 | * [Prerequisites](#prerequisites)
 31 | * [Setup](#setup)
 32 | * [Development 🛠](#development)
 33 | * [Tests 🌡](#tests)
 34 | * [Production - docker-compose 🐳](#production---docker-compose)
 35 | * [Deployment - kubernetes ☸️](#deployment---kubernetes)
 36 | * [Notes 📋](#notes)
 37 |   * [Docker Multi-stage builds](#docker-multi-stage-builds)
 38 |   * [Docker networks / Kubernetes services](#docker-networks--kubernetes-services)
 39 |   * [Restart on failure](#restart-on-failure)
 40 |   * [Commands](#commands)
 41 |     * [Docker commands](#docker-commands)
 42 |     * [Kubernetes commands](#kubernetes-commands)
 43 | * [FAQ](#faq)
 44 |   * [CircleCI](#circleci)
 45 |     * [How to use latest version of docker-compose / docker-engine](#how-to-use-latest-version-of-docker-compose--docker-engine)
 46 |     * [Docker vs Machine executors](#docker-vs-machine-executors)
 47 |   * [Why does /api fallbacks to index.html in production](#why-does-api-fallbacks-to-indexhtml-in-production)
 48 | * [What's next?](#whats-next)
 49 | * [Resources](#resources)
 50 | * [Author](#author)
 51 | 
 52 | ## Prerequisites
 53 | 
 54 | You need to have installed:
 55 | 
 56 | * docker / docker-compose
 57 | * npm / node (optional)
 58 | * local kubernetes server and client (only if you want to play with kubernetes deployment - more about that on the [deployment section](#deployment---kubernetes))
 59 | 
 60 | ## Setup
 61 | 
 62 | ```shell
 63 | git clone https://github.com/topheman/docker-experiments.git
 64 | ```
 65 | 
 66 | A [Makefile](Makefile) is available that automates all the commands that are described bellow. For each section, you'll find the related commands next to the 🖊 emoji.
 67 | 
 68 | Just run `make help` to see the whole list.
 69 | 
 70 | ## Development
 71 | 
 72 | ### Launch development
 73 | 
 74 | ```shell
 75 | docker-compose up -d
 76 | ```
 77 | 
 78 | This will create (if not already done) and launch a whole development stack, based on [docker-compose.yml](docker-compose.yml), [docker-compose.override.yml](docker-compose.override.yml), [api/Dockerfile](api/Dockerfile) and [front/Dockerfile](front/Dockerfile) - following images:
 79 | 
 80 | * `topheman/docker-experiments_front_development`: for react development (based on nodejs image)
 81 | * `topheman/docker-experiments_api_development`: for golang in development mode (using [fresh](https://github.com/pilu/fresh) to build and restart the go webserver when you change the sources)
 82 |   * The `services.api.command` entry in [docker-compose.override.yml](docker-compose.override.yml) will override the default `RUN` command and start a dev server (instead of running the binary compiled in the container at build time)
 83 | 
 84 | Go to http://localhost:3000/ to access the frontend, you're good to go, the api is accessible at http://localhost:5000/.
 85 | 
 86 | 🖊 `make dev-start`, `make dev-start-d`, `make dev-stop`, `make dev-ps`, `make dev-logs`, `make dev-logs-front`, `make dev-logs-api`
 87 | 
 88 | ## Tests
 89 | 
 90 | ### Launch tests
 91 | 
 92 | ```shell
 93 | docker-compose run --rm -e CI=true front npm run -s test && docker-compose run --rm api go test -run ''
 94 | ```
 95 | 
 96 | 🖊 `make test`, `make test-front`, `make test-api`
 97 | 
 98 | ## Production - docker-compose
 99 | 
100 | This section is about **testing the production images with docker-compose** 🐳 (check the [deployment section](#deployment---kubernetes) to deploy with kubernetes locally).
101 | 
102 | Make sure you have built the frontend with `docker-compose run --rm front npm run build`, then:
103 | 
104 | ```shell
105 | docker-compose -f ./docker-compose.yml -f ./docker-compose.prod.yml up --build
106 | ```
107 | 
108 | Note: make sure to use the `--build` flag so that it will rebuild the images if anything changed (in the source code or whatever), thanks to [docker images layers](https://docs.docker.com/develop/develop-images/dockerfile_best-practices/), only changes will be rebuilt, based on cache (not the whole image).
109 | 
110 | This will create (if not already done) and launch a whole production stack:
111 | 
112 | * No nodejs image (it should not be shipped to production, the development image is only used to launch the container that creates the build artefacts with create-react-app).
113 | * `topheman/docker-experiments_api_production`: for the golang server (with the app compiled) - containing only the binary of the golang app (that way the image)
114 | * `topheman/docker-experiments_nginx`: which will:
115 |   * serve the frontend (copied from `/front/build`)
116 |   * proxy `/api` requests to `http://api:5000` (the docker subnet exposed by the golang api container)
117 | 
118 | Access [http://localhost](http://localhost) and you're good to go.
119 | 
120 | 🖊 `make prod-start`, `make prod-start-d`, `make prod-start-no-rebuild`, `make prod-start-d-no-rebuild`, `make prod-stop`, `make prod-ps`, `make prod-logs`, `make prod-logs-front`, `make prod-logs-api`
121 | 
122 | ## Deployment - kubernetes
123 | 
124 | This section is about **deploying the app locally with kubernetes** ☸️ (not tested with a cloud provider). To stay simple, there aren't any TLS termination management (only port 80 exposed).
125 | 
126 | Local kubernetes server and client:
127 | 
128 | * If you have the latest docker for Mac, both are [shipping with kubernetes](https://blog.docker.com/2018/01/docker-mac-kubernetes/)
129 | * Otherwise, you can use [minikube](https://github.com/kubernetes/minikube) for the server and install [`kubectl`](https://kubernetes.io/docs/tasks/tools/install-kubectl/) (kubernetes client)
130 | 
131 | The files descripting the deployments are stored in the [deployments](deployments) folder. You will find two files, each containing the deployment and the service.
132 | 
133 | ### Deploy with kubernetes
134 | 
135 | 1) If you haven't built the frontend, run `docker-compose run --rm front npm run build`
136 | 
137 | 2) Build the production images:
138 | 
139 | ```shell
140 | docker build ./api -t topheman/docker-experiments_api_production:1.0.1
141 | docker build . -f Dockerfile.prod -t topheman/docker-experiments_nginx:1.0.1
142 | ```
143 | 
144 | Note: They are tagged `1.0.1`, same version number as in the deployments files (want to put an other version number ? Don't forget to update the deployment files). For the moment, I'm not using [Helm](http://helm.readthedocs.io/en/latest/generate-and-template/) that let's you do string interpolation on yml files.
145 | 
146 | 3) Create your pods and services
147 | 
148 | Make sure nothing is up on port `80`, then:
149 | 
150 | ```shell
151 | kubectl create -f ./deployments/api.yml -f ./deployments/front.yml
152 | ```
153 | 
154 | You're good to go, check out [http://localhost](http://localhost)
155 | 
156 | To stop and delete the pods/services you created:
157 | 
158 | ```shell
159 | kubectl delete -f ./deployments/api.yml -f ./deployments/front.yml
160 | ```
161 | 
162 | They won't stop right away, you can list them and see their status with:
163 | 
164 | ```shell
165 | kubectl get pods,services
166 | ```
167 | 
168 | [More commands](#kubernetes-commands)
169 | 
170 | 🖊 `make kube-start`, `make kube-start-no-rebuild`, `make kube-stop`, `make kube-ps`
171 | 
172 | ## Notes
173 | 
174 | ### Docker Multi-stage builds
175 | 
176 | Thanks to [docker multi-stage builds](https://docs.docker.com/develop/develop-images/multistage-build/), the golang application is built in a docker golang:alpine image (which contains all the tooling for golang such as compiler/libs ...) and produces a small image with only a binary in an alpine image (small Linux distrib).
177 | 
178 | The targets for multi-stage build are specified in the `docker*.yml` config files.
179 | 
180 | The [api/Dockerfile](api/Dockerfile) will create such a production image by default.
181 | 
182 | You can tell the difference of weight:
183 | 
184 | ```
185 | docker images
186 | topheman/docker-experiments_api_production      latest  01f1b575fae6  About a minute ago  11.5MB
187 | topheman/docker-experiments_api_development     latest  fff1ef3ec29e  8 minutes ago       426MB
188 | topheman/docker-experiments_front_development   latest  4ed3aea602ef  22 hours ago        225MB
189 | ```
190 | 
191 | ### Docker networks / Kubernetes services
192 | 
193 | In development, the api server in golang is available at [http://localhost:5000](http://localhost:5000) and proxied onto [http://localhost:3000/api](http://localhost:3000/api) (the same port as the front, thanks to create-react-app [proxy](front/README.md#proxy)).
194 | 
195 | In **production** mode, we only want the golang server to be available via `/api` (we don't want to expose it on it's own port).
196 | 
197 | To make it work:
198 | 
199 | * the docker-compose golang api service is named `api` - [see docker-compose.yml](docker-compose.yml).
200 | * the kubernetes services exposing the api is also named `api` - [see deployments/api.yml](deployments/api.yml)
201 | 
202 | That way, the nginx conf can work with both docker-compose AND kubernetes, proxying `http://api` - [see nginx/site.conf](nginx/site.conf).
203 | 
204 | ### Restart on failure
205 | 
206 | If your app exits with a failure code (greater than 0) inside the container, you'll want it to restart (like you would do with pm2 and node apps).
207 | 
208 | With [docker-compose/production](#production---docker-compose), the, directive `restart: on-failure` in the [docker-compose.yml](docker-compose.yml) file will ensure that. You'll be able to check it by clicking on the "exit 1 the api server" button, which will exit the golang api. You'll see that the uptime is back counting from 0 seconds.
209 | 
210 | With [kubernetes/deployment](#deployment---kubernetes), I setup 2 replicas of the api server, so when you retrieve the infos, the hostname might change according of the api pod you're balance on.
211 | 
212 | Exiting one pod won't break the app, it will fallback on the remaining replica. If you exit the two pods, you'll get an error retrieving infos, until one of the pod is back up by kubernetes (check their status with `kubectl get pods`).
213 | 
214 | ### Commands
215 | 
216 | #### Docker commands
217 | 
218 | * `docker-compose run --rm front npm run test`: launch a front container in *development* mode and run tests
219 | * `docker-compose -f ./docker-compose.yml run --rm api <cmd>`: launch an api container in *production* mode and run `<cmd>`
220 | * `docker-compose down`: stop and remove containers, networks, volumes, and images created by `docker-compose up`
221 | 
222 | Don't want to use `docker-compose` (everything bellow is already specified in the `docker*.yml` files - only dropping to remember the syntax for the futur) ?
223 | 
224 | * `docker build ./api -t topheman/docker-experiments_api_production:1.0.1`: build the `api` and tag it as `topheman/docker-experiments_api_production:1.0.1` based on [api/Dockerfile](api/Dockerfile)
225 | * `docker run -d -p 5000:5000 topheman/docker-experiments_api_production:1.0.1`: runs the `topheman/docker-experiments_api_production:1.0.1` image previously created in daemon mode and exposes the ports
226 | * `docker build ./front -t topheman/docker-experiments_front_development:1.0.1`: build the `front` and tag it as `topheman/docker-experiments_front_development:1.0.1` based on [front/Dockerfile](front/Dockerfile)
227 | * `docker run --rm -p 3000:3000 -v $(pwd)/front:/usr/front -v front-deps:/usr/front/node_modules topheman/docker-experiments_front_development:1.0.1`:
228 |   * runs the `topheman/docker-experiments_front_development:1.0.1` image previously created in attach mode
229 |   * exposes the port 3000
230 |   * creates (if not exists) and bind the volumes
231 |   * the container will be removed once you kill the process (`--rm`)
232 | * `docker rmi $(docker images -q --filter="dangling=true")`: remove dangling images (layers that have no more relationships to any tagged image. Tagged as <none>, they no longer serve a purpose and consume disk space)
233 | 
234 | #### Kubernetes commands
235 | 
236 | [kubectl Cheat Sheet](https://kubernetes.io/docs/reference/kubectl/cheatsheet/)
237 | 
238 | * `kubectl create -f ./deployments/api.yml -f ./deployments/front.yml`: creates the resources specified in the declaration files
239 | * `kubectl delete -f ./deployments/api.yml -f ./deployments/front.yml`: deletes resources specified in the declaration files
240 | * `kubectl scale --replicas=3 deployment/docker-experiments-api-deployment`: scales up the api through 3 pods
241 | 
242 | ## FAQ
243 | 
244 | ### CircleCI
245 | 
246 | #### How to use latest version of docker-compose / docker-engine
247 | 
248 | I had the following error on my [first build](https://circleci.com/gh/topheman/docker-experiments/2):
249 | 
250 | > ERROR: Version in "./docker-compose.yml" is unsupported. You might be seeing this error because you're using the wrong Compose file version. Either specify a supported version ("2.0", "2.1", "3.0", "3.1", "3.2") and place your service definitions under the `services` key, or omit the `version` key and place your service definitions at the root of the file to use version 1.
251 | >
252 | > For more on the Compose file format versions, see https://docs.docker.com/compose/compose-file/
253 | 
254 | The reason was because I'm using **docker-compose file format v3.4**, which doesn't seem to be supported by the version of docker-engine used on the default setup of CircleCI - [see compatibility matrix](https://docs.docker.com/compose/compose-file/#compose-and-docker-compatibility-matrix).
255 | 
256 | With CircleCI, in **machine executor mode**, you can change/customize the image your VM will be running (by default: `circleci/classic:latest`) - see the [list of images available](https://circleci.com/docs/2.0/configuration-reference/#machine). I simply changed the image to use:
257 | 
258 | ```diff
259 | version: 2
260 | jobs:
261 |   build:
262 | -    machine: true
263 | +    machine:
264 | +      image: circleci/classic:201808-01
265 | ```
266 | 
267 | Checkout [.circleci/config.yml](.circleci/config.yml)
268 | 
269 | Note: Why use docker-compose file format v3.4 ? To take advantage of the `target` attribute.
270 | 
271 | #### Docker vs Machine executors
272 | 
273 | > You can not build Docker within Docker.
274 | 
275 | To build/push docker images, you have two solutions on CircleCI:
276 | 
277 | * Use the [machine executor mode](https://circleci.com/docs/2.0/executor-types/#using-machine): your jobs will be run in a dedicated, ephemeral Virtual Machine (VM) - so, you can directly run docker inside
278 | * Use the [setup_remote_docker](https://circleci.com/docs/2.0/building-docker-images/#overview) key: a remote environment will be created, and your current primary container will be configured to use it. Then, any docker-related commands you use will be safely executed in this new environment
279 | 
280 | ### Why does /api fallbacks to index.html in production
281 | 
282 | #### Service Worker
283 | 
284 | create-react-app ships with a service worker by default which implementation is based on [sw-precache-webpack-plugin](https://github.com/goldhand/sw-precache-webpack-plugin) (a Webpack plugin that generates a service worker using [sw-precache](https://github.com/GoogleChromeLabs/sw-precache) that will cache webpack's bundles' emitted assets).
285 | 
286 | It means that a `service-worker.js` file will be created at build time, listing your public static assets that the service worker will cache using a [cache first](https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/#cache-falling-back-to-network) strategy (on a request for an asset, will first hit the service worker cache and serve it, then call the network and update the cache - this makes the app fast and offline-first).
287 | 
288 | From the [create-react-app doc](front/README.cra.md#serving-apps-with-client-side-routing):
289 | 
290 | > On a production build, and in a browser that supports [service workers](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers),
291 | the service worker will automatically handle all navigation requests, like for
292 | `/todos/42` or `/api`, by serving the cached copy of your `index.html`. This
293 | service worker navigation routing can be configured or disabled by
294 | [`ejecting`](front/README.cra.md#npm-run-eject) and then modifying the
295 | [`navigateFallback`](https://github.com/GoogleChrome/sw-precache#navigatefallback-string)
296 | and [`navigateFallbackWhitelist`](https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp)
297 | options of the `SWPreachePlugin` [configuration](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/config/webpack.config.prod.js).
298 | 
299 | ## What's next?
300 | 
301 | The next thing that will be comming are:
302 | 
303 | * [x] setup CI
304 | * [x] using [nginx](https://www.nginx.com/) as a reverse-proxy to:
305 |   * [x] serve the golang api which is in its own container on `/api`
306 |   * [x] make a build of the front and serve it at the root
307 | * [x] use [kubernetes](https://kubernetes.io/) to automate deployment
308 |   * [x] start by playing in local with [minikube](https://github.com/kubernetes/minikube)
309 |   * [ ] add [Helm](http://helm.readthedocs.io/en/latest/generate-and-template/) to do string interpolation in yaml description files ?
310 | * [ ] linting / formatting + pre-commit hooks
311 |   * [ ] add linting / formatting support (eslint/prettier) with advanced config for the JavaScript part
312 |   * [ ] back it up with pre-commit hooks (husky ?)
313 |   * The challenge being:
314 |     * any npm dependency is currently installed on a volume mounted inside the front container (not accessible by host)
315 |     * how to elegantly have lint/formatting task also running on host (for vscode plugins for example but also npm tasks like), without relying on global modules (this would be cheating 😉 + we should not assume anything about the computer our project is cloned on)
316 |     * how to elegantly share pre-commit hooks ? (using husky would mean an `npm install` at the root of the project)
317 | 
318 | *This is still in progress*.
319 | 
320 | ## Resources
321 | 
322 | * Docker
323 |   * 📺 💯 [Better understand containers by coding one from scratch by Liz Rice](https://twitter.com/topheman/status/1014936620309647361)
324 |   * 📺 [Create a Development Environment with Docker Compose by Mark Ranallo](https://www.youtube.com/watch?v=Soh2k8lCXCA)
325 |   * 📺 [Rapid Development With Docker Compose](https://www.youtube.com/watch?v=o6SScget37w)
326 |   * [Golang and Docker for development and production](https://medium.com/statuscode/golang-docker-for-development-and-production-ce3ad4e69673) - use [pilu/fresh](https://github.com/pilu/fresh) to rebuild on changes in development
327 |   * [Create the smallest and secured golang docker image based on scratch](https://medium.com/@chemidy/create-the-smallest-and-secured-golang-docker-image-based-on-scratch-4752223b7324)
328 |     * [docker-compose with multi-stage build target (official doc)](https://docs.docker.com/compose/compose-file/#target)
329 | * Kubernetes
330 |   * 📺 [Learn Kubernetes by CoderJourney](https://www.youtube.com/playlist?list=PLbG4OyfwIxjFE5Ban_n2JdGad4EDWmisR)
331 |     * [Source code](https://github.com/coderjourney/meal_plan)
332 |   * 📺 [Run Kubernetes Locally Using Minikube by CoderJourney](https://coderjourney.com/run-kubernetes-locally-using-minikube/)
333 |   * [Setup bash completion for `kubectl`](https://twitter.com/topheman/status/1022939077602156546)
334 | 
335 | More bookmarks from my research:
336 | 
337 | * Docker
338 |   * [Generic Docker Makefile](https://github.com/mvanholsteijn/docker-makefile)
339 |   * [Awesome-docker - A curated list of Docker resources and projects](https://awesome-docker.netlify.com/)
340 | * Kubernetes
341 |   * [Kubernetes & Traefik 101— When Simplicity Matters](https://dev.to/geraldcroes/kubernetes--traefik-101-when-simplicity-matters-6k6)
342 |   * [Tutorial : Getting Started with Kubernetes with Docker on Mac](https://rominirani.com/tutorial-getting-started-with-kubernetes-with-docker-on-mac-7f58467203fd)
343 |   * [kubernetes/dashboard](https://github.com/kubernetes/dashboard)
344 |   * [Kubernetes Ingress](https://medium.com/@cashisclay/kubernetes-ingress-82aa960f658e)
345 |     * [Setting up Nginx Ingress on Kubernetes](https://hackernoon.com/setting-up-nginx-ingress-on-kubernetes-2b733d8d2f45)
346 |     * [Advanced kubernetes ingress](https://koudingspawn.de/advanced-ingress/)
347 |     * [Kubernetes NodePort vs LoadBalancer vs Ingress? When should I use what?](https://medium.com/google-cloud/kubernetes-nodeport-vs-loadbalancer-vs-ingress-when-should-i-use-what-922f010849e0)
348 |   * [Kubectl apply vs kubectl create?](https://stackoverflow.com/questions/47369351/kubectl-apply-vs-kubectl-create)
349 |   * [awesome-kubernetes - A curated list for awesome kubernetes sources](https://ramitsurana.github.io/awesome-kubernetes/)
350 | * [Tutoriel Linux : Makefile](https://youtu.be/2VV9FAQWHdw)
351 | 
352 | ## Author
353 | 
354 | [Christophe Rosset](https://github.com/topheman)


--------------------------------------------------------------------------------
/front/src/assets/images/gopher.svg:
--------------------------------------------------------------------------------
 1 | <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 253 343" version="1.1">
 2 |     <title>Gopher</title>
 3 |     <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
 4 |         <g id="Artboard-3" transform="translate(-173.000000, -107.000000)">
 5 |             <g id="Group" transform="translate(173.000000, 107.000000)">
 6 |                 <path d="M27.7962368,66.4506094 C-10.693394,55.6177154 17.9269534,6.61030587 48.8350901,26.767692 L27.7962368,66.4506094 L27.7962368,66.4506094 Z" id="Shape" fill="#6AD7E5"></path>
 7 |                 <path d="M198.948119,22.8256403 C229.41389,1.40837761 256.944601,49.7296271 221.537486,61.8875638 L198.948119,22.8256403 L198.948119,22.8256403 Z" id="Shape" fill="#6AD7E5"></path>
 8 |                 <path d="M29.7062751,52.8460648 C24.6283274,50.1576467 20.9030096,46.5064324 24.0091433,40.6280732 C26.8848384,35.1860709 32.2270564,35.7770374 37.3056424,38.4654555 L29.7062751,52.8460648 L29.7062751,52.8460648 Z" id="Shape" fill="#000000"></path>
 9 |                 <path d="M213.808246,47.4036047 C218.886194,44.7151866 222.611512,41.0639723 219.505378,35.1856131 C216.629683,29.7436108 211.287465,30.3345772 206.208879,33.0229954 L213.808246,47.4036047 L213.808246,47.4036047 Z" id="Shape" fill="#000000"></path>
10 |                 <path d="M233.64397,30.512207 C240.397429,42.2867025 236.169024,55.2774852 221.050341,60.4688706 L222.835992,61.1366426 L200.246625,22.0747192 L199.810777,24.0527595 C212.855368,14.8824867 226.851975,18.6705242 233.64397,30.512207 Z M196.96232,22.3880828 L197.649613,23.5765615 L220.23898,62.6384849 L220.857008,63.7071898 L222.02463,63.3062569 C238.989296,57.4810061 243.906308,42.374641 236.246299,29.0195976 C228.605851,15.6986566 212.628805,11.3746337 198.085461,21.5985211 L196.96232,22.3880828 Z" id="Shape" fill="#000000"></path>
11 |                 <path d="M13.6003061,35.7206178 C20.3237064,23.712761 34.7614327,19.3800685 48.0156911,28.0241097 L47.5098262,26.0650715 L26.4709729,65.7479889 L28.2026223,65.0067082 C11.774369,60.3829816 6.87597447,47.7301379 13.6003061,35.7206178 Z M28.5546802,68.2223514 L29.1215007,67.1532299 L50.160354,27.4703126 L50.8021614,26.2597528 L49.6544891,25.5112744 C34.8847339,15.8788704 18.5224571,20.7891114 10.9826952,34.2549735 C3.32684259,47.9281712 9.05927136,62.7353749 27.3898512,67.8945106 L28.5546802,68.2223514 Z" id="Shape" fill="#000000"></path>
12 |                 <path d="M4.3612324,185.706428 C4.84891965,195.769468 14.8931066,191.113292 19.4425137,187.967433 C23.7608438,184.980657 25.0234686,187.463355 25.4026391,181.569024 C25.650951,177.694839 26.0971466,173.820655 25.8775596,169.931138 C19.3474019,169.338893 12.2446584,170.895212 6.89095041,174.787923 C4.13334713,176.793376 -1.03715902,183.194341 4.3612324,185.706428" id="Shape" fill="#F6D2A2"></path>
13 |                 <path d="M4.72278505,185.669316 C6.18457012,185.124988 7.73380697,184.738464 8.72577814,183.415338" id="Shape" stroke="#000000" stroke-width="3" fill="#C6B198"></path>
14 |                 <path d="M10.5210754,193.283498 C13.5561091,192.994173 17.2106369,191.334439 20.2956444,189.201195 C20.9800287,188.72784 21.6068158,188.385328 22.2499897,188.110349 C22.4976753,188.004456 22.7400322,187.911357 23.0357978,187.80599 C23.0791988,187.790529 23.6265203,187.599607 23.7818347,187.542397 C25.9755856,186.734325 26.6558062,185.45432 26.8995451,181.665317 C26.9464658,180.933256 26.9891499,180.347478 27.0898068,179.019221 C27.4342435,174.474071 27.5212097,172.433286 27.3751749,169.846588 L27.302211,168.554188 L26.0130441,168.437269 C18.8528239,167.787882 11.4724827,169.602066 6.00882536,173.574723 C4.18336813,174.902277 2.17310068,177.25224 1.19695486,179.447803 C-0.221552469,182.638333 0.461577819,185.546217 3.72838634,187.066393 L4.99407846,184.346462 C3.3862522,183.598277 3.12646085,182.492422 3.93823193,180.666573 C4.6877912,178.980652 6.35342911,177.033554 7.77318578,176.001044 C12.6228347,172.474836 19.2784575,170.838797 25.7420751,171.425006 L24.3799444,170.015687 C24.5160516,172.426538 24.432853,174.378911 24.098384,178.792528 C23.9968469,180.132401 23.9536018,180.725877 23.9057106,181.47308 C23.7302204,184.201133 23.6223687,184.404083 22.7448901,184.727304 C22.6185732,184.773833 22.0939825,184.956826 22.0290246,184.979967 C21.6794984,185.104486 21.3820063,185.218764 21.070651,185.351879 C20.2463377,185.7043 19.4428395,186.143378 18.5892466,186.733766 C15.8880583,188.601604 12.6646145,190.065557 10.2363808,190.297037 C7.46796465,190.560946 6.03872063,189.332431 5.85947398,185.633818 L2.86299081,185.779037 C3.12533871,191.192379 6.05359279,193.709376 10.5210754,193.283498 Z" id="Shape" fill="#000000"></path>
15 |                 <path d="M4.72278505,185.669316 C6.18457012,185.124988 7.73380697,184.738464 8.72577814,183.415338" id="Shape" stroke="#000000" stroke-width="3" fill="#C6B198"></path>
16 |                 <path d="M205.877235,309.498997 C213.61576,314.291256 227.760605,328.781753 216.151861,335.808184 C204.997611,346.029668 198.754704,324.588766 188.964574,321.617962 C193.18077,315.887185 198.524903,310.661764 205.877235,309.498997 L205.877235,309.498997 Z" id="Shape" fill="#F6D2A2"></path>
17 |                 <path d="M216.982695,322.58612 C220.120027,327.827926 219.812777,331.838974 215.37515,334.524939 L215.248014,334.60189 L215.138449,334.702293 C210.494581,338.957821 207.323966,337.573081 201.170648,330.424395 C200.979502,330.202328 200.7796,329.968759 200.540659,329.688544 C200.392631,329.514946 200.224152,329.317033 199.905947,328.943193 C195.209681,323.428252 192.807329,321.216502 189.400135,320.182592 L190.17281,322.506875 C195.092091,315.820445 200.078347,311.93473 206.111547,310.980584 L205.087496,310.774266 C209.392777,313.440411 214.362279,318.207967 216.982695,322.58612 Z M206.193268,307.930374 L205.642924,308.017411 C198.679329,309.118699 193.098624,313.467659 187.756338,320.729049 L186.499441,322.437461 L188.529012,323.053332 C191.162458,323.852448 193.329537,325.847592 197.621881,330.888197 C197.939457,331.261299 198.108921,331.460368 198.257892,331.635073 C198.499612,331.918547 198.702385,332.155472 198.896949,332.381508 C202.202125,336.221334 204.341464,338.201012 206.871552,339.306007 C210.285473,340.797008 213.716196,340.074726 217.165273,336.914076 L216.928572,337.09143 C223.00275,333.414909 223.451777,327.553015 219.556852,321.045433 C216.673782,316.228442 211.358223,311.128891 206.666975,308.223728 L206.193268,307.930374 Z" id="Shape" fill="#000000"></path>
18 |                 <path d="M215.925451,332.120961 C215.89318,332.034208 215.89318,332.034208 215.860834,331.947221 C214.450026,328.153415 213.603079,326.490542 211.786121,324.744747 L209.707587,326.908008 C211.091468,328.237688 211.792447,329.613971 213.048964,332.992874 C213.081312,333.079864 213.081312,333.079864 213.113764,333.167104 C213.738532,334.846274 214.087714,335.706581 214.578317,336.682984 L217.258957,335.336072 C216.832491,334.487316 216.513282,333.700856 215.925451,332.120961 Z" id="Shape" fill="#000000"></path>
19 |                 <path d="M66.9346229,325.784068 C57.8517671,327.190887 52.7393493,335.392224 45.1674303,339.5571 C38.0321319,343.815253 35.3026153,338.193724 34.6598128,337.05268 C33.5414515,336.542213 33.6352866,337.528009 31.9092312,335.788331 C25.2948134,325.340044 38.8013244,317.702841 45.8344895,312.512559 C55.6303644,310.530745 61.7692234,319.03044 66.9346229,325.784068 L66.9346229,325.784068 Z" id="Shape" fill="#F6D2A2"></path>
20 |                 <path d="M52.1620433,332.472002 C52.0641864,332.555653 52.0641864,332.555653 51.9664278,332.639224 C48.3761319,335.708395 46.6817835,337.012204 44.4445095,338.242799 C40.896649,340.358986 38.7268594,339.942874 37.0814682,338.018321 C36.8328768,337.727553 36.6093887,337.413817 36.3985365,337.071925 C36.3170127,336.939736 36.2405067,336.808619 36.157873,336.661204 C36.120385,336.594327 35.993808,336.364562 35.9667036,336.316449 L35.7269796,335.890912 L35.2826615,335.688107 C34.7127981,335.427997 34.3042239,335.369241 33.7460512,335.386542 C33.6226811,335.335824 33.3651345,335.126017 32.9740521,334.731848 L33.176615,334.985998 C29.5104357,329.194817 32.3430682,324.25643 40.8267558,317.946448 C42.014686,317.062892 46.0389564,314.225899 46.725172,313.719491 L46.13193,313.982773 C52.5279686,312.688783 57.2677844,315.840319 63.4746213,323.745953 C63.8257356,324.193166 64.1870438,324.660278 64.6216869,325.227531 C64.8570699,325.534729 65.6467,326.569221 65.7431593,326.695339 L66.7050295,324.301743 C61.651728,325.084436 58.418612,327.12405 52.1620433,332.472002 Z M69.6610103,326.879671 L68.1260864,324.872797 C68.0311893,324.748722 67.2404364,323.712758 67.0030131,323.402898 C66.5617708,322.827033 66.1936356,322.351094 65.8342624,321.893362 C58.9908118,313.176874 53.3908637,309.453431 45.5370489,311.042345 L45.2112569,311.108256 L44.9438069,311.305627 C44.2941589,311.785049 40.2637412,314.626376 39.0363554,315.539279 C34.8258531,318.670958 32.0195277,321.373897 30.3000871,324.371555 C28.0321237,328.325502 28.0121049,332.436662 30.6418475,336.590664 L30.729281,336.728776 L30.8444104,336.844814 C31.9931153,338.002585 32.7474196,338.405219 33.7323584,338.387895 C33.9754999,338.380871 33.9488632,338.37704 34.0369642,338.417253 L34.6598128,337.05268 L33.3529221,337.788911 C33.3711647,337.821294 33.4956757,338.047308 33.5409702,338.128112 C33.6426163,338.309444 33.7395139,338.475509 33.845086,338.646692 C34.1323593,339.112499 34.4439499,339.549915 34.8012266,339.967808 C37.3752477,342.978544 41.1486607,343.702193 45.9361154,340.845169 C48.3664762,339.509427 50.1707127,338.121058 53.9157885,334.919574 C54.0136003,334.835956 54.0136003,334.835956 54.1113015,334.752439 C59.9574681,329.755288 62.8414301,327.935938 67.1642162,327.266393 L69.6610103,326.879671 Z" id="Shape" fill="#000000"></path>
21 |                 <path d="M34.6734206,337.656294 C35.0193977,333.674139 38.1740448,331.007443 39.6766833,327.640531" id="Shape" stroke="#000000" stroke-width="3"></path>
22 |                 <path d="M248.658883,184.799351 C248.171196,194.862392 238.127009,190.206215 233.577602,187.060357 C229.259272,184.07358 227.996647,186.556278 227.617477,180.661947 C227.369165,176.787763 226.922969,172.913578 227.142556,169.024061 C233.672714,168.431817 240.775457,169.988135 246.129165,173.880847 C248.88613,175.886299 254.057275,182.287265 248.658883,184.799351" id="Shape" fill="#F6D2A2"></path>
23 |                 <path d="M242.783735,189.38996 C240.355501,189.158481 237.132057,187.694527 234.430733,185.826595 C233.577276,185.236301 232.773778,184.797224 231.949465,184.444802 C231.638109,184.311687 231.340617,184.197409 230.991091,184.07289 C230.926133,184.049749 230.401542,183.866757 230.275226,183.820228 C229.397747,183.497007 229.289895,183.294057 229.114383,180.565654 C229.066514,179.818801 229.023269,179.225325 228.921732,177.885451 C228.587263,173.471834 228.504064,171.519461 228.640171,169.10861 L227.278041,170.51793 C233.741658,169.93172 240.397281,171.567759 245.24704,175.094047 C246.666482,176.126568 248.33207,178.073681 249.081663,179.759538 C249.893523,181.585436 249.633802,182.691229 248.026037,183.439386 L249.291729,186.159316 C252.55856,184.63913 253.241543,181.731248 251.822903,178.540684 C250.846755,176.345299 248.83665,173.995437 247.011534,172.667824 C241.547633,168.69499 234.167292,166.880805 227.007072,167.530192 L225.717905,167.647111 L225.644941,168.939511 C225.498906,171.526209 225.585872,173.566994 225.930309,178.112145 C226.030966,179.440401 226.07365,180.026179 226.120548,180.757891 C226.36431,184.547243 227.04453,185.827248 229.238281,186.63532 C229.393595,186.69253 229.940917,186.883452 229.984318,186.898914 C230.280083,187.004281 230.52244,187.097379 230.770126,187.203273 C231.4133,187.478251 232.040087,187.820764 232.724335,188.294024 C235.809479,190.427363 239.464007,192.087096 242.49904,192.376421 C246.966523,192.802299 249.894777,190.285302 250.157125,184.871961 L247.160642,184.726741 C246.981395,188.425354 245.552151,189.653869 242.783735,189.38996 Z" id="Shape" fill="#000000"></path>
24 |                 <path d="M248.330863,184.762239 C246.869078,184.217911 245.319841,183.831387 244.32787,182.508261" id="Shape" stroke="#000000" stroke-width="3" fill="#C6B198"></path>
25 |                 <path d="M122.791377,2 C161.324414,2 197.446464,7.51547383 216.276681,44.5681114 C233.178491,86.0993162 227.167938,130.883711 229.745531,174.776227 C231.959273,212.465191 236.867424,256.00696 219.398135,290.932757 C201.020497,327.677453 155.098742,336.920807 117.26468,335.567015 C87.5470367,334.502636 51.6477657,324.799287 34.8755374,297.624414 C15.1982507,265.74417 24.5140985,218.340356 25.9433285,182.867036 C27.6361905,140.847086 14.5714066,98.6993596 28.3638914,57.5815119 C42.67215,14.9277902 81.2607226,5.28832894 122.791377,2 L122.791377,2 Z" id="Shape" fill="#6AD7E5"></path>
26 |                 <path d="M130.038516,53.8364219 C136.95678,94.0879449 202.694979,83.4454379 193.252741,42.8495572 C184.785877,6.44602441 127.739236,16.5224814 130.038516,53.8364219" id="Shape" fill="#FFFFFF"></path>
27 |                 <path d="M168.021346,80.0947836 C187.02829,76.9067222 199.189352,61.9549721 194.668987,42.520151 C185.799096,4.38379088 126.177907,14.8262592 128.587218,53.9258507 L131.489813,53.7469932 C129.295389,18.1346974 183.791635,8.58984712 191.836492,43.1789533 C195.945533,60.8453294 185.004152,74.2975095 167.540287,77.2267482 C150.095818,80.1527336 134.490961,71.157497 131.471553,53.5901175 L128.605478,54.0827264 C131.918985,73.3612143 149.104675,83.2677036 168.021346,80.0947836 Z" id="Shape" fill="#000000"></path>
28 |                 <path d="M50.8399616,60.5672311 C59.8066406,95.6099439 115.863226,86.638115 113.75034,51.4867922 C111.218707,9.38762068 42.2671347,17.5110134 50.8399616,60.5672311" id="Shape" fill="#FFFFFF"></path>
29 |                 <path d="M115.158498,51.4021502 C113.94886,31.2867729 97.3664075,20.1614671 77.948473,22.6948961 C58.4054414,25.2446462 45.3825739,40.3821977 49.4564195,60.8427051 L52.2235036,60.2917572 C48.4926804,41.554048 60.2870633,27.8444655 78.3134834,25.4925854 C96.2231849,23.1559333 111.239239,33.2303293 112.342183,51.5714716 C114.365996,85.2409176 60.6935453,93.385275 52.2066304,60.2175299 L49.4732928,60.9169324 C58.8050274,97.3863203 117.388194,88.4968018 115.158498,51.4021502 Z" id="Shape" fill="#000000"></path>
30 |                 <path d="M137.823115,102.89689 C137.852478,108.129978 139.011054,114.005143 138.022275,119.572366 C136.687518,122.09723 134.069072,122.364283 131.811923,123.384579 C128.690469,122.894556 126.065639,120.843104 124.813866,117.920854 C124.012757,111.566528 125.112606,105.414088 125.314958,99.0572057 L137.823115,102.89689 L137.823115,102.89689 Z" id="Shape" fill="#FFFFFF"></path>
31 |                 <path d="M136.625938,108.609803 C136.827044,111.282786 136.902676,112.580895 136.918606,114.109565 C136.938753,116.042958 136.825168,117.734785 136.545388,119.31006 L136.696173,118.871329 C136.090343,120.017333 135.303397,120.495389 133.044537,121.300139 C132.937598,121.338229 132.937598,121.338229 132.829414,121.376833 C132.104509,121.635791 131.665033,121.804848 131.194071,122.017736 L132.044552,121.902727 C129.435494,121.493143 127.242172,119.780226 126.192689,117.330222 L126.302085,117.73323 C125.962408,115.038942 125.949593,112.294293 126.181339,108.644029 C126.240904,107.705819 126.295511,106.973985 126.431076,105.240663 C126.667005,102.224086 126.759065,100.836944 126.814199,99.1049294 L124.87477,100.491163 L137.382926,104.330848 L136.323138,102.905307 C136.331799,104.448774 136.40166,105.628827 136.625938,108.609803 Z M139.316907,101.786362 L138.263303,101.462933 L125.755147,97.6232481 L123.878185,97.0470689 L123.815718,99.0094819 C123.762534,100.680229 123.672567,102.035826 123.440209,105.006745 C123.303488,106.754858 123.248178,107.496107 123.187367,108.453949 C122.944679,112.276556 122.958305,115.194757 123.325646,118.108479 L123.35202,118.317671 L123.435043,118.511487 C124.890099,121.908297 127.947914,124.296356 131.579293,124.86643 L132.021702,124.935882 L132.429774,124.751422 C132.807005,124.580903 133.185546,124.435286 133.838643,124.20198 C133.944417,124.164236 133.944417,124.164236 134.051342,124.126151 C136.976781,123.083924 138.281663,122.291231 139.348377,120.273403 L139.458105,120.065838 L139.499162,119.834672 C139.814667,118.058252 139.940401,116.185469 139.918443,114.078304 C139.901626,112.46452 139.823341,111.120871 139.617483,108.384729 C139.398666,105.476338 139.331219,104.337067 139.323091,102.888474 L139.316907,101.786362 Z" id="Shape" fill="#000000"></path>
32 |                 <ellipse id="Oval" fill="#000000" cx="66.2375327" cy="55.1128352" rx="9.46585625" ry="10.261733"></ellipse>
33 |                 <ellipse id="Oval" fill="#FFFFFF" cx="70.5430962" cy="57.4287847" rx="2.23161599" ry="2.60791893"></ellipse>
34 |                 <ellipse id="Oval" fill="#000000" cx="145.355968" cy="52.3916051" rx="9.30818773" ry="10.261733"></ellipse>
35 |                 <ellipse id="Oval" fill="#FFFFFF" cx="149.590038" cy="54.7075547" rx="2.19459261" ry="2.60791893"></ellipse>
36 |                 <path d="M110.354455,101.739372 C106.224433,111.757051 112.657564,131.789217 123.863519,117.013778 C123.06241,110.659451 124.162259,104.507011 124.364611,98.150129 L110.354455,101.739372 L110.354455,101.739372 Z" id="Shape" fill="#FFFFFF"></path>
37 |                 <path d="M110.051934,119.411696 C113.503995,125.523381 119.383508,125.403104 125.058673,117.920204 L125.428236,117.432922 L125.351738,116.826153 C125.012061,114.131865 124.999246,111.387217 125.230993,107.736952 C125.290557,106.798742 125.345164,106.066908 125.480729,104.333587 C125.716658,101.317009 125.808719,99.9298674 125.863852,98.1978527 L125.927406,96.2013166 L123.99235,96.6970557 L109.982194,100.286298 L109.254145,100.472816 L108.967686,101.167644 C106.765636,106.508882 107.282418,114.508419 110.051934,119.411696 Z M110.726715,103.192445 L124.736872,99.6032022 L122.865371,98.1024052 C122.812188,99.7731519 122.72222,101.128749 122.489862,104.099668 C122.353141,105.847781 122.297831,106.58903 122.23702,107.546872 C121.994332,111.369479 122.007958,114.287681 122.3753,117.201402 L122.668365,116.107352 C118.219476,121.973366 114.981727,122.0396 112.664057,117.936292 C110.34588,113.832087 109.891458,106.797846 111.741223,102.311099 L110.726715,103.192445 Z" id="Shape" fill="#000000"></path>
38 |                 <path d="M111.785398,82.8676838 C104.087727,83.5244552 97.7956676,92.6847545 101.798022,99.9316003 C107.09811,109.530173 118.928356,99.0825252 126.296646,100.061293 C134.776915,100.23507 141.725181,109.035678 148.536206,101.652111 C156.111317,93.4399138 145.274957,85.441742 136.805541,81.8659159 L111.785398,82.8676838 L111.785398,82.8676838 Z" id="Shape" fill="#F6D2A2"></path>
39 |                 <path d="M100.48497,100.656785 C102.20504,103.771868 104.703753,105.321054 107.876337,105.501318 C110.228773,105.634982 112.595844,105.100779 116.334919,103.833227 C116.67666,103.717376 117.001088,103.6058 117.523448,103.425031 C122.333519,101.760446 124.208005,101.297024 126.099129,101.548232 L126.265915,101.560979 C128.499708,101.606753 130.444861,102.196757 134.066422,103.712206 C138.209527,105.445895 139.547061,105.907755 141.666458,106.068347 C144.646724,106.294169 147.262871,105.244762 149.638752,102.669162 C153.658748,98.3110745 153.455572,93.5114963 149.851902,89.0746816 C147.114102,85.7039214 142.453723,82.6223911 137.388978,80.4840328 L137.080312,80.3537126 L136.745531,80.3671167 L111.725388,81.3688847 C102.606733,82.1453649 96.0736293,92.669411 100.48497,100.656785 Z M136.86555,83.364715 L136.222103,83.247799 C140.872877,85.2113767 145.141827,88.034087 147.523241,90.966067 C150.240481,94.3115151 150.373264,97.4482278 147.433641,100.635081 C144.321337,104.009009 142.155114,103.844869 135.224477,100.944732 C131.269107,99.2896007 129.053178,98.6174649 126.327378,98.5616083 L126.494164,98.5743547 C123.940218,98.2351007 121.863725,98.7484638 116.542348,100.589993 C116.025545,100.768839 115.706003,100.878734 115.371754,100.992045 C108.410935,103.351773 105.302512,103.175155 103.111139,99.2065308 C99.802799,93.2163004 104.929314,84.9581002 111.912915,84.3622537 L136.86555,83.364715 Z" id="Shape" fill="#231F20"></path>
40 |                 <path d="M110.816406,82.4664655 C110.246374,69.1195683 135.671859,67.4508069 138.674583,78.6229476 C141.669646,89.7688941 112.06818,92.3576466 110.816406,82.4664655 C109.817414,74.5679595 110.816406,82.4664655 110.816406,82.4664655 L110.816406,82.4664655 Z" id="Shape" fill="#000000"></path>
41 |                 <path d="M176.400844,10.7956538 C193.490047,17.1356502 206.2489,28.1470897 214.939456,45.2476916 C220.537726,59.0177125 223.901628,73.9206274 225.648778,91.1236406 C226.9768,104.199792 227.285567,114.795245 227.414037,138.769455 C227.434423,142.57364 227.444454,144.260268 227.460755,146.372628 C227.551859,158.178313 227.759921,166.551028 228.24811,174.864163 C228.440145,178.133557 228.523169,179.440811 229.024599,187.208695 C230.099388,203.858745 230.522854,212.487104 230.595172,222.43952 C230.797636,250.302461 227.256618,271.868421 218.056592,290.26174 C209.648165,307.073754 194.900828,318.927006 175.114621,326.127249 C158.212242,332.278061 138.120312,334.812319 117.31832,334.067974 C81.5695802,332.787584 50.6554504,320.335535 36.1519917,296.836591 C26.4810154,281.168116 23.2447442,261.191734 24.1377656,233.667762 C24.3825564,226.123022 24.8296243,219.362617 25.8004151,207.111374 C26.9022013,193.206987 27.1905793,189.170446 27.4421125,182.927423 C27.6224619,178.450818 27.643482,173.818662 27.5199983,168.912292 C27.3035696,160.312945 26.8235339,153.405309 25.5272179,138.040508 C23.8149943,117.746093 23.2912857,108.828008 23.5030657,97.6975761 C23.7816545,83.0558911 25.7053022,70.2238788 29.7860159,58.0585463 C36.3905237,38.370138 48.4820411,24.9795421 66.0296106,16.3755466 C80.7170383,9.17394747 98.5952103,5.42050727 122.909774,3.49532008 C145.50332,3.5 162.135739,5.50338163 176.400844,10.7956538 Z M64.708861,13.6819207 C46.4555835,22.6319418 33.8066685,36.6398206 26.9417727,57.1044599 C22.7558113,69.5835548 20.7876445,82.7125388 20.5036086,97.6405051 C20.2892013,108.909021 20.8168919,117.894914 22.5378385,138.292719 C23.8292001,153.598797 24.3064977,160.467033 24.520948,168.987772 C24.6428535,173.831438 24.6221279,178.398702 24.4445443,182.806655 C24.1952187,188.994887 23.9080482,193.014525 22.8097894,206.874396 C21.8354864,219.169964 21.3860822,225.965697 21.1393434,233.570477 C20.2289097,261.631116 23.5500248,282.13121 33.5990997,298.412263 C48.7329438,322.932577 80.5627263,335.753445 117.21099,337.066054 C138.373071,337.823283 158.8415,335.241537 176.140512,328.946389 C196.603807,321.499751 211.96079,309.156494 220.739699,291.603732 C230.188053,272.713936 233.80069,250.711796 233.595093,222.417721 C233.522233,212.390771 233.096718,203.720651 232.018368,187.015442 C231.517406,179.254807 231.434492,177.949285 231.24295,174.688272 C230.758358,166.436398 230.55141,158.108502 230.460666,146.349478 C230.444389,144.240263 230.434367,142.555204 230.413994,138.753379 C230.285008,114.682948 229.974396,104.024171 228.633424,90.8205179 C226.859232,73.3512238 223.433573,58.1747154 217.666034,44.0026914 C208.573674,26.0998652 195.225248,14.5795981 177.44433,7.98297944 C162.776811,2.54141402 145.82864,0.5 122.791377,0.5 C98.0145064,2.45709732 79.8043613,6.28023376 64.708861,13.6819207 Z" id="Shape" fill="#000000"></path>
42 |             </g>
43 |         </g>
44 |     </g>
45 | </svg>
46 | 


--------------------------------------------------------------------------------