tsoporan / fittrak

A data-driven workout tracking tool for the quantified-self 🤓.

NOTE: This is the core, open sourced version, of FitTrak and may be lagging behind the deployed version at https://fittrak.ca!

Requirements

For local dev you'll require:

• Back-end:
  • Docker
  • docker-compose
• Front-end:
  • npm

Back-end

The back-end consists of a Django powered Python application which exposes a GraphQL API using Graphene. Django is being used to deal with authentication, and other various functions, and as such there are some views which are rendered from Django. You may think of Django as rendering the template which houses the front-end SPA.

Front-end

The front-end is a Vue powered Javascript application which uses Apollo as a GraphQL client. When deployed in production this simply makes API calls to /graphql and benefits from the rest of the Django machinery.

NOTE: For local dev the back-end must be up and running as that is where the API (GraphQL server) runs (requests to /graphql will fail otherwise!) Authentication is based on sessions with IDs stored on cookies, which will be on localhost in dev, this works fine as only the ports change between the two servers. Keep an eye out for issues pertaining to authentication as the default behaviour, at the moment, is to return a 302, rediret to /login, which will present an error on the front-end console.

Development

Clone the repo:

git clone [email protected]:tsoporan/fittrak.git && cd fittrak

Back-end

The preferred way to bring up the stack is using Docker and docker-compose.

cd fittrak
# Bring up only the API to run migrations
docker-compose up
docker-compose run api python fittrak/manage.py migrate

# Create the first user (admin)
docker-compose run api python fittrak/manage.py createsuperuser

You can also run everything independently, which would require: postgresql, python3.7 and pipenv.

With docker we can conveniently package these up and not worry about external deps.

NOTE: When running independently make sure you're aware of the env variables required (check env.example and set .env)

There are two services that comprise the back-end: api and fittrak_db. docker-compose up brings them all up though you may start each one with their respective docker-compose up <service_name> command.

It is also useful to know how to work with docker and docker-compose, in general, as you may need to rebuild and interact with containers during dev.

Front-end

Using npm:

cd fittrak-client && npm install

export VUE_API_URL=http://localhost:8000/graphql

npm run serve

Migrations

To apply DB migrations we can run a command in the container:

• docker-compose run api python fittrak/manage.py makemigrations
• docker-compose run api python fittrak/manage.py migrate

Tests

Tests can be run with the usual:

• docker-compose run api python fittrak/manage.py test
• npm run test:unit

Deployment

Firstly check how the app behaves in production mode:

# Build production bundle

cd fittrak-client
NODE_ENV=production npm run build

# This will dump the assets in ../fittrak/assets which will be picked up
# by the "render_bundle" template tag in Django

# Set DEBUG to "False" in docker-compose
docker-compose up

# Visit http://localhost:8000

The application currently sits on a GCP VM and uses Cloud SQL (PostgreSQL 9.6). SSL is through LetsEncrypt and the Nginx Certbot

Future plans may include IaC, and moving to a more robust container solution, such as k8s, though it's fairly overkill at the moment.