Building an OAuth App for BigCommerce using Rails | Part 0: Overview & Requirements

A step-by-step guide to getting the scaffolding of a BigCommerce app up and running.

BigCommerce is one of the fastest-growing e-commerce platforms out there, and one of their big selling points is their extensibility and API-first design. In this article, I’m going to step you through setting up your first one-click OAuth app for BigCommerce.

Let’s get started!

What is a BigCommerce app?

A BigCommerce app is just a server-side application that’s built by a developer, hosted on the developer’s own infrastructure, which connects with a BigCommerce store.

It allows third party developers to build new features or enhancements that BigCommerce store owners can use without BigCommerce having to build and support them themselves.

You can check out the many BigCommerce apps currently available via their Apps & Integration page.

Apps can be about anything from marketing and merchandising tools, to order management, customer lifecycle management, and beyond.

BigCommerce has a Getting Started Guide and a Developer Portal which have all of the information you need to learn about app requirements, setting up your app, and submitting your app to BigCommerce for review and acceptance into the BigCommerce App Store.

For our example, we will be building a simple scaffold of a BigCommerce app which authenticates using OAuth (the recommended authentication strategy for the BigCommerce API). Using this as a base, you should be able to build any type of BigCommerce app your heart desires!

Overview of Our App & Requirements

By the time you finish this article/series, you should have a running Rails 7 app on your local machine, accessible to the internet via ngrok, which is able to authenticate with the BigCommerce API and “install” on to a BigCommerce store just like any app in the BigCommerce App Store.

In short, you’ll have a working, install-able BigCommerce app running on your local computer!

To keep things simple, we will focus on setting up a basic Rails 7 app using the BigCommerce authored Ruby gems bigcommerce-api-ruby(to authenticate the BigCommerce OAuth handshake) and omniauth-bigcommerce (to connect to a BigCommerce store’s API).

Our Rails app will run locally on our computer for now, that way we won’t have to focus on setting up outside infrastructure or deploying to a commercial server just yet.

Because our Rails app will be running locally, we will need to utilize a free service called ngrok to allow us to route some specific internet traffic back to our Rails app on our local machine. This will allow us to give a specified url to the BigCommerce developer portal, something like 1234-5678.ngrok-free.app , which ngrok then securely redirects to our local Rails app.

ngrok running on my local machine

Note, this is a temporary step only needed to test an app locally; later, once you deploy your app to a web server, it will be publicly available online without ngrok.

Also, we will need to make sure we’ve set up the appropriate BigCommerce resources to support our work, including signing up for a free BigCommerce trial store and a free BigCommerce developer account. These will provide you with the appropriate API keys to authenticate against your BigCommerce store and against BigCommerce’s OAuth app infrastructure to install and uninstall apps.

Phew! Seems like a lot, but once you walk through the entire flow you’ll see that setting up a basic BigCommerce OAuth app isn’t really all that confusing.

Let’s begin!

Part 1: Setting Up Prerequisites

1. Create a free trial store with BigCommerce
2. Setup a free developer account with BigCommerce
3. Create a new one-click app in BigCommerce
4. Setup a free `ngrok` account to get a pubic URL for testing your app locally

Part 2: Creating a Rails 7 App and Connecting to BigCommerce

1. Install a new Rails 7.0.7.2 app locally
2. Set a home page for our Rails app
3. Update our Rails app to work with ngrok
4. Edit our gemfile / Add new gems
5. Set up our local environment variables
6. Update the app settings in the BigCommerce Developer Center
7. Update our Application Controller for BigCommerce API requests
8. Create a user and store model and table
9. Set up the `omniauth-bigcommerce` gem
10. Create our authentication routes and controller
11. Test out our app

Let’s get started

Head onward to Part 1: Setting Up Prerequisites now!