Deploy an Angular 12 App with a Rails REST API Back end, using GitHub Pages and Heroku

API Deployment

Let’s start with the back end. I like to deploy my back end first, so I can test the front end with a live API before deployment. This assumes you’ve already built your Rails API, including models, controllers and routes, and it’s just sitting there waiting for you to deploy it.

sudo snap install --classic heroku
heroku login
git init
git add .
git commit -m "deployment preparation"
heroku create
git push heroku master
git push heroku main
heroku run rake db:migrate
heroku run rake db:seed
heroku run rails console

Deploy the Angular App

This assumes you already have Angular CLI installed and an Angular app in a GitHub repo ready to deploy.

ng add angular-cli-ghpages
ng deploy --base-href=/<yourRepoName>/

Conclusion

This wasn’t too difficult but like many things I found these instructions in pieces across the web. Posting this in case anyone else using these two technologies together needs to accomplish the same thing. Thanks for reading!

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Christopher Dent

Christopher Dent

6 Followers

student of code. var my_homes = [‘NY’, ‘MTL’, ‘DC’, ‘EDI’, ‘FL’, ‘?’]