Prerequisites

Before deploying the application, ensure that you have firebase-tools installed globally. If not already installed, run:

$ npm install -g firebase-tools

Build the Project

The project needs to be built before deployment. To create a production-ready build, use the following command:

$ npm run build

This command compiles the TypeScript and SCSS files into JavaScript and CSS, producing optimized assets for production use.

Deploying to Firebase

To deploy the application, you will utilize Firebase hosting. The key steps are as follows:

1. Set the Firebase Project Target: Update the hosting target for Firebase. This will ensure that your deployment goes to the correct location in Firebase.

$ npm run use:project

2. Deploy the Assets: Execute the deployment command, which uses the Firebase CLI to deploy the app.

$ npm run deploy

The deploy script in audience-app/package.json includes the following steps for deployment:

"deploy": "npm run use:project && firebase deploy"

This command first selects the correct Firebase project and then executes the Firebase deploy command.

3. Deploy Reset (optional): If you need to deploy the application and reset the database with a predefined template, use the following command:

$ npm run deployReset

This combines the deploy command with resetting the database:

"deployReset": "npm run deploy && npm run data"

To ensure that your data is correctly set, you must have a JSON template in ./database.template.json.

Post-Deployment Step

After deploying, it is essential to check that the rules within the Firebase console remain in sync with your database.rules.json. Failure to do this will result in the rules being reset during deployment. Always ensure the complete and accurate copying of rules from the Firebase console before you deploy.

Running the Application Locally

For local development, after you set up everything, initiate the server to test the application before final deployment:

$ npm start

This command will run the app on http://localhost:5000/.

Useful Scripts in package.json

Here are some useful scripts dedicated to maintaining the quality and functionality of the application:

• Lint TypeScript Files:

$ npm run lint

• Run Tests:

$ npm run test

These scripts help to ensure that the application is free of potential issues before you finally deploy to production.

Important Notes

Ensure that the rules defined in your Firebase console are also reflected in the firebase.json configuration file, where you specify your database rules under “rules” key.

{
  "database": {
    "rules": "./database.rules.json"
  }
}

Also, always make sure to check for memory leaks and conduct playtests as part of the pre-deployment checklist.

Conclusion

For reliable updates and maintenance of the application, adhere strictly to the outlined deployment process, ensuring constant syncing of database rules and performing necessary checks to maintain performance and stability.

Source: audience-app/README.md, presenter-app/src/style/main.scss, README.md.