An 8-part tutorial on how to build a Ruby on Rails API based app using Vue.js as the frontend
Did you know Ruby on Rails can be used as a strict API based backend application? What's the benefit to this? Think of it as a single source of truth for multiple future applications to absorb and use this data directly. Anything from a native mobile application, to a front-end framework, can talk with this data. Many apps can essentially communicate with a "source of truth" in return which means more consistent applications for all.
In this build, I'll be crafting a simple but thorough application where Ruby on Rails is our backend and Vue.js + Axios is our front-end. I'll create two apps that communicate in order to achieve the same result of a normal Rails-based app but with all the perks of an API.
Rails 5.2.2
Ruby 2.5
- Gem
bcrypt 3.1.7
- Gem
rack-cors
- Gem
redis 4.1.0
- Gem
jwt-sessions
This app at its core is simple. It will be an archive of vinyl records for sale and categorized by artist. We won't be implementing a ton of foreign logic but rather just getting the foundations of an API-based application in order. We'll touch on authentication (not using Devise 😉) and basic CRUD.
There will be two apps.
- A Ruby on Rails backend - This will handle our data, sessions, and authentication.
- A Vue.js frontend - This will be the view layer but also the one responsible for sending and receiving data to our rails-based backend. The front-end will run on a different instance using the Vue-CLI to help us set up an app.