Skip to content

ISA Deployment Documentation

Jump to bottom
wilsontruong edited this page Aug 22, 2023 · 31 revisions

Front End

How To Deploy Web Applications Using Expo:

Source For Deploying Front End Locally: https://docs.expo.dev/workflow/web/

Source For Deploying Front End To Web: https://docs.expo.dev/distribution/publishing-websites/

Locally

  1. Install the expo package which contains the Expo CLI used for starting the dev server using:

yarn add expo

  1. Then you can use Expo CLI to install the web dependencies in your project using:

npx expo install react-dom react-native-web @expo/webpack-config

  1. Update the entry file by modifying the entry file to use “registerRootComponent” instead of “AppRegistry.registerComponent”:

image

  1. Start the dev server with the command:

npx expo start --web

This will host your app from a secure origin like https://localhost:19006/, it won’t necessarily be the exact number of 19006, but it could be.

Deploying To Web

If you already have your build created, have tried running it locally, and are confident with how it works, you can skip this section and start trying to reply using one of the methods below like Netlify or Firebase

  1. Creating a build of the project is the first step to publishing a web app. Whether you want to serve it locally or host it on a third-party service, you'll need to export all JavaScript and assets of a project. This is known as a static bundle. It can be exported by running the following command:

  2. Run the universal export command to compile the project for web and create the build:

npx expo export -p web

  1. a) Serve the web app locally by using the Serve CLI to quickly test locally how your website will be hosted in production. If you're using static rendering, then you can serve the static bundle with the following command:

npx serve dist

  1. b) Otherwise, use the --single flag to redirect all requests to the single dist/index.html file.

npx serve dist --single

Netlify:

Netlify has one of the highest compatibility with Expo web apps.

  1. To start manual deployment using the Netlify CDN, you can install the Netlify CLI by running the following command:

npm install -g netlify-cli

  1. Deploy the web build folder by running the following command:

netlify deploy --dir dist

Back End

Source For Deploying Back End To Web: https://devcenter.heroku.com/articles/deploying-nodejs

Deploying a Back-End with Heroku

Prerequisites

  1. You need to have have Node.js and npm installed.
  2. An existing Node.js app.
  3. A free Heroku account.
  4. The Heroku CLI.

Specify a Start Script To determine how to start your app, Heroku first looks for a Procfile. If no Procfile exists for a Node.js app, we attempt to start a default web process via the start script in your package.json.

The command in a web process type must bind to the port number specified in the PORT environment variable. If it doesn’t, the dyno doesn’t start.

For more information, see Best Practices for Node.js Development and Heroku Node.js Support.

Build Your App and Run It Locally

  1. Install the dependencies by running:

npm install

  1. Start your app locally using the "heroku local" command which is installed when the Heroku CLI is installed:

heroku local web --port 5001

  1. Your app now runs on http://localhost:5001/.

How To keep Build Artifacts Out of Git

You should not include node_modules in your Git repository. Create a .gitignore file to exclude specific files or directories. (e.g., /node_modules, npm-debug.log, .DS_Store, /*.env) from version control.

Deploy Your Application To Heroku

Using the following commands to deploy your application via Heroku:

Clone this wiki locally