CIOOS Metadata entry form
Below is the system architecture diagram which provides an overview of the data flow and interaction between components within the application:
For a more interactive and detailed view, see the Lucidchart Diagram.
Install Node
In this directory, run npm install
npm start
This will start a hot-reloading dev server. Click on the link that it outputs to open in your browser.
Monitoring of production site availability is done via the cioos-upptime and notices are posted to the CIOOS cwatch-upptime slack channel. Error collection is performed by sentry and reported in the cioos-metadata-entry-form project.
Install firebase CLI as described here.
Run firebase emulators:start
from the firebase-functions/functions
directory.
Redirect function calls to this emulator by uncommenting the call to connectFunctionsEmulator
in src/firebase.js.
Pushes to master automatically deploy to https://cioos-siooc.github.io/metadata-entry-form/
Or manually deploy any branch with
npm run deploy
firebase hosted preview sites are created for all pull requests. Once a pull request is generated, check the pull request comments on github for the link to the preview site. Deployment is handled by the firebase-hosting-pull-request.yml
github action. Preview sites are deleted during a pull request close event or after 30 days of inactivity on the pull request. Any commit to the pull request branch will reset the timer.
Our Firebase Functions infrastructure utilizes both GitHub Actions for automated and manual deployments and parameterized configuration for management of environment variables and credentials.
We use a GitHub Actions workflow named firebase-deploy
for deploying Firebase Functions. This workflow is triggered automatically on push to the main branch but can also be executed manually for feature branches.
.env
file with necessary configurations for the deployment process.firebase-deploy
workflow.To deploy updated Firebase functions to the "cioos-metadata-form-dev" development project, follow these steps:
Ensure your local setup is linked to the correct Firebase project by using the Firebase CLI to login and select the "cioos-metadata-form-dev" project.
firebase use cioos-metadata-form-dev
Make necessary changes to your Firebase functions.
Deploy the changes by running the command:
firebase deploy --only functions
This will deploy the updated functions to the development project. The GitHub Action for deploying to the preview URL is already configured to use this development project, ensuring that any previews generated from pull requests will interact with the updated dev functions instead of the production version.
The workflow utilizes the following secrets to create the virtual .env
file for the deployment process:
GMAIL_USER
notificationsGMAIL_PASS
notificationsAWS_REGION
used for amazon translate service accessAWS_ACCESSKEYID
used for amazon translate service accessAWS_SECRETACCESSKEY
used for amazon translate service accessGITHUB_AUTH
used to push to github pages branch and other github action type stuffREACT_APP_DEV_DEPLOYMENT
used to switch between development and production databases. Default False, set to True to use Dev databaseREACT_APP_GOOGLE_CLOUD_API_KEY
found at https://console.cloud.google.com/apis/credentials?project=cioos-metadata-formREACT_APP_GOOGLE_CLOUD_API_KEY_DEV
found at https://console.cloud.google.com/apis/credentials?project=cioos-metadata-form-devOur Firebase Functions leverage parameterized configuration for managing sensitive information. This helps prevent functions from being deployed with missing configurations/credentials.
For details on defining and accessing these parameters, refer to the official Firebase documentation.
.env
file within the functions
directory for local development, mirroring the setup of parameters used in production environments.The use of GitHub Secrets and the creation of a virtual .env
file during the workflow run ensures that sensitive information is handled securely, without persisting in the repository or exposing it beyond the lifecycle of the workflow execution.
.env
Files from Version Control: Ensure .env
files are not included in version control to prevent exposure of sensitive data..env
Files: The .env
file created during the GitHub Actions workflow is virtual and transient. It exists only for the duration of the workflow run and is not committed to the repository.Deploying Firebase Realtime Database security rules via the Firebase CLI is recommended to facilitate version control and consistency across development workflows.
database.rules.json
file.This project has two databases: cioos-metadata-form
(this is the default/main db for production) and cioos-metadata-form-dev
(dev).
Use Firebase CLI targets to manage rules deployment:
firebase target:apply database prod cioos-metadata-form
firebase target:apply database dev cioos-metadata-form-dev
Update your firebase.json
to map .rules
files to your targets.
{
"database": [
{
"target": "prod",
"rules": "database.rules.json"
},
{
"target": "dev",
"rules": "database.rules.json"
}
]
}
Deploy your database rules using the Firebase CLI:
# Deploy to a specific environment
firebase deploy --only database:dev # For development
firebase deploy --only database:prod # For production
.rules
file reflects the latest ruleset. Keep the rules file in sync with any console edits to avoid unintended overwrites.Review the Firebase CLI documentation for more details on managing project resources.
When hosting the application in a new place there are a couple of things to update.
You must add your new domain to the allowed list for authenication in firebase. https://console.firebase.google.com/u/0/project/cioos-metadata-form/authentication/settings https://console.firebase.google.com/u/0/project/cioos-metadata-form-dev/authentication/settings
You have to allow your domain under Website restrictions for the firebase browser key https://console.cloud.google.com/apis/credentials/key/405d637a-efd4-48f5-95c6-f0af1d7f4889?project=cioos-metadata-form https://console.cloud.google.com/apis/credentials/key/23d360a3-4b55-43f2-bc1c-b485371c0e07?project=cioos-metadata-form-dev