Shmdoc PoC frontend

This repository is the frontend for the shmdoc project

Installation

Add the following snippet to your docker-compose.yml to include the file service in your project:

frontend:
    image: shmdoc/frontend-shmdoc-osoc-poc
    links:
      - identifier:backend
    ports:
      - 80:80

Now you will be able to acces the frontend on port 80

A complete docker-compose.yml and dispatcher.ex file for running the entire shmdoc stack, can be found at the app-shmdoc-osoc-poc repo.

Development environment

When developing the frontend you want to add:

services:
  frontend:
    entrypoint: "echo 'service disabled'"
    restart: "no"

to your docker-compose.dev.yml file, to run the backend use:

docker-compose -f docker-compose.yml -f docker-compose.dev.yml up

to run the frontend clone the repository:

git clone https://github.com/shmdoc/frontend-shmdoc-osoc-poc.git

install Vue:

npm install vue

install the node modules from inside the root of the projectdirectory:

npm install

and run the the development server:

npm run serve

now the frontend should be available on port 8080 and you can start developing.

Project structure

In this project we use Vue in combination with Vuex and the Vue router. The 'pages' can be found in the src/views folder. In these views we use components which you can find in the src/components folder. The navigation between the pages is described in the src/router/index.js file. The store and modules (src/store) is used to keep a central state even when switching between pages, for more info check the docs.

Communication with backend

To communicate with the backend we use the JSON API specifications. You can find some examples in the store modules.