-
Notifications
You must be signed in to change notification settings - Fork 0
Getting Started
Welcome to the getting started guide. This app runs on Firebase, a suite of software tools created by Google that work to help you quickly build web and mobile apps. There is a lot of information online so I won't bore you with any more information about Firebase here.
Even for local development, the web & mobile apps depend Firebase for authentication, data storage and media storage. If you want to help develop features and/or fix bugs, let me know and I can pass along the Firebase configuration. Alternatively, you can create your own Firebase project.
Before starting, make sure you have this repository cloned locally 💻
First, you'll have to make sure you have node v12 and npm installed correctly. If not installed, we recommend the following steps to getting them set up.
- Install Node Version Manager (NVM)
- Install Node and npm using NVM
Although these instructions use
npm,yarncan also be used if desired.
You can install all dependencies in one go using the following command.
npm run bootstrap
This runs npm install in the root the repository and the app, functions and native-audio folders.
We install
firebase-toolsduring this process. This Firebase CLI will be used in future steps so definitely check out the documentation.
The first step is to create a new project in the Firebase console. Head to the console, sign into your Google account, click the "Add project" button, give your project a name and then click "Continue". On the next page, choose whether you want to enable analytics and continue with the setup. Once you're done, click the "Create project" button and let Firebase do it's thing :) Once the project is ready, click "Continue".
From the Firebase console, head to the "Authentication" tab (on the left) and then click "Get started". It should then take you to the "Sign-in method" tab. Click the "Email/password" row, turn on the first toggle (not the "Email link (passwordless sign-in)" toggle) and then click "Save".
Don't create any users now, there is a script that does this instead.
Head to the "Cloud Firestore" tab and click "Create database". Select "Start in test mode", "Next", select your desired region (the default value is probably fine) and finally click "Enable".
In the "Functions" tab, click "Upgrade project". If you haven't set up a google cloud billing account before, there is lots of information online. Once you have a one set up, click "Purchase" in the modal. I recommend setting up a budget by clicking the "Set a budget alert". Once you've set your budget, click "Close".
Click on the gear icon next to "Project Overview" > "Project settings". In the "General" tab, go down to the "Your apps" (it should say "There are no apps in your project") section and click on the web icon. Give your app a nickname and then click "Register app". Your web app configuration will show up on the next section. Copy these values and paste them in the app/.env file in the placeholders. Each property (e.g. apiKey) has a corresponding placeholder in the .env file (e.g. SNOWPACK_PUBLIC_API_KEY).
In the firebase console, click the gear icon again > "Project settings" and then find your "Project ID". Copy this down since you'll need it for future steps :)
This repository supports both staging and production environments. The scripts folder contains admin scripts that can be used to do routine operations such as creating user accounts. Each script can be configured to run with either environment (more details in scripts/README.md) but you'll need a service account first.
Click the hear icon again > "Project settings" and then select the "Service accounts" tab on the top. Next, make sure "Firebase Admin SDK" is selected and then click "Generate new private key" > "Generate Key". Store this file in the root of the repository as serviceAccountKey.relar-production.json or serviceAccountKey.relar-staging.json. You'll use this file later!
Next, install the gcloud and the gsutil Google Cloud CLI utilities. You'll use these to configure Google Cloud Storage settings.
curl https://sdk.cloud.google.com | bash
exec -l $SHELL
This installs both gcloud and gsutil. You'll have to login to this CLI utility as well (make sure to login to the same Google account).
gcloud init
See the official gsutil installation documentation here.
Now that you have gsutil installed and configured, you can deploy CORS configuration to your storage bucket. First, add https://<PROJECT_ID>.web.app to the origin property in storage.json and remove any values that aren't needed. Next, deploy this configuration to your storage bucket.
gsutil cors set storage.json gs://<PROJECT_ID>.appspot.com
If you want to turn on Sentry, replace the value of SNOWPACK_PUBLIC_FIREBASE_DSN in app/.env with your own Sentry DSN value. This DSN will look something like https://abcd1234@123abc.ingest.sentry.io/1234567. If you don't want to turn on Sentry just yet, use an empty string instead.
Send Grid is an email service that Relar uses to send emails to users. You will need an API key to send out a few emails. Here is some documentation that explains how to get an API key.
Once you have the API key,
You'll need to set a few functions configuration options before it can run.
firebase functions:config:set --project PROJECT \
env.sendgrid_api_key="<SEND_GRID_API_KEY>" \
env.notification_email="<YOUR_EMAIL>" \
env.sentry_dsn="<SENTRY_DSN>"
Setting the
notification_emailis optional. This email will be used to notify you when a new user signs up or you receive feedback.
To get things deployed, you'll have to build them first. Run the following set of commands to build the functions, native-audio and app folders.
# in native-audio/
npm run build
# in functions/
npm run build
# in app/
npm run build:web-production
Note that this builds the web app for production. Another section below will detail how to build the mobile app.
You'll have to login using the same Google account that you created your project under before you can deploy anything.
npx firebase-tools login
This is the last step, hooray!! Just run the deploy command with the correct project ID.
# <PROJECT_ID> should be replaced with the value you just copied
npx firebase-tools deploy --project <PROJECT_ID>
If everything goes well, Relar should be running at https://<PROJECT_ID>.web.app.