Dictionary Game

A small web app to improve my english vocabulary.

Go to the application

What's Included:

• Vue.js: an awesome JS Framework ❤️
  • vue-router
  • vuex: for state management
• jest: for unit testing
• Firebase for authentication + database
• SemanticUI: CSS Framework.

Based on vue-cli 3 and follow his file structure/conventions.

Firebase

This application use Firebase for Authentication and Data storage.
In this project, I use 2 project to separate environments:

Database access rules:

{
  "rules": {
    "users": {
      "$uid": {
        ".read": "$uid === auth.uid",
        ".write": "$uid === auth.uid"
      }
    }
  }
}

Data structure:

├── users/
│   └── {userID}/
|       └── words/
│           ├── {wordId}/
│               // example of a word:
│               {
│                 content: "a word",
│                 enabled: true,
│                 translation: "a word translation"
│               }

Notes:

• Why I don't use array with Firebase
• How to get a Firebase token (official doc)

Dev tools

Available commands:

• npm run serve: start a mini HTTP server
• npm run build build for production
• npm run lint: lint code
• npm test: run unit tests

More information in the official documentation

Deployment

This app is hosted by Github Pages and the Deployment is fulfilled by Travis CI (lint+tests must be green).

Icons

Icons made by Flat Icons.