How I build Shopify Apps

The Tools

I use:

• Ruby on Rails w/ shopify_app gem
• Polaris Components for the app’s admin design, but I use the pure CSS/HTML method instead of the intended use as a React component bc I’m a neanderthal
• Ngrok to give my localhost server a secure public URL
• Heroku for hosting the app

The Setup

When you start building apps for Shopify, one thing that isn’t clear is how you should config the apps in the Shopify admin.

I reached out to Ryan Kulp awhile back with this question, and he was kind enough to set me on the right path:

1. Create two Shopify apps in the admin, one for production/app store that points to heroku and one for development that points to ngrok/localhost.

2. Then, in your RoR app within /config/initalizers/shopify_app.rb you want to use your development app keys for development and your production app keys for production (duh).

# config/initalizers/shopify_app.rb
ShopifyApp.configure do |config|
  config.application_name = "App Name"
  if(Rails.env.production?)
   config.api_key = "ProductionKeyHere"
   config.secret = "ProductionSecretHere"
  else 
    config.api_key = "DevelopmentKeyHere"
    config.secret = "DevelopmentSecretHere"
  end 

(You should accomplish this with env variables if you will be putting app code in repository.)

Then it’s as simple as developing in localhost w your development app, and when you’re ready to push those changes in production, run your git push heroku master terminal command