Skip to content

A React app built with Firebase to manage occupations and Affiliates of that occupations

License

Notifications You must be signed in to change notification settings

hexetia/mlbadmin

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

MLB Admin

img img

About this Project

This APP was born from the need to digitize and accelerate the access of data of the members to the movement. Various activities, such as meetings of occupants, needed contact by phone and searching for this data on paper cards was time consuming.

Continuous Delivery ✔️

On every commit on main a new app version is published on Firebase automatically*

Continuous Integration ✔️

On every pull request that target main all unit and integration tests will run, and you can see if is safe to merge that PR

*add FIREBASE_TOKEN secret in your github repository, get token using firebase login:ci

Built with ❤️ and

Requirements

  • Firebase CLI You'll use firebase cli to run emulators that is needed to run local dev server, local tests and deploy the app.

  • Yarn Manage the multi repository arch of this project using yarn workspaces.

  • Firebase Blaze plan to deploy, it's needed to run Firebase Functions, but have a free tier.

Backend features

Some features need to be server side to reduce the number of Firestore reads ( like statistics ) and to ensure secure handling of data.

  • Multiple Administrators
    • Invite new users (by email) to be Editors and Administrators
    • Auto removal unused/expired invites
    • Administrators can manage all accounts except first one's that's locked and configured in .env.local > APP_ADMIN_EMAILS
  • Statistics
    • Compute the total number of Occupations and Affiliates
    • Compute the total number of affiliates birthdays on current month
    • Compute the number of affiliates per occupation
  • Show upcoming affiliates birthdays per Occupation
  • Attachments are automatically removed from Occupations and Affiliates when they are deleted
  • Automatic relation update on when an Occupation related to some affiliates are removed docs

Configuration

.env.local

In the project's root folder rename the file .env.local.example to .env.local
and add the following variables:

  • APP_ADMIN_EMAILS - the only one required
    The initial admin emails that will be auto recognized by the auth system as Administrators.
    You can put several emails on that list, as long as they are separated by a comma.

  • APP_DOMAIN - optional
    The app domain that will appear on invited users emails.

  • APP_MAIL_SOURCE - optional
    The email source you registered with AWS ses to send system emails.

  • AWS_SES_ACCESS_KEY - optional
    Aws credentials to send the system emails.

  • AWS_SES_SECRET_ACCESS_KEY - optional
    Aws credentials to send the system emails.

/.firebaserc

Use the Firebase cli "use" command firebase use to update the project name before building and deploying

Firebase hosting redirects

We made a custom script to map next.js routes in firebase.json, so you need to write custom redirects in firebase hosting you need to write that redirects in firebaseHostingRewrites.js

Backend serverless functions

Users Management -> packages/functions/src/usersFunctions.ts

  • onCreateUser

    • Firebase don't have a way to apply constraints on user registration, so every created account that don't have an invitation will be removed just after the register (fortunately the frontend is capable to detect that)
  • changeRole - https endpoint

    • Change user role on customClaims, the targeted role can be Administrator and Content Editor
  • deleteUser - https endpoint

    • Users with Administrator role can use that callable function to delete a user

Affiliates -> packages/functions/src/affiliatesFunctions.ts

  • onCreateAffiliate

    • Compute statics about total number off affiliates and number of affiliates on each occupation
  • onUpdateAffiliate

    • Update computed statistics
  • onDeleteAffiliate

    • Update computed statistics to not count with that affiliate removed

Attachments -> packages/functions/src/attachmentsFunctions.ts

  • onDeleteAttachment
    • Attachments deleted from Firestore will run that function to remove the real file from Firebase Storage

Invites new Editors and Administrators -> packages/functions/src/invitesFunctions.ts

  • onCreateInvite

    • Send email to user invited informing him that he was asked to manage the system data
  • deleteExpiredInvites

    • A cron function that run every 24 hours to delete expired invites (expired invitations are invitations that are older than 72 hours)

Occupations -> packages/functions/src/occupationsFunctions.ts

  • onCreateOccupation

    • Compute general statistics
  • onDeleteOccupation

    • Compute general statistics
    • Remove occupation relation on affiliates
    • Delete all attachments attached to that Occupation

But not least

  • All integration tests will run on port 3000 (next.js server)
  • If you need to use the Firebase Hosting Emulator you need to first build the frontend using the command: yarn build:front

Available Commands

In the project directory, you can run:

yarn deploy

Build front and backend and deploy all functions and hosting files to firebase.

yarn start - shortcut of yarn dev && yarn emulators

Runs the app in the development mode, this will start next.js server and firebase emulators.
open http://localhost:3000 to view it in the browser. you can also open http://localhost:4000 to view firebase emulators-ui in the browser.

The page will reload if you make edits.

yarn emulators

Launches the firebase emulators

yarn test

Run all unit tests.

yarn test:integration

Run all integration tests.

yarn build - shortcut of yarn build:front && yarn build:functions

Builds the whole app for production.
It bundles React in production mode and optimizes the build for the best performance.
It also build the backend functions in production mode.

The build is minified and the filenames include the hashes to avoid browser cache when a new version is released.
Your app is ready to be deployed!

You can also deploy only frontend with firebase deploy --only hosting see https://firebase.google.com/docs/hosting/manage-hosting-resources for more details.

About

A React app built with Firebase to manage occupations and Affiliates of that occupations

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published