Skip to content

qlab-team/qlab

Repository files navigation

QLAB

qlab logo

QLAB, where effort is the currency.

QLAB is a learning envioronment where you can learn any topic to earn points. You can then invest your points in your friends to benefit from their effort and create a collaborative growth environment.

qlab screenshot of dashboard

Try out the app @ qlab-cc.web.app

Project

Our feature plans for the app:

  • CI/CD Pipline ➰
  • User can sign in and create personal profile 👤
  • User can take a quiz and gain points for it 👩🏻‍🏫
  • Users can invest points in their friends 💰
  • Investment statistics based on daily calculated engagement score 🧮
  • Dashboard 🎛
  • Leaderboard 🔝
  • Multiple quiz types 🧩
  • Make it awesome! 🔥

12 Factor Checklist

  • 1 - Codebase Revision Control
    • Code Stored on Github
  • 2 - Dependencies
    • package.json File Used with Yarn
    • Node Version Specified in Main package.json
    • Node Version Specified in Sub Package.json
  • 3 - Configuration
    • Relevant Firebase Configuration stored in environment variables for deployment in CircleCI
  • 4 - Backing Services - Treat backing services as attached resources
    • This is challenging when considering Firebase, as using the React Firebase CLI ties you into Firebase's 'way of doing things'
    • Frontend is agnostic to the Backend Process Source
  • 5 - Build, Release, Run
    • Build Stage Run in Circle CI
    • CircleCI Deploys Release using some Env Config
    • Firebase Executes the Release
  • 6 - Processes
    • Database is single source of truth
    • App can handle non-existence of localstorage data
  • 7 - Port Binding
    • Runtime Listens on a given port
      • Available Through Firebase
  • 8 - Concurrency
    • Backend Processes That can be concurrent handled as separate cloud functions
  • 9 - Disposability
    • Fast Startup Times for Firestore and Cloud Functions
    • Available Through Firebase
  • 10 - DEV / PROD Parity
    • DEV and PROD Versioning
    • Get CircleCI to fully build from promoted DEV version
  • 11 - Logs
    • User Changes to Database are Logged using a helper cloud function
    • Cloud Function Processes are Logged
      • Cloud Functions are automatically logged with simple console.logs
  • 12 - Admin Processes
    • Admin Code Shipped with Main Codebase
    • Command Line
      • Quizzes can be added from Command Line
        • Added Script to Handle this
    • One off DB changes can be made easily
      • Available Through Firebase
    • One off Cloud Function Operations can be run easily (free with Firebase)
      • Available Through Firebase

Development

In order to run this app locally, please install the Firebase CLI.

First, ensure that your packages are up to date and installed:

yarn

Then login to Firebase:

yarn login

To run a local test of the React App with hot reloading:

yarn start

To run a full integration test with all the Cloud Functions and Firebase packages enabled:

yarn int

Cloud Functions

Due to the (kind of annoying) fact that Google Cloud Platform only supports older versions of Node you will need to use Node 10 to build and deploy the Cloud Functions side of this project. CircleCI is already set up for this

Consider using the Node Version Manager: nvm to make this all a lot easier.

This project specifically uses Node Version node:10.16.3 for its build and cloud functions.

Also, remember to set up your Local Emulator properly with:

export GOOGLE_APPLICATION_CREDENTIALS="path/to/key.json"

Local Host URL for a given function will be at: localhost:5000/qlab-cc/asia-northeast1/didUserQuizYesterday

The QLAB Team

Eriko @nouvelle

Derek Forbes @forbesd7

Fraser Tooth @frasertooth

Vic Sidious @sidiousvic