Matestack Ui Core
AboutMatestack Ui CoreMatestack Ui VueJsMatestack Ui Bootstrap
1.5
1.5
  • Welcome
  • Getting started
    • Installation & Update
    • Concepts & Rails Integration
    • Quick Start
    • Support & Feedback [WIP]
    • Common Issues [WIP]
  • UI Components
    • Component Overview
    • Rails Integration
    • Component Registry
    • General Component API
    • Haml Components
    • Reusing Views or Partials
    • Testing [WIP]
  • Reactivity
    • Reactivity Overview
    • Rails Integration
    • Actions
    • Forms
    • Async
    • Cable
    • Isolated
    • Collection
    • Custom Vue.js Components
    • Vue.js Event Hub
    • Vuex [WIP]
  • SPA-like Apps
    • SPA Overview
    • Rails Integration
    • App API
    • Page API
    • Transitions
    • Authorization
    • Tutorial
      • Creating a SPA-like App with Matestack
      • Essential Guide 1: Setup
      • Essential Guide 2: ActiveRecord & Database
      • Essential Guide 3: Person Index, Show, Transition
      • Essential Guide 4: Forms & Actions (Create, Update, Delete)
      • Essential Guide 5: Toggle Component
      • Essential Guide 6: Async Component
      • Essential Guide 7: Partials and custom components
      • Essential Guide 8: Collection and async component
      • Essential Guide 9: Custom Vue.js components
      • Essential Guide 10: Styling and Notifications
      • Essential Guide 11: Authentication
      • Essential Guide 12: Heroku Deployment with Postgres
      • Essential Guide 13: Wrap Up & Outlook
  • Components API
    • Core Components
      • Abbr
      • Address
      • Area
      • Article
      • Aside
      • B
      • Bdi
      • Bdo
      • Blockquote
      • Button
      • Br
      • Caption
      • Cite
      • Code
      • Data
      • Datalist
      • Dd
      • Del
      • Details
      • Dfn
      • Dialog
      • Div
      • Dl
      • Dt
      • Em
      • Fieldset
      • Figure
      • Footer
      • Hr
      • Icon
      • Iframe
      • Img
      • Ins
      • Input
      • Header
      • Heading
      • Kbd
      • Label
      • Legend
      • Link
      • Lists
      • Main
      • Mark
      • Map
      • Meter
      • Nav
      • Noscript
      • Object
      • Option
      • Optgroup
      • Output
      • Paragraph
      • Param
      • Picture
      • Pg
      • Plain
      • Pre
      • Progress
      • S
      • Samp
      • Section
      • Select
      • Small
      • Span
      • Sup
      • Sub
      • Strong
      • Table
      • Template
      • Textarea
      • U
      • Unescaped
      • Q
      • Rails View
      • Rp
      • Rt
      • Ruby
      • Var
      • Video
      • Wbr
      • Youtube
    • Reactive Core Components
      • Action
      • Async
      • Cable
      • Collection
      • Form
      • Form Input
      • Form Checkbox
      • Form Radio
      • Form Select
      • Form Submit
      • Form Textarea
      • Onclick
      • Transition
      • Toggle
  • Integrations
    • Action Cable
    • Devise
    • CSS Frameworks [WIP]
    • Third Party JavaScript [WIP]
    • Third Party Ruby Gems [WIP]
  • Matestack Addons
    • Create your own Addon [WIP]
  • Community
    • Discord
    • Contribute
  • About
    • Core Team [WIP]
    • Sponsoring [WIP]
    • Legal Details [WIP]
Powered by GitBook
On this page
  • Introduction
  • Prerequisites
  • Adding Postgres
  • Deployment
  • Creating an admin
  • Recap & outlook

Was this helpful?

Edit on GitHub
  1. SPA-like Apps
  2. Tutorial

Essential Guide 12: Heroku Deployment with Postgres

PreviousEssential Guide 11: AuthenticationNextEssential Guide 13: Wrap Up & Outlook

Last updated 3 years ago

Was this helpful?

Demo: Github Repo:

Introduction

In this guide, we will

  • install and use PostgreSQL instead of SQLite3

  • deploy our application to heroku

Prerequisites

We expect you to have successfully finished the .

  • Heroku CLI ()

  • Postgresql ()

Adding Postgres

In the Gemfile, replace the line starting with gem 'sqlite3' with gem 'pg'.

Make sure to run bundle install afterwards and replace the contents of config/database.yml with

Note for Linux/Ubuntu users You may need to install additional libraries by running sudo apt-get -y install postgresql postgresql-contrib libpq-dev instead of only running sudo apt-get install postgresql. </details>

Note for postgres role error If you get an error from postgres stating that your role is missing add it by creating a user. To do so run below codesnippet. sudo su - postgres && createuser -s -r postgres </details>

default: &default
  adapter: postgresql
  encoding: unicode
  # For details on connection pooling, see Rails configuration guide
  # https://guides.rubyonrails.org/configuring.html#database-pooling
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>

development:
  <<: *default
  database: myapp_development

test:
  <<: *default
  database: myapp_test

production:
  <<: *default
  database: myapp_production
  username: myapp
  password: <%= ENV['MYAPP_DATABASE_PASSWORD'] %>

Deployment

To set up a new heroku project, run

heroku create

followed by

git push heroku master

to trigger a deployment. When we have new migrations or didn't initialize the database yet, we need to run

heroku run rails db:migrate

In an earlier guide we added some persons with seeds to our local database. In order to also seed some persons into our production database on heroku we need to run

heroku run rake db:seed

After the deployment, our database migrate and seeds task successfully finished we can visit our deployed application by running heroku open.

If you have used assets like we did in our application remember to run heroku run rails assets:precompile.

Creating an admin

In order to be able to login, we need to create an admin. We could add one in our seeds but we wouldn't recommend doing it. Instead we can use another of herokus features. Opening a rails console connected with the production database of our live application.

heroku run rails console

After the console opened we can now create an admin using the create method of our Admin model with an email, password and password confirmation as parameters.

Admin.create(email: 'admin@example.com', password: 'OnlyForSuperMates', password_confirmation: 'OnlyForSuperMates')

Now we can close the console and run heroku open again. We can now login to our admin app with the above specified credentials.

Recap & outlook

We successfully deployed our application to heroku and learned what are the necessary steps to do this. We also switched our application database from sqlite to postgres, because heroku doesn't support sqlite.

While the application is good as it is right now, go ahead and check out the .

Matestack Demo
Matestack Demo Application
previous guide
view installation details
view installation details
last part of the tutorial