CD-CODE web interface

• CD-CODE web interface
  • Directory Structure
  • Project installation
    • Setup and build
    • Customize configuration
• Production
  • How to apply Dev branch into Production
    • Server
    • Client

CD-CODE web interface contains all the front-end source codes based on vue.js v2.

Directory Structure

|-- dist                      # Distribution folder used for production
|-- public                    # Root folder for the web service
|-- src                       # Source files
    |-- assets                # Static web resources
    |-- components            # Reusable user interface components
    |-- router                # Routing url with specific components/views
    |-- store                 # Storage manager per sessionn
    |-- views                 # View pages
    |-- App.vue               # Unit test files
    |-- index.css             # Unit test files
    |-- main.js               # Unit test files
|-- .env                      # Env varibales to setup
|-- README.md                 # This file
|-- vue.config.js             # Vue releated config file

Project installation

Setup and build

• Install dependencies

  yarn install

• Compiles and hot-reloads for development

  yarn run serve

• Compiles and minifies for production

  yarn run build

• Copy all the files under /dist to the web folder

  cp -R dist/* [your_webserver_root]

• Run your tests

  yarn run test

• Lints and fixes files

  yarn run lint

Customize configuration

• It requires proper settings in src/components/js/const.js.

export const host = '/api';
export const devHost = '/api';
export const apikey = '<your api key>'

References:

• https://github.com/miaolz123/vue-markdown
• Star rating system: https://karol-f.github.io/vue-custom-element/#/demos/events

Production

How to apply Dev branch into Production

Server

1. Create an increment version of tag in https://git.mpi-cbg.de/scicomp/scidev_team/dd-code/-/tags
2. Make new merge request from develop branch into master in https://git.mpi-cbg.de/scicomp/scidev_team/dd-code/-/merge_requests/new
3. Accept the merge request
4. In /local/dd-code-api
5. git pull
6. flask run --host=0.0.0.0 --port=5001
7. In /home/moon/backup
8. mongodump --host=ddcode-srv1 --port=27018 --db=ddcode
9. mv dump dump-<date>
10. mongorestore --port=27017 --drop

Client

1. For production, git checkout master, yarn build and deploy
2. For develop, git checkout develop, yarn build-dev and deploy-dev