Deploying

There are various ways of deploying your app. We'll quickly look at each option - more details(custom domains, multiple environments) in the Go live! section of the Roadmap/Tutorial.

Vanilla version of the UI/admin

Heroku

Sometimes, you want to first get the UI right before you start dividing it into components and injecting live data. Editing and exploring ideas works faster when you're only concerned with HTML and CSS.

You'll need to deploy the finished HTML mocks somewhere, so you can show it to your team members, partners and investors. We recommend you deploy to Heroku. Here's how to do it.

Clone the basic-admin repo, and navigate to the folder. Then run

npm run dev

You will notice a new folder appears, called /build. What happens is webpack translates your source files into something a browser can understand.

Open the /deploy folder. You'll notice it contains a /build folder, and a basic express app. This is what we'll use to do the actual deploy. First, create and install the heroku CLI toolblert. In the deploy folder, run heroku create

, then

git push heroku master

If successful, you should see something similar to this:

Running heroku open should show your dashboard, in all it's splendor.

Dashboard Hero version

Now

In your terminal, navigate to your project folder.

npm install -g now
npm run build
cd public
now

Surge

Install surge if you haven't already:

npm install -g surge

Then, from within your project folder:

npm run build
surge public

Firebase

Install the firebase CLI. Navigate to your /public folder and run

firebase init

Follow the on-screen instructions, and then run

firebase deploy

We'll look at how to deploy multiple app profiles(dev/staging/production) and at what's going on behind the scenes in the Architecture section.