How to Deploy the Backend and Frontend to Production

This guide will show how to deploy the backend and the frontend to our production environment. Our frontend is deployed on Netlify and our backend is deployed on Heroku. This was done because of convenience (Netlify has a great interface for deploying frontend websites and Heroku is great for deploying backend). Feel free to change the deployment site if desired, but be sure to keep this document up-to-date if you decide to do so.

This document assumes you already have access to the backend and frontend apps on Heroku and Netlify respectively.

Deploying the Frontend

Netlify usually automatically deploys changes that come into main. If this is undesired behavior (because the backend does NOT automatically deploy). It can be turned off in build settings.

This section assumes you've already set up the "Meepanyar" app on Netlify

1. Our frontend is deployed on Netlify. Go to https://app.netlify.com/ and sign in to the meepanyar app.
2. Click "meepanyar" under the "Sites" section
3. Click the "Production Deploys" section '
4. If you click on the "Deploy Settings" and scroll down, you can set any necessary environment variables. Currently, we have the following environment variables set:
   • REACT_APP_AIRTABLE_API_KEY
   • REACT_APP_AIRTABLE_BASE_ID
   • REACT_APP_AIRTABLE_ENDPOINT_URL
5. After you're done with step 4, go back to the "Production Deploys" section. Click the "Trigger Deploy --> Deploy Site"
6. You will be sent to a screen similar to this. You can watch your deploy occur.

Netlify's interface is really user-friendly. Feel free to go searching around on it. You can change environment variables under the "Deploy Settings".

Deploying the Backend

Our backend is on Heroku. Our backend is not automatically deployed. This was done mostly to save credits since continuous deployment wasn't necessary during testing.

1. Go to https://dashboard.heroku.com/apps and click the backend app (ours is called meepanyar-node)
2. You may set any environment variables necessary in the "settings" section. Click "Reveal Config Vars" and you can put it any necessary environment variables the backend requires. Currently, our backend has the following environment variables:
   • AIRTABLE_API_KEY
   • AIRTABLE_API_VERSION
   • AIRTABLE_BASE_ID
   • AIRTABLE_ENDPOINT_URL
   • AIRTABLE_USER_AGENT
   • AZURE_STORAGE_ACCOUNT_NAME
   • AZURE_STORAGE_CONNECTION_STRING
   • DISABLE_HASH_PASSWORD
   • PRODUCTION_WEB_URL
   • REACT_APP_AIRTABLE_API_KEY
   • REACT_APP_AIRTABLE_BASE_ID
   • SALT_ROUNDS
   • SERVER_URL (points to itself)
3. Go to the "Deploy" tab and at the bottom you can enable automatic deploys or deploy manually.