├── .gitignore ├── LICENSE ├── README.md ├── deploy.sh ├── docker-compose.yml ├── kubernetes ├── flask-deployment.yml ├── flask-service.yml ├── minikube-ingress.yml ├── persistent-volume-claim.yml ├── persistent-volume.yml ├── postgres-deployment.yml ├── postgres-service.yml ├── secret.yml ├── vue-deployment.yml └── vue-service.yml └── services ├── client ├── .babelrc ├── .editorconfig ├── .eslintignore ├── .eslintrc.js ├── .postcssrc.js ├── Dockerfile ├── Dockerfile-minikube ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── logo.png │ ├── utils.js │ ├── vue-loader.conf.js │ ├── webpack.base.conf.js │ ├── webpack.dev.conf.js │ └── webpack.prod.conf.js ├── config │ ├── dev.env.js │ ├── index.js │ └── prod.env.js ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── App.vue │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── Alert.vue │ │ ├── Books.vue │ │ ├── HelloWorld.vue │ │ └── Ping.vue │ ├── main.js │ └── router │ │ └── index.js └── static │ └── .gitkeep ├── db ├── Dockerfile └── create.sql └── server ├── .dockerignore ├── Dockerfile ├── entrypoint.sh ├── manage.py ├── project ├── __init__.py ├── api │ ├── __init__.py │ ├── books.py │ └── models.py └── config.py └── requirements.txt /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | /dist/ 4 | env/ 5 | __pycache__ 6 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 Michael Herman 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Running Flask on Kubernetes 2 | 3 | ## Want to learn how to build this? 4 | 5 | Check out the [post](https://testdriven.io/running-flask-on-kubernetes). 6 | 7 | ## Want to use this project? 8 | 9 | ### Docker 10 | 11 | Build the images and spin up the containers: 12 | 13 | ```sh 14 | $ docker-compose up -d --build 15 | ``` 16 | 17 | Run the migrations and seed the database: 18 | 19 | ```sh 20 | $ docker-compose exec server python manage.py recreate_db 21 | $ docker-compose exec server python manage.py seed_db 22 | ``` 23 | 24 | Test it out at: 25 | 26 | 1. [http://localhost:8080/](http://localhost:8080/) 27 | 1. [http://localhost:5001/books/ping](http://localhost:5001/books/ping) 28 | 1. [http://localhost:5001/books](http://localhost:5001/books) 29 | 30 | ### Kubernetes 31 | 32 | #### Minikube 33 | 34 | Install and run [Minikube](https://kubernetes.io/docs/setup/minikube/): 35 | 36 | 1. Install a [Hypervisor](https://kubernetes.io/docs/tasks/tools/install-minikube/#install-a-hypervisor) (like [VirtualBox](https://www.virtualbox.org/wiki/Downloads) or [HyperKit](https://github.com/moby/hyperkit)) to manage virtual machines 37 | 1. Install and Set Up [kubectl](https://kubernetes.io/docs/tasks/tools/install-kubectl/) to deploy and manage apps on Kubernetes 38 | 1. Install [Minikube](https://github.com/kubernetes/minikube/releases) 39 | 40 | Start the cluster: 41 | 42 | ```sh 43 | $ minikube start --vm-driver=virtualbox 44 | $ minikube dashboard 45 | ``` 46 | 47 | #### Volume 48 | 49 | Create the volume: 50 | 51 | ```sh 52 | $ kubectl apply -f ./kubernetes/persistent-volume.yml 53 | ``` 54 | 55 | Create the volume claim: 56 | 57 | ```sh 58 | $ kubectl apply -f ./kubernetes/persistent-volume-claim.yml 59 | ``` 60 | 61 | #### Secrets 62 | 63 | Create the secret object: 64 | 65 | ```sh 66 | $ kubectl apply -f ./kubernetes/secret.yml 67 | ``` 68 | 69 | #### Postgres 70 | 71 | Create deployment: 72 | 73 | ```sh 74 | $ kubectl create -f ./kubernetes/postgres-deployment.yml 75 | ``` 76 | 77 | Create the service: 78 | 79 | ```sh 80 | $ kubectl create -f ./kubernetes/postgres-service.yml 81 | ``` 82 | 83 | Create the database: 84 | 85 | ```sh 86 | $ kubectl get pods 87 | $ kubectl exec postgres- --stdin --tty -- createdb -U postgres books 88 | ``` 89 | 90 | #### Flask 91 | 92 | Build and push the image to Docker Hub: 93 | 94 | ```sh 95 | $ docker build -t mjhea0/flask-kubernetes ./services/server 96 | $ docker push mjhea0/flask-kubernetes 97 | ``` 98 | 99 | > Make sure to replace `mjhea0` with your Docker Hub namespace in the above commands as well as in *kubernetes/flask-deployment.yml* 100 | 101 | Create the deployment: 102 | 103 | ```sh 104 | $ kubectl create -f ./kubernetes/flask-deployment.yml 105 | ``` 106 | 107 | Create the service: 108 | 109 | ```sh 110 | $ kubectl create -f ./kubernetes/flask-service.yml 111 | ``` 112 | 113 | Apply the migrations and seed the database: 114 | 115 | ```sh 116 | $ kubectl get pods 117 | $ kubectl exec flask- --stdin --tty -- python manage.py recreate_db 118 | $ kubectl exec flask- --stdin --tty -- python manage.py seed_db 119 | ``` 120 | 121 | #### Ingress 122 | 123 | Enable and apply: 124 | 125 | ```sh 126 | $ minikube addons enable ingress 127 | $ kubectl apply -f ./kubernetes/minikube-ingress.yml 128 | ``` 129 | 130 | Add entry to */etc/hosts* file: 131 | 132 | ``` 133 | hello.world 134 | ``` 135 | 136 | Try it out: 137 | 138 | 1. [http://hello.world/books/ping](http://hello.world/books/ping) 139 | 1. [http://hello.world/books](http://hello.world/books) 140 | 141 | 142 | #### Vue 143 | 144 | Build and push the image to Docker Hub: 145 | 146 | ```sh 147 | $ docker build -t mjhea0/vue-kubernetes ./services/client \ 148 | -f ./services/client/Dockerfile-minikube 149 | 150 | $ docker push mjhea0/vue-kubernetes 151 | ``` 152 | 153 | > Again, replace `mjhea0` with your Docker Hub namespace in the above commands as well as in *kubernetes/vue-deployment.yml* 154 | 155 | Create the deployment: 156 | 157 | ```sh 158 | $ kubectl create -f ./kubernetes/vue-deployment.yml 159 | ``` 160 | 161 | Create the service: 162 | 163 | ```sh 164 | $ kubectl create -f ./kubernetes/vue-service.yml 165 | ``` 166 | 167 | Try it out at [http://hello.world/](http://hello.world/). 168 | -------------------------------------------------------------------------------- /deploy.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | 4 | echo "Creating the volume..." 5 | 6 | kubectl apply -f ./kubernetes/persistent-volume.yml 7 | kubectl apply -f ./kubernetes/persistent-volume-claim.yml 8 | 9 | 10 | echo "Creating the database credentials..." 11 | 12 | kubectl apply -f ./kubernetes/secret.yml 13 | 14 | 15 | echo "Creating the postgres deployment and service..." 16 | 17 | kubectl create -f ./kubernetes/postgres-deployment.yml 18 | kubectl create -f ./kubernetes/postgres-service.yml 19 | 20 | 21 | 22 | echo "Creating the flask deployment and service..." 23 | 24 | kubectl create -f ./kubernetes/flask-deployment.yml 25 | kubectl create -f ./kubernetes/flask-service.yml 26 | 27 | 28 | echo "Adding the ingress..." 29 | 30 | minikube addons enable ingress 31 | kubectl delete -A ValidatingWebhookConfiguration ingress-nginx-admission 32 | kubectl apply -f ./kubernetes/minikube-ingress.yml 33 | 34 | 35 | echo "Creating the vue deployment and service..." 36 | 37 | kubectl create -f ./kubernetes/vue-deployment.yml 38 | kubectl create -f ./kubernetes/vue-service.yml 39 | -------------------------------------------------------------------------------- /docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: '3.8' 2 | 3 | services: 4 | 5 | server: 6 | build: 7 | context: ./services/server 8 | dockerfile: Dockerfile 9 | ports: 10 | - 5001:5000 11 | environment: 12 | - FLASK_ENV=development 13 | - APP_SETTINGS=project.config.DevelopmentConfig 14 | - POSTGRES_USER=postgres 15 | - POSTGRES_PASSWORD=postgres 16 | depends_on: 17 | - postgres 18 | 19 | postgres: 20 | build: 21 | context: ./services/db 22 | dockerfile: Dockerfile 23 | expose: 24 | - 5432 25 | environment: 26 | - POSTGRES_USER=postgres 27 | - POSTGRES_PASSWORD=postgres 28 | 29 | client: 30 | build: 31 | context: ./services/client 32 | dockerfile: Dockerfile 33 | ports: 34 | - 8080:8080 35 | depends_on: 36 | - server 37 | -------------------------------------------------------------------------------- /kubernetes/flask-deployment.yml: -------------------------------------------------------------------------------- 1 | apiVersion: apps/v1 2 | kind: Deployment 3 | metadata: 4 | creationTimestamp: null 5 | labels: 6 | name: flask 7 | name: flask 8 | spec: 9 | progressDeadlineSeconds: 2147483647 10 | replicas: 1 11 | selector: 12 | matchLabels: 13 | app: flask 14 | template: 15 | metadata: 16 | creationTimestamp: null 17 | labels: 18 | app: flask 19 | spec: 20 | containers: 21 | - env: 22 | - name: FLASK_ENV 23 | value: development 24 | - name: APP_SETTINGS 25 | value: project.config.DevelopmentConfig 26 | - name: POSTGRES_USER 27 | valueFrom: 28 | secretKeyRef: 29 | key: user 30 | name: postgres-credentials 31 | - name: POSTGRES_PASSWORD 32 | valueFrom: 33 | secretKeyRef: 34 | key: password 35 | name: postgres-credentials 36 | image: mjhea0/flask-kubernetes:latest 37 | imagePullPolicy: Always 38 | name: flask 39 | resources: {} 40 | terminationMessagePath: /dev/termination-log 41 | terminationMessagePolicy: File 42 | dnsPolicy: ClusterFirst 43 | restartPolicy: Always 44 | schedulerName: default-scheduler 45 | securityContext: {} 46 | terminationGracePeriodSeconds: 30 47 | -------------------------------------------------------------------------------- /kubernetes/flask-service.yml: -------------------------------------------------------------------------------- 1 | apiVersion: v1 2 | kind: Service 3 | metadata: 4 | name: flask 5 | labels: 6 | service: flask 7 | spec: 8 | selector: 9 | app: flask 10 | ports: 11 | - port: 5000 12 | targetPort: 5000 13 | -------------------------------------------------------------------------------- /kubernetes/minikube-ingress.yml: -------------------------------------------------------------------------------- 1 | apiVersion: networking.k8s.io/v1 2 | kind: Ingress 3 | metadata: 4 | name: minikube-ingress 5 | annotations: 6 | spec: 7 | rules: 8 | - host: hello.world 9 | http: 10 | paths: 11 | - path: / 12 | pathType: Prefix 13 | backend: 14 | service: 15 | name: vue 16 | port: 17 | number: 8080 18 | - path: /books 19 | pathType: Prefix 20 | backend: 21 | service: 22 | name: flask 23 | port: 24 | number: 5000 25 | -------------------------------------------------------------------------------- /kubernetes/persistent-volume-claim.yml: -------------------------------------------------------------------------------- 1 | apiVersion: v1 2 | kind: PersistentVolumeClaim 3 | metadata: 4 | name: postgres-pvc 5 | labels: 6 | type: local 7 | spec: 8 | accessModes: 9 | - ReadWriteOnce 10 | resources: 11 | requests: 12 | storage: 2Gi 13 | volumeName: postgres-pv 14 | storageClassName: standard 15 | -------------------------------------------------------------------------------- /kubernetes/persistent-volume.yml: -------------------------------------------------------------------------------- 1 | apiVersion: v1 2 | kind: PersistentVolume 3 | metadata: 4 | name: postgres-pv 5 | labels: 6 | type: local 7 | spec: 8 | capacity: 9 | storage: 2Gi 10 | storageClassName: standard 11 | accessModes: 12 | - ReadWriteOnce 13 | hostPath: 14 | path: "/data/postgres-pv" 15 | -------------------------------------------------------------------------------- /kubernetes/postgres-deployment.yml: -------------------------------------------------------------------------------- 1 | apiVersion: apps/v1 2 | kind: Deployment 3 | metadata: 4 | creationTimestamp: null 5 | labels: 6 | name: database 7 | name: postgres 8 | spec: 9 | progressDeadlineSeconds: 2147483647 10 | replicas: 1 11 | selector: 12 | matchLabels: 13 | service: postgres 14 | template: 15 | metadata: 16 | creationTimestamp: null 17 | labels: 18 | service: postgres 19 | spec: 20 | containers: 21 | - name: postgres 22 | image: postgres:13-alpine 23 | env: 24 | - name: POSTGRES_USER 25 | valueFrom: 26 | secretKeyRef: 27 | name: postgres-credentials 28 | key: user 29 | - name: POSTGRES_PASSWORD 30 | valueFrom: 31 | secretKeyRef: 32 | name: postgres-credentials 33 | key: password 34 | volumeMounts: 35 | - mountPath: /var/lib/postgresql/data 36 | name: postgres-volume-mount 37 | dnsPolicy: ClusterFirst 38 | restartPolicy: Always 39 | schedulerName: default-scheduler 40 | securityContext: {} 41 | terminationGracePeriodSeconds: 30 42 | volumes: 43 | - name: postgres-volume-mount 44 | persistentVolumeClaim: 45 | claimName: postgres-pvc 46 | -------------------------------------------------------------------------------- /kubernetes/postgres-service.yml: -------------------------------------------------------------------------------- 1 | apiVersion: v1 2 | kind: Service 3 | metadata: 4 | name: postgres 5 | labels: 6 | service: postgres 7 | spec: 8 | selector: 9 | service: postgres 10 | type: ClusterIP 11 | ports: 12 | - port: 5432 13 | -------------------------------------------------------------------------------- /kubernetes/secret.yml: -------------------------------------------------------------------------------- 1 | apiVersion: v1 2 | kind: Secret 3 | metadata: 4 | name: postgres-credentials 5 | type: Opaque 6 | data: 7 | user: c2FtcGxl 8 | password: cGxlYXNlY2hhbmdlbWU= 9 | -------------------------------------------------------------------------------- /kubernetes/vue-deployment.yml: -------------------------------------------------------------------------------- 1 | apiVersion: apps/v1 2 | kind: Deployment 3 | metadata: 4 | creationTimestamp: null 5 | labels: 6 | name: vue 7 | name: vue 8 | spec: 9 | progressDeadlineSeconds: 2147483647 10 | replicas: 1 11 | selector: 12 | matchLabels: 13 | app: vue 14 | template: 15 | metadata: 16 | creationTimestamp: null 17 | labels: 18 | app: vue 19 | spec: 20 | containers: 21 | - image: mjhea0/vue-kubernetes:latest 22 | imagePullPolicy: Always 23 | name: vue 24 | resources: {} 25 | terminationMessagePath: /dev/termination-log 26 | terminationMessagePolicy: File 27 | dnsPolicy: ClusterFirst 28 | restartPolicy: Always 29 | schedulerName: default-scheduler 30 | securityContext: {} 31 | terminationGracePeriodSeconds: 30 32 | -------------------------------------------------------------------------------- /kubernetes/vue-service.yml: -------------------------------------------------------------------------------- 1 | apiVersion: v1 2 | kind: Service 3 | metadata: 4 | name: vue 5 | labels: 6 | service: vue 7 | name: vue 8 | spec: 9 | selector: 10 | app: vue 11 | ports: 12 | - port: 8080 13 | targetPort: 8080 14 | -------------------------------------------------------------------------------- /services/client/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["env", { 4 | "modules": false, 5 | "targets": { 6 | "browsers": ["> 1%", "last 2 versions", "not ie <= 8"] 7 | } 8 | }], 9 | "stage-2" 10 | ], 11 | "plugins": ["transform-vue-jsx", "transform-runtime"] 12 | } 13 | -------------------------------------------------------------------------------- /services/client/.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /services/client/.eslintignore: -------------------------------------------------------------------------------- 1 | /build/ 2 | /config/ 3 | /dist/ 4 | /*.js 5 | -------------------------------------------------------------------------------- /services/client/.eslintrc.js: -------------------------------------------------------------------------------- 1 | // https://eslint.org/docs/user-guide/configuring 2 | 3 | module.exports = { 4 | root: true, 5 | parserOptions: { 6 | parser: 'babel-eslint' 7 | }, 8 | env: { 9 | browser: true, 10 | }, 11 | // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention 12 | // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules. 13 | extends: ['plugin:vue/essential', 'airbnb-base'], 14 | // required to lint *.vue files 15 | plugins: [ 16 | 'vue' 17 | ], 18 | // check if imports actually resolve 19 | settings: { 20 | 'import/resolver': { 21 | webpack: { 22 | config: 'build/webpack.base.conf.js' 23 | } 24 | } 25 | }, 26 | // add your custom rules here 27 | rules: { 28 | // don't require .vue extension when importing 29 | 'import/extensions': ['error', 'always', { 30 | js: 'never', 31 | vue: 'never' 32 | }], 33 | // disallow reassignment of function parameters 34 | // disallow parameter object manipulation except for specific exclusions 35 | 'no-param-reassign': ['error', { 36 | props: true, 37 | ignorePropertyModificationsFor: [ 38 | 'state', // for vuex state 39 | 'acc', // for reduce accumulators 40 | 'e' // for e.returnvalue 41 | ] 42 | }], 43 | // allow optionalDependencies 44 | 'import/no-extraneous-dependencies': ['error', { 45 | optionalDependencies: ['test/unit/index.js'] 46 | }], 47 | // allow debugger during development 48 | 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off' 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /services/client/.postcssrc.js: -------------------------------------------------------------------------------- 1 | // https://github.com/michael-ciniawsky/postcss-load-config 2 | 3 | module.exports = { 4 | "plugins": { 5 | "postcss-import": {}, 6 | "postcss-url": {}, 7 | // to edit target browsers: use "browserslist" field in package.json 8 | "autoprefixer": {} 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /services/client/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM node:15-alpine 2 | 3 | RUN npm install -g http-server 4 | 5 | WORKDIR /app 6 | 7 | COPY package*.json ./ 8 | 9 | RUN npm install 10 | 11 | COPY . . 12 | 13 | RUN ROOT_API=http://localhost:5001 npm run build 14 | 15 | EXPOSE 8080 16 | 17 | CMD [ "http-server", "dist" ] 18 | -------------------------------------------------------------------------------- /services/client/Dockerfile-minikube: -------------------------------------------------------------------------------- 1 | FROM node:15-alpine 2 | 3 | RUN npm install -g http-server 4 | 5 | WORKDIR /app 6 | 7 | COPY package*.json ./ 8 | 9 | RUN npm install 10 | 11 | COPY . . 12 | 13 | RUN ROOT_API=http://hello.world npm run build 14 | 15 | EXPOSE 8080 16 | 17 | CMD [ "http-server", "dist" ] 18 | -------------------------------------------------------------------------------- /services/client/README.md: -------------------------------------------------------------------------------- 1 | # client 2 | 3 | > A Vue.js project 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | 17 | # build for production and view the bundle analyzer report 18 | npm run build --report 19 | ``` 20 | 21 | For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader). 22 | -------------------------------------------------------------------------------- /services/client/build/build.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | require('./check-versions')() 3 | 4 | process.env.NODE_ENV = 'production' 5 | 6 | const ora = require('ora') 7 | const rm = require('rimraf') 8 | const path = require('path') 9 | const chalk = require('chalk') 10 | const webpack = require('webpack') 11 | const config = require('../config') 12 | const webpackConfig = require('./webpack.prod.conf') 13 | 14 | const spinner = ora('building for production...') 15 | spinner.start() 16 | 17 | rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => { 18 | if (err) throw err 19 | webpack(webpackConfig, (err, stats) => { 20 | spinner.stop() 21 | if (err) throw err 22 | process.stdout.write(stats.toString({ 23 | colors: true, 24 | modules: false, 25 | children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build. 26 | chunks: false, 27 | chunkModules: false 28 | }) + '\n\n') 29 | 30 | if (stats.hasErrors()) { 31 | console.log(chalk.red(' Build failed with errors.\n')) 32 | process.exit(1) 33 | } 34 | 35 | console.log(chalk.cyan(' Build complete.\n')) 36 | console.log(chalk.yellow( 37 | ' Tip: built files are meant to be served over an HTTP server.\n' + 38 | ' Opening index.html over file:// won\'t work.\n' 39 | )) 40 | }) 41 | }) 42 | -------------------------------------------------------------------------------- /services/client/build/check-versions.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | const chalk = require('chalk') 3 | const semver = require('semver') 4 | const packageConfig = require('../package.json') 5 | const shell = require('shelljs') 6 | 7 | function exec (cmd) { 8 | return require('child_process').execSync(cmd).toString().trim() 9 | } 10 | 11 | const versionRequirements = [ 12 | { 13 | name: 'node', 14 | currentVersion: semver.clean(process.version), 15 | versionRequirement: packageConfig.engines.node 16 | } 17 | ] 18 | 19 | if (shell.which('npm')) { 20 | versionRequirements.push({ 21 | name: 'npm', 22 | currentVersion: exec('npm --version'), 23 | versionRequirement: packageConfig.engines.npm 24 | }) 25 | } 26 | 27 | module.exports = function () { 28 | const warnings = [] 29 | 30 | for (let i = 0; i < versionRequirements.length; i++) { 31 | const mod = versionRequirements[i] 32 | 33 | if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) { 34 | warnings.push(mod.name + ': ' + 35 | chalk.red(mod.currentVersion) + ' should be ' + 36 | chalk.green(mod.versionRequirement) 37 | ) 38 | } 39 | } 40 | 41 | if (warnings.length) { 42 | console.log('') 43 | console.log(chalk.yellow('To use this template, you must update following to modules:')) 44 | console.log() 45 | 46 | for (let i = 0; i < warnings.length; i++) { 47 | const warning = warnings[i] 48 | console.log(' ' + warning) 49 | } 50 | 51 | console.log() 52 | process.exit(1) 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /services/client/build/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/testdrivenio/flask-vue-kubernetes/a134f82ba6ae9b5a0bc10f7462a7dd9328d069cc/services/client/build/logo.png -------------------------------------------------------------------------------- /services/client/build/utils.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | const path = require('path') 3 | const config = require('../config') 4 | const ExtractTextPlugin = require('extract-text-webpack-plugin') 5 | const packageConfig = require('../package.json') 6 | 7 | exports.assetsPath = function (_path) { 8 | const assetsSubDirectory = process.env.NODE_ENV === 'production' 9 | ? config.build.assetsSubDirectory 10 | : config.dev.assetsSubDirectory 11 | 12 | return path.posix.join(assetsSubDirectory, _path) 13 | } 14 | 15 | exports.cssLoaders = function (options) { 16 | options = options || {} 17 | 18 | const cssLoader = { 19 | loader: 'css-loader', 20 | options: { 21 | sourceMap: options.sourceMap 22 | } 23 | } 24 | 25 | const postcssLoader = { 26 | loader: 'postcss-loader', 27 | options: { 28 | sourceMap: options.sourceMap 29 | } 30 | } 31 | 32 | // generate loader string to be used with extract text plugin 33 | function generateLoaders (loader, loaderOptions) { 34 | const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader] 35 | 36 | if (loader) { 37 | loaders.push({ 38 | loader: loader + '-loader', 39 | options: Object.assign({}, loaderOptions, { 40 | sourceMap: options.sourceMap 41 | }) 42 | }) 43 | } 44 | 45 | // Extract CSS when that option is specified 46 | // (which is the case during production build) 47 | if (options.extract) { 48 | return ExtractTextPlugin.extract({ 49 | use: loaders, 50 | fallback: 'vue-style-loader' 51 | }) 52 | } else { 53 | return ['vue-style-loader'].concat(loaders) 54 | } 55 | } 56 | 57 | // https://vue-loader.vuejs.org/en/configurations/extract-css.html 58 | return { 59 | css: generateLoaders(), 60 | postcss: generateLoaders(), 61 | less: generateLoaders('less'), 62 | sass: generateLoaders('sass', { indentedSyntax: true }), 63 | scss: generateLoaders('sass'), 64 | stylus: generateLoaders('stylus'), 65 | styl: generateLoaders('stylus') 66 | } 67 | } 68 | 69 | // Generate loaders for standalone style files (outside of .vue) 70 | exports.styleLoaders = function (options) { 71 | const output = [] 72 | const loaders = exports.cssLoaders(options) 73 | 74 | for (const extension in loaders) { 75 | const loader = loaders[extension] 76 | output.push({ 77 | test: new RegExp('\\.' + extension + '$'), 78 | use: loader 79 | }) 80 | } 81 | 82 | return output 83 | } 84 | 85 | exports.createNotifierCallback = () => { 86 | const notifier = require('node-notifier') 87 | 88 | return (severity, errors) => { 89 | if (severity !== 'error') return 90 | 91 | const error = errors[0] 92 | const filename = error.file && error.file.split('!').pop() 93 | 94 | notifier.notify({ 95 | title: packageConfig.name, 96 | message: severity + ': ' + error.name, 97 | subtitle: filename || '', 98 | icon: path.join(__dirname, 'logo.png') 99 | }) 100 | } 101 | } 102 | -------------------------------------------------------------------------------- /services/client/build/vue-loader.conf.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | const utils = require('./utils') 3 | const config = require('../config') 4 | const isProduction = process.env.NODE_ENV === 'production' 5 | const sourceMapEnabled = isProduction 6 | ? config.build.productionSourceMap 7 | : config.dev.cssSourceMap 8 | 9 | module.exports = { 10 | loaders: utils.cssLoaders({ 11 | sourceMap: sourceMapEnabled, 12 | extract: isProduction 13 | }), 14 | cssSourceMap: sourceMapEnabled, 15 | cacheBusting: config.dev.cacheBusting, 16 | transformToRequire: { 17 | video: ['src', 'poster'], 18 | source: 'src', 19 | img: 'src', 20 | image: 'xlink:href' 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /services/client/build/webpack.base.conf.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | const path = require('path') 3 | const utils = require('./utils') 4 | const config = require('../config') 5 | const vueLoaderConfig = require('./vue-loader.conf') 6 | 7 | function resolve (dir) { 8 | return path.join(__dirname, '..', dir) 9 | } 10 | 11 | const createLintingRule = () => ({ 12 | test: /\.(js|vue)$/, 13 | loader: 'eslint-loader', 14 | enforce: 'pre', 15 | include: [resolve('src'), resolve('test')], 16 | options: { 17 | formatter: require('eslint-friendly-formatter'), 18 | emitWarning: !config.dev.showEslintErrorsInOverlay 19 | } 20 | }) 21 | 22 | module.exports = { 23 | context: path.resolve(__dirname, '../'), 24 | entry: { 25 | app: './src/main.js' 26 | }, 27 | output: { 28 | path: config.build.assetsRoot, 29 | filename: '[name].js', 30 | publicPath: process.env.NODE_ENV === 'production' 31 | ? config.build.assetsPublicPath 32 | : config.dev.assetsPublicPath 33 | }, 34 | resolve: { 35 | extensions: ['.js', '.vue', '.json'], 36 | alias: { 37 | 'vue$': 'vue/dist/vue.esm.js', 38 | '@': resolve('src'), 39 | } 40 | }, 41 | module: { 42 | rules: [ 43 | ...(config.dev.useEslint ? [createLintingRule()] : []), 44 | { 45 | test: /\.vue$/, 46 | loader: 'vue-loader', 47 | options: vueLoaderConfig 48 | }, 49 | { 50 | test: /\.js$/, 51 | loader: 'babel-loader', 52 | include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')] 53 | }, 54 | { 55 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 56 | loader: 'url-loader', 57 | options: { 58 | limit: 10000, 59 | name: utils.assetsPath('img/[name].[hash:7].[ext]') 60 | } 61 | }, 62 | { 63 | test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/, 64 | loader: 'url-loader', 65 | options: { 66 | limit: 10000, 67 | name: utils.assetsPath('media/[name].[hash:7].[ext]') 68 | } 69 | }, 70 | { 71 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 72 | loader: 'url-loader', 73 | options: { 74 | limit: 10000, 75 | name: utils.assetsPath('fonts/[name].[hash:7].[ext]') 76 | } 77 | } 78 | ] 79 | }, 80 | node: { 81 | // prevent webpack from injecting useless setImmediate polyfill because Vue 82 | // source contains it (although only uses it if it's native). 83 | setImmediate: false, 84 | // prevent webpack from injecting mocks to Node native modules 85 | // that does not make sense for the client 86 | dgram: 'empty', 87 | fs: 'empty', 88 | net: 'empty', 89 | tls: 'empty', 90 | child_process: 'empty' 91 | } 92 | } 93 | -------------------------------------------------------------------------------- /services/client/build/webpack.dev.conf.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | const utils = require('./utils') 3 | const webpack = require('webpack') 4 | const config = require('../config') 5 | const merge = require('webpack-merge') 6 | const path = require('path') 7 | const baseWebpackConfig = require('./webpack.base.conf') 8 | const CopyWebpackPlugin = require('copy-webpack-plugin') 9 | const HtmlWebpackPlugin = require('html-webpack-plugin') 10 | const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') 11 | const portfinder = require('portfinder') 12 | 13 | const HOST = process.env.HOST 14 | const PORT = process.env.PORT && Number(process.env.PORT) 15 | 16 | const devWebpackConfig = merge(baseWebpackConfig, { 17 | module: { 18 | rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true }) 19 | }, 20 | // cheap-module-eval-source-map is faster for development 21 | devtool: config.dev.devtool, 22 | 23 | // these devServer options should be customized in /config/index.js 24 | devServer: { 25 | clientLogLevel: 'warning', 26 | historyApiFallback: { 27 | rewrites: [ 28 | { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') }, 29 | ], 30 | }, 31 | hot: true, 32 | contentBase: false, // since we use CopyWebpackPlugin. 33 | compress: true, 34 | host: HOST || config.dev.host, 35 | port: PORT || config.dev.port, 36 | open: config.dev.autoOpenBrowser, 37 | overlay: config.dev.errorOverlay 38 | ? { warnings: false, errors: true } 39 | : false, 40 | publicPath: config.dev.assetsPublicPath, 41 | proxy: config.dev.proxyTable, 42 | quiet: true, // necessary for FriendlyErrorsPlugin 43 | watchOptions: { 44 | poll: config.dev.poll, 45 | } 46 | }, 47 | plugins: [ 48 | new webpack.DefinePlugin({ 49 | 'process.env': require('../config/dev.env') 50 | }), 51 | new webpack.HotModuleReplacementPlugin(), 52 | new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update. 53 | new webpack.NoEmitOnErrorsPlugin(), 54 | // https://github.com/ampedandwired/html-webpack-plugin 55 | new HtmlWebpackPlugin({ 56 | filename: 'index.html', 57 | template: 'index.html', 58 | inject: true 59 | }), 60 | // copy custom static assets 61 | new CopyWebpackPlugin([ 62 | { 63 | from: path.resolve(__dirname, '../static'), 64 | to: config.dev.assetsSubDirectory, 65 | ignore: ['.*'] 66 | } 67 | ]) 68 | ] 69 | }) 70 | 71 | module.exports = new Promise((resolve, reject) => { 72 | portfinder.basePort = process.env.PORT || config.dev.port 73 | portfinder.getPort((err, port) => { 74 | if (err) { 75 | reject(err) 76 | } else { 77 | // publish the new Port, necessary for e2e tests 78 | process.env.PORT = port 79 | // add port to devServer config 80 | devWebpackConfig.devServer.port = port 81 | 82 | // Add FriendlyErrorsPlugin 83 | devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({ 84 | compilationSuccessInfo: { 85 | messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`], 86 | }, 87 | onErrors: config.dev.notifyOnErrors 88 | ? utils.createNotifierCallback() 89 | : undefined 90 | })) 91 | 92 | resolve(devWebpackConfig) 93 | } 94 | }) 95 | }) 96 | -------------------------------------------------------------------------------- /services/client/build/webpack.prod.conf.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | const path = require('path') 3 | const utils = require('./utils') 4 | const webpack = require('webpack') 5 | const config = require('../config') 6 | const merge = require('webpack-merge') 7 | const baseWebpackConfig = require('./webpack.base.conf') 8 | const CopyWebpackPlugin = require('copy-webpack-plugin') 9 | const HtmlWebpackPlugin = require('html-webpack-plugin') 10 | const ExtractTextPlugin = require('extract-text-webpack-plugin') 11 | const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') 12 | const UglifyJsPlugin = require('uglifyjs-webpack-plugin') 13 | 14 | const env = require('../config/prod.env') 15 | 16 | const webpackConfig = merge(baseWebpackConfig, { 17 | module: { 18 | rules: utils.styleLoaders({ 19 | sourceMap: config.build.productionSourceMap, 20 | extract: true, 21 | usePostCSS: true 22 | }) 23 | }, 24 | devtool: config.build.productionSourceMap ? config.build.devtool : false, 25 | output: { 26 | path: config.build.assetsRoot, 27 | filename: utils.assetsPath('js/[name].[chunkhash].js'), 28 | chunkFilename: utils.assetsPath('js/[id].[chunkhash].js') 29 | }, 30 | plugins: [ 31 | // http://vuejs.github.io/vue-loader/en/workflow/production.html 32 | new webpack.DefinePlugin({ 33 | 'process.env': env 34 | }), 35 | new UglifyJsPlugin({ 36 | uglifyOptions: { 37 | compress: { 38 | warnings: false 39 | } 40 | }, 41 | sourceMap: config.build.productionSourceMap, 42 | parallel: true 43 | }), 44 | // extract css into its own file 45 | new ExtractTextPlugin({ 46 | filename: utils.assetsPath('css/[name].[contenthash].css'), 47 | // Setting the following option to `false` will not extract CSS from codesplit chunks. 48 | // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack. 49 | // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, 50 | // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110 51 | allChunks: true, 52 | }), 53 | // Compress extracted CSS. We are using this plugin so that possible 54 | // duplicated CSS from different components can be deduped. 55 | new OptimizeCSSPlugin({ 56 | cssProcessorOptions: config.build.productionSourceMap 57 | ? { safe: true, map: { inline: false } } 58 | : { safe: true } 59 | }), 60 | // generate dist index.html with correct asset hash for caching. 61 | // you can customize output by editing /index.html 62 | // see https://github.com/ampedandwired/html-webpack-plugin 63 | new HtmlWebpackPlugin({ 64 | filename: config.build.index, 65 | template: 'index.html', 66 | inject: true, 67 | minify: { 68 | removeComments: true, 69 | collapseWhitespace: true, 70 | removeAttributeQuotes: true 71 | // more options: 72 | // https://github.com/kangax/html-minifier#options-quick-reference 73 | }, 74 | // necessary to consistently work with multiple chunks via CommonsChunkPlugin 75 | chunksSortMode: 'dependency' 76 | }), 77 | // keep module.id stable when vendor modules does not change 78 | new webpack.HashedModuleIdsPlugin(), 79 | // enable scope hoisting 80 | new webpack.optimize.ModuleConcatenationPlugin(), 81 | // split vendor js into its own file 82 | new webpack.optimize.CommonsChunkPlugin({ 83 | name: 'vendor', 84 | minChunks (module) { 85 | // any required modules inside node_modules are extracted to vendor 86 | return ( 87 | module.resource && 88 | /\.js$/.test(module.resource) && 89 | module.resource.indexOf( 90 | path.join(__dirname, '../node_modules') 91 | ) === 0 92 | ) 93 | } 94 | }), 95 | // extract webpack runtime and module manifest to its own file in order to 96 | // prevent vendor hash from being updated whenever app bundle is updated 97 | new webpack.optimize.CommonsChunkPlugin({ 98 | name: 'manifest', 99 | minChunks: Infinity 100 | }), 101 | // This instance extracts shared chunks from code splitted chunks and bundles them 102 | // in a separate chunk, similar to the vendor chunk 103 | // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk 104 | new webpack.optimize.CommonsChunkPlugin({ 105 | name: 'app', 106 | async: 'vendor-async', 107 | children: true, 108 | minChunks: 3 109 | }), 110 | 111 | // copy custom static assets 112 | new CopyWebpackPlugin([ 113 | { 114 | from: path.resolve(__dirname, '../static'), 115 | to: config.build.assetsSubDirectory, 116 | ignore: ['.*'] 117 | } 118 | ]) 119 | ] 120 | }) 121 | 122 | if (config.build.productionGzip) { 123 | const CompressionWebpackPlugin = require('compression-webpack-plugin') 124 | 125 | webpackConfig.plugins.push( 126 | new CompressionWebpackPlugin({ 127 | asset: '[path].gz[query]', 128 | algorithm: 'gzip', 129 | test: new RegExp( 130 | '\\.(' + 131 | config.build.productionGzipExtensions.join('|') + 132 | ')$' 133 | ), 134 | threshold: 10240, 135 | minRatio: 0.8 136 | }) 137 | ) 138 | } 139 | 140 | if (config.build.bundleAnalyzerReport) { 141 | const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin 142 | webpackConfig.plugins.push(new BundleAnalyzerPlugin()) 143 | } 144 | 145 | module.exports = webpackConfig 146 | -------------------------------------------------------------------------------- /services/client/config/dev.env.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | const merge = require('webpack-merge') 3 | const prodEnv = require('./prod.env') 4 | 5 | module.exports = merge(prodEnv, { 6 | NODE_ENV: '"development"' 7 | }) 8 | -------------------------------------------------------------------------------- /services/client/config/index.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | // Template version: 1.3.1 3 | // see http://vuejs-templates.github.io/webpack for documentation. 4 | 5 | const path = require('path') 6 | 7 | module.exports = { 8 | dev: { 9 | 10 | // Paths 11 | assetsSubDirectory: 'static', 12 | assetsPublicPath: '/', 13 | proxyTable: {}, 14 | 15 | // Various Dev Server settings 16 | host: 'localhost', // can be overwritten by process.env.HOST 17 | port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined 18 | autoOpenBrowser: false, 19 | errorOverlay: true, 20 | notifyOnErrors: true, 21 | poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions- 22 | 23 | // Use Eslint Loader? 24 | // If true, your code will be linted during bundling and 25 | // linting errors and warnings will be shown in the console. 26 | useEslint: true, 27 | // If true, eslint errors and warnings will also be shown in the error overlay 28 | // in the browser. 29 | showEslintErrorsInOverlay: false, 30 | 31 | /** 32 | * Source Maps 33 | */ 34 | 35 | // https://webpack.js.org/configuration/devtool/#development 36 | devtool: 'cheap-module-eval-source-map', 37 | 38 | // If you have problems debugging vue-files in devtools, 39 | // set this to false - it *may* help 40 | // https://vue-loader.vuejs.org/en/options.html#cachebusting 41 | cacheBusting: true, 42 | 43 | cssSourceMap: true 44 | }, 45 | 46 | build: { 47 | // Template for index.html 48 | index: path.resolve(__dirname, '../dist/index.html'), 49 | 50 | // Paths 51 | assetsRoot: path.resolve(__dirname, '../dist'), 52 | assetsSubDirectory: 'static', 53 | assetsPublicPath: '/', 54 | 55 | /** 56 | * Source Maps 57 | */ 58 | 59 | productionSourceMap: true, 60 | // https://webpack.js.org/configuration/devtool/#production 61 | devtool: '#source-map', 62 | 63 | // Gzip off by default as many popular static hosts such as 64 | // Surge or Netlify already gzip all static assets for you. 65 | // Before setting to `true`, make sure to: 66 | // npm install --save-dev compression-webpack-plugin 67 | productionGzip: false, 68 | productionGzipExtensions: ['js', 'css'], 69 | 70 | // Run the build command with an extra argument to 71 | // View the bundle analyzer report after build finishes: 72 | // `npm run build --report` 73 | // Set to `true` or `false` to always turn it on or off 74 | bundleAnalyzerReport: process.env.npm_config_report 75 | } 76 | } 77 | -------------------------------------------------------------------------------- /services/client/config/prod.env.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | module.exports = { 3 | NODE_ENV: '"production"', 4 | ROOT_API: JSON.stringify(process.env.ROOT_API) 5 | } 6 | -------------------------------------------------------------------------------- /services/client/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Bookshelf 7 | 8 | 9 |
10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /services/client/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "client", 3 | "version": "1.0.0", 4 | "description": "A Vue.js project", 5 | "author": "Michael Herman michael@mherman.org", 6 | "private": true, 7 | "scripts": { 8 | "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", 9 | "start": "npm run dev", 10 | "lint": "eslint --ext .js,.vue src", 11 | "build": "node build/build.js" 12 | }, 13 | "dependencies": { 14 | "axios": "^0.19.2", 15 | "bootstrap": "^4.6.0", 16 | "bootstrap-vue": "^2.21.2", 17 | "vue": "^2.6.12", 18 | "vue-router": "^3.5.1" 19 | }, 20 | "devDependencies": { 21 | "autoprefixer": "^7.1.2", 22 | "babel-core": "^6.22.1", 23 | "babel-eslint": "^8.2.1", 24 | "babel-helper-vue-jsx-merge-props": "^2.0.3", 25 | "babel-loader": "^7.1.1", 26 | "babel-plugin-syntax-jsx": "^6.18.0", 27 | "babel-plugin-transform-runtime": "^6.22.0", 28 | "babel-plugin-transform-vue-jsx": "^3.5.0", 29 | "babel-preset-env": "^1.3.2", 30 | "babel-preset-stage-2": "^6.22.0", 31 | "chalk": "^2.0.1", 32 | "copy-webpack-plugin": "^4.0.1", 33 | "css-loader": "^0.28.0", 34 | "eslint": "^4.15.0", 35 | "eslint-config-airbnb-base": "^11.3.0", 36 | "eslint-friendly-formatter": "^3.0.0", 37 | "eslint-import-resolver-webpack": "^0.8.3", 38 | "eslint-loader": "^1.7.1", 39 | "eslint-plugin-import": "^2.7.0", 40 | "eslint-plugin-vue": "^4.0.0", 41 | "extract-text-webpack-plugin": "^3.0.0", 42 | "file-loader": "^1.1.4", 43 | "friendly-errors-webpack-plugin": "^1.6.1", 44 | "html-webpack-plugin": "^2.30.1", 45 | "node-notifier": "^5.1.2", 46 | "optimize-css-assets-webpack-plugin": "^3.2.0", 47 | "ora": "^1.2.0", 48 | "portfinder": "^1.0.13", 49 | "postcss-import": "^11.0.0", 50 | "postcss-loader": "^2.0.8", 51 | "postcss-url": "^7.2.1", 52 | "rimraf": "^2.6.0", 53 | "semver": "^5.3.0", 54 | "shelljs": "^0.7.6", 55 | "uglifyjs-webpack-plugin": "^1.1.1", 56 | "url-loader": "^0.5.8", 57 | "vue-loader": "^13.3.0", 58 | "vue-style-loader": "^3.0.1", 59 | "vue-template-compiler": "^2.5.2", 60 | "webpack": "^3.6.0", 61 | "webpack-bundle-analyzer": "^2.9.0", 62 | "webpack-dev-server": "^2.9.1", 63 | "webpack-merge": "^4.1.0" 64 | }, 65 | "engines": { 66 | "node": ">= 6.0.0", 67 | "npm": ">= 3.0.0" 68 | }, 69 | "browserslist": [ 70 | "> 1%", 71 | "last 2 versions", 72 | "not ie <= 8" 73 | ] 74 | } 75 | -------------------------------------------------------------------------------- /services/client/src/App.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 12 | 13 | 18 | -------------------------------------------------------------------------------- /services/client/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/testdrivenio/flask-vue-kubernetes/a134f82ba6ae9b5a0bc10f7462a7dd9328d069cc/services/client/src/assets/logo.png -------------------------------------------------------------------------------- /services/client/src/components/Alert.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 13 | -------------------------------------------------------------------------------- /services/client/src/components/Books.vue: -------------------------------------------------------------------------------- 1 | 117 | 118 | 256 | -------------------------------------------------------------------------------- /services/client/src/components/HelloWorld.vue: -------------------------------------------------------------------------------- 1 | 85 | 86 | 96 | 97 | 98 | 114 | -------------------------------------------------------------------------------- /services/client/src/components/Ping.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 35 | -------------------------------------------------------------------------------- /services/client/src/main.js: -------------------------------------------------------------------------------- 1 | import 'bootstrap/dist/css/bootstrap.css'; 2 | import BootstrapVue from 'bootstrap-vue'; 3 | import Vue from 'vue'; 4 | import App from './App'; 5 | import router from './router'; 6 | 7 | Vue.config.productionTip = false; 8 | 9 | Vue.use(BootstrapVue); 10 | 11 | /* eslint-disable no-new */ 12 | new Vue({ 13 | el: '#app', 14 | router, 15 | components: { App }, 16 | template: '', 17 | }); 18 | -------------------------------------------------------------------------------- /services/client/src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue'; 2 | import Router from 'vue-router'; 3 | import Ping from '@/components/Ping'; 4 | import Books from '@/components/Books'; 5 | 6 | Vue.use(Router); 7 | 8 | export default new Router({ 9 | routes: [ 10 | { 11 | path: '/', 12 | name: 'Books', 13 | component: Books, 14 | }, 15 | { 16 | path: '/ping', 17 | name: 'Ping', 18 | component: Ping, 19 | }, 20 | ], 21 | mode: 'hash', 22 | }); 23 | -------------------------------------------------------------------------------- /services/client/static/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/testdrivenio/flask-vue-kubernetes/a134f82ba6ae9b5a0bc10f7462a7dd9328d069cc/services/client/static/.gitkeep -------------------------------------------------------------------------------- /services/db/Dockerfile: -------------------------------------------------------------------------------- 1 | # base image 2 | FROM postgres:13-alpine 3 | 4 | # run create.sql on init 5 | ADD create.sql /docker-entrypoint-initdb.d 6 | -------------------------------------------------------------------------------- /services/db/create.sql: -------------------------------------------------------------------------------- 1 | CREATE DATABASE books; 2 | -------------------------------------------------------------------------------- /services/server/.dockerignore: -------------------------------------------------------------------------------- 1 | env 2 | .dockerignore 3 | Dockerfile 4 | migrations 5 | -------------------------------------------------------------------------------- /services/server/Dockerfile: -------------------------------------------------------------------------------- 1 | # base image 2 | FROM python:3.9.4-slim 3 | 4 | # install netcat 5 | RUN apt-get update && \ 6 | apt-get -y install netcat && \ 7 | apt-get clean 8 | 9 | # set working directory 10 | WORKDIR /usr/src/app 11 | 12 | # add and install requirements 13 | COPY ./requirements.txt /usr/src/app/requirements.txt 14 | RUN pip install -r requirements.txt 15 | 16 | # add entrypoint.sh 17 | COPY ./entrypoint.sh /usr/src/app/entrypoint.sh 18 | RUN chmod +x /usr/src/app/entrypoint.sh 19 | 20 | # add app 21 | COPY . /usr/src/app 22 | 23 | # run server 24 | CMD ["/usr/src/app/entrypoint.sh"] 25 | -------------------------------------------------------------------------------- /services/server/entrypoint.sh: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | 3 | echo "Waiting for postgres..." 4 | 5 | while ! nc -z postgres 5432; do 6 | sleep 0.1 7 | done 8 | 9 | echo "PostgreSQL started" 10 | 11 | gunicorn -b 0.0.0.0:5000 manage:app 12 | -------------------------------------------------------------------------------- /services/server/manage.py: -------------------------------------------------------------------------------- 1 | from flask.cli import FlaskGroup 2 | 3 | from project import create_app, db 4 | from project.api.models import Book 5 | 6 | 7 | app = create_app() 8 | cli = FlaskGroup(create_app=create_app) 9 | 10 | 11 | @cli.command('recreate_db') 12 | def recreate_db(): 13 | db.drop_all() 14 | db.create_all() 15 | db.session.commit() 16 | 17 | 18 | @cli.command('seed_db') 19 | def seed_db(): 20 | """Seeds the database.""" 21 | db.session.add(Book( 22 | title='On the Road', 23 | author='Jack Kerouac', 24 | read=True 25 | )) 26 | db.session.add(Book( 27 | title='Harry Potter and the Philosopher\'s Stone', 28 | author='J. K. Rowling', 29 | read=False 30 | )) 31 | db.session.add(Book( 32 | title='Green Eggs and Ham', 33 | author='Dr. Seuss', 34 | read=True 35 | )) 36 | db.session.commit() 37 | 38 | 39 | if __name__ == '__main__': 40 | cli() 41 | -------------------------------------------------------------------------------- /services/server/project/__init__.py: -------------------------------------------------------------------------------- 1 | import os 2 | 3 | from flask import Flask 4 | from flask_sqlalchemy import SQLAlchemy 5 | from flask_cors import CORS 6 | from flask_migrate import Migrate 7 | 8 | 9 | # instantiate the extensions 10 | db = SQLAlchemy() 11 | migrate = Migrate() 12 | 13 | 14 | def create_app(script_info=None): 15 | 16 | # instantiate the app 17 | app = Flask(__name__) 18 | 19 | # enable CORS 20 | CORS(app) 21 | 22 | # set config 23 | app_settings = os.getenv('APP_SETTINGS') 24 | app.config.from_object(app_settings) 25 | 26 | # set up extensions 27 | db.init_app(app) 28 | migrate.init_app(app, db) 29 | 30 | # register blueprints 31 | from project.api.books import books_blueprint 32 | app.register_blueprint(books_blueprint) 33 | 34 | # shell context for flask cli 35 | @app.shell_context_processor 36 | def ctx(): 37 | return {'app': app, 'db': db} 38 | 39 | return app 40 | -------------------------------------------------------------------------------- /services/server/project/api/__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/testdrivenio/flask-vue-kubernetes/a134f82ba6ae9b5a0bc10f7462a7dd9328d069cc/services/server/project/api/__init__.py -------------------------------------------------------------------------------- /services/server/project/api/books.py: -------------------------------------------------------------------------------- 1 | import os 2 | 3 | from flask import Blueprint, jsonify, request 4 | 5 | from project.api.models import Book 6 | from project import db 7 | 8 | 9 | books_blueprint = Blueprint('books', __name__) 10 | 11 | 12 | @books_blueprint.route('/books', methods=['GET', 'POST']) 13 | def all_books(): 14 | response_object = { 15 | 'status': 'success', 16 | 'container_id': os.uname()[1] 17 | } 18 | if request.method == 'POST': 19 | post_data = request.get_json() 20 | title = post_data.get('title') 21 | author = post_data.get('author') 22 | read = post_data.get('read') 23 | db.session.add(Book(title=title, author=author, read=read)) 24 | db.session.commit() 25 | response_object['message'] = 'Book added!' 26 | else: 27 | response_object['books'] = [book.to_json() for book in Book.query.all()] 28 | return jsonify(response_object) 29 | 30 | 31 | @books_blueprint.route('/books/ping', methods=['GET']) 32 | def ping(): 33 | return jsonify({ 34 | 'status': 'success', 35 | 'message': 'pong!', 36 | 'container_id': os.uname()[1] 37 | }) 38 | 39 | 40 | @books_blueprint.route('/books/', methods=['PUT', 'DELETE']) 41 | def single_book(book_id): 42 | response_object = { 43 | 'status': 'success', 44 | 'container_id': os.uname()[1] 45 | } 46 | book = Book.query.filter_by(id=book_id).first() 47 | if request.method == 'PUT': 48 | post_data = request.get_json() 49 | book.title = post_data.get('title') 50 | book.author = post_data.get('author') 51 | book.read = post_data.get('read') 52 | db.session.commit() 53 | response_object['message'] = 'Book updated!' 54 | if request.method == 'DELETE': 55 | db.session.delete(book) 56 | db.session.commit() 57 | response_object['message'] = 'Book removed!' 58 | return jsonify(response_object) 59 | 60 | 61 | if __name__ == '__main__': 62 | app.run() 63 | -------------------------------------------------------------------------------- /services/server/project/api/models.py: -------------------------------------------------------------------------------- 1 | import datetime 2 | 3 | from flask import current_app 4 | from sqlalchemy.sql import func 5 | 6 | from project import db 7 | 8 | 9 | class Book(db.Model): 10 | 11 | __tablename__ = 'books' 12 | 13 | id = db.Column(db.Integer, primary_key=True, autoincrement=True) 14 | title = db.Column(db.String(255), nullable=False) 15 | author = db.Column(db.String(255), nullable=False) 16 | read = db.Column(db.Boolean(), default=False, nullable=False) 17 | 18 | def __init__(self, title, author, read): 19 | self.title = title 20 | self.author = author 21 | self.read = read 22 | 23 | def to_json(self): 24 | return { 25 | 'id': self.id, 26 | 'title': self.title, 27 | 'author': self.author, 28 | 'read': self.read 29 | } 30 | -------------------------------------------------------------------------------- /services/server/project/config.py: -------------------------------------------------------------------------------- 1 | import os 2 | 3 | POSTGRES_USER = os.environ.get('POSTGRES_USER') 4 | POSTGRES_PASSWORD = os.environ.get('POSTGRES_PASSWORD') 5 | DATABASE_URL = f'postgresql://{POSTGRES_USER}:{POSTGRES_PASSWORD}@postgres:5432/books' 6 | 7 | 8 | class BaseConfig: 9 | """Base configuration""" 10 | DEBUG = False 11 | TESTING = False 12 | SQLALCHEMY_TRACK_MODIFICATIONS = False 13 | 14 | 15 | class DevelopmentConfig(BaseConfig): 16 | """Development configuration""" 17 | SQLALCHEMY_DATABASE_URI = DATABASE_URL 18 | 19 | 20 | class ProductionConfig(BaseConfig): 21 | """Production configuration""" 22 | SQLALCHEMY_DATABASE_URI = DATABASE_URL 23 | -------------------------------------------------------------------------------- /services/server/requirements.txt: -------------------------------------------------------------------------------- 1 | Flask==1.1.2 2 | Flask-Cors==3.0.10 3 | flask-migrate==2.7.0 4 | Flask-SQLAlchemy==2.5.1 5 | gunicorn==20.1.0 6 | psycopg2-binary==2.8.6 7 | --------------------------------------------------------------------------------