Merge pull request #231 from Seluj78/229-add-vue-container

229: replace react frontend with vue container

Author: supalarry

.travis.yml

@@ -15,10 +15,11 @@ install: pip install -r backend/requirements.txt
 
 jobs:
   include:
-    - stage: build
-      script: make build
+#    - stage: build
+#      script: make build
     - stage: lint
-      script: make lint
+      script: black --check backend
+#      script: make lint
 #    - stage: tests
 #      before_script:
 #        - wget https://repo.mysql.com//mysql-apt-config_0.8.14-1_all.deb

Makefile

@@ -25,7 +25,6 @@
 from dotenv import load_dotenv
 from flask import Flask
 from flask import jsonify
-from flask import send_from_directory
 from flask_cors import CORS
 from flask_jwt_extended import JWTManager
 from flask_mail import Mail
@@ -59,7 +58,7 @@
 if os.getenv("ENABLE_LOGGING") == "True":
     setup_logging()
 
-application = Flask(__name__, static_folder=os.getenv("FRONT_STATIC_FOLDER"))
+application = Flask(__name__)
 
 if os.getenv("FLASK_DEBUG", "false") == "true" or os.getenv("FLASK_DEBUG", "false") == "1":
     application.debug = True
@@ -224,20 +223,6 @@ def check_if_token_is_revoked(decrypted_token):
     application.register_blueprint(debug_bp)
 
 
-logging.debug("Registering serve route for REACT")
-
-
-# Serve React App
-@application.route("/", defaults={"path": ""})
-@application.route("/<path:path>")
-def serve(path):
-    logging.debug("Serving {}.".format(path))
-    if path != "" and os.path.exists(application.static_folder + "/" + path):
-        return send_from_directory(application.static_folder, path)
-    else:
-        return send_from_directory(application.static_folder, "index.html")
-
-
 @jwt.unauthorized_loader
 def no_jwt_callback(error_message):
     return (

backend/PyMatcha/__init__.py

@@ -88,6 +88,17 @@ services:
       - redis-net
       - mysql-net
 
+  frontend:
+    container_name: frontend
+    build:
+      context: ./frontend
+      dockerfile: Dockerfile
+    volumes:
+      - './frontend:/frontend'
+      - '/frontend/node_modules'
+    ports:
+      - '4242:8080'
+
   phpmyadmin:
     image: phpmyadmin/phpmyadmin
     container_name: dev_pma

docker-compose.yml

@@ -0,0 +1,3 @@
+node_modules
+.git
+.gitignore

frontend/.dockerignore

@@ -0,0 +1,7 @@
+[*.{js,jsx,ts,tsx,vue}]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+trim_trailing_whitespace = true
+insert_final_newline = true
+max_line_length = 100

frontend/.editorconfig

@@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

frontend/.gitignore

@@ -0,0 +1,11 @@
+FROM node:12.2.0-alpine
+
+WORKDIR /frontend
+
+ENV PATH /frontend/node_modules/.bin:$PATH
+
+COPY package.json /frontend/package.json
+RUN yarn install
+RUN yarn global add @vue/cli
+
+CMD ["yarn", "serve"]

frontend/Dockerfile

@@ -0,0 +1,24 @@
+# client
+
+## Project setup
+```
+yarn install
+```
+
+### Compiles and hot-reloads for development
+```
+yarn serve
+```
+
+### Compiles and minifies for production
+```
+yarn build
+```
+
+### Lints and fixes files
+```
+yarn lint
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).

frontend/README.md

@@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset',
+  ],
+};