Introduction

I always have a problem with production, and I hate it. However, it is really important to host our project. After I finished my Flatiron class for 15 weeks, I decided to host my projects and created this tutorial. I hope it will be helpful.

Add Procfile and Procfile.dev in Rails Project

Create Procfile and Procfile.dev inside the root folder

# root/Procfile
web: bin/rails server -p ${PORT:-5000} -e $RAILS_ENV
release: bundle exec rails db:migrate
release: bundle exec rails db:seed
# db:seed is optional, if you use db:seed it will reseed data every time you push)
# add any other commands

Push the changes.

Install Heroku CLI

Follow this documentation.

Create New App

Run this command in inside rails folder

heroku create --stack heroku-18

I'm using heroku-18 stack because my ruby version is ruby-2.6.1. if your ruby version is supported for heroku-20, you do not need this command.

Change the Heroku app name (optional)

heroku apps:rename herokuy-deploy-test

Using credentials.yml / master.key (Optional)

If you are using master.key, you should set it up to the Heroku. master.key will not push to the repository because it includes to the .gitignore.

heroku config:set RAILS_MASTER_KEY=`cat config/master.key`

Source

Go to Heroku Dashboard

Heroku App will be available.

• Click the new app and choose the deploy section.
• Connect with your GitHub repository.
• Turn on Enable Automatic Deploys
• Choose a branch to deploy, and Deploy Branch.

Try my Rails API

• https://herokuy-deploy-test.herokuapp.com/api/v1/users
• https://herokuy-deploy-test.herokuapp.com/api/v1/posts

Bonus: Set origin CORS dynamically (on Development or on Production)

It will be very helpful, so we do not need to change the cors whenever we are in production or development.

# config/environments/development.rb
Rails.application.configure do
    ...

    # cors origns
    config.allowed_cors_origins = "*"
end

# config/environments/production.rb
Rails.application.configure do
    ...

    # cors origns
    config.allowed_cors_origins = "front-end link without http://"
    # ex: config.allowed_cors_origins = "netlikuy-deploy-test.netlify.app"
end

# config/initializers/cors.rb
Rails.application.config.middleware.insert_before 0, Rack::Cors do
    allow do
        origins Rails.application.config.allowed_cors_origins

        ...
    end
end

Deploy your React App?

How to Deploy React to Netlify

Raynaldo Sutisna ・ Feb 21 '21

#react #netlify #webdev #tutorial

Please leave a comment below, and let me know if you need help:)