Summary

So I want to begin by saying this has been the most dificult aspect of bootcamp thus far; user authentication. It's a deep subject, it's dense and it really tested how much I had learned in such a short amount of time. That being said, I finally found a great tutorial series that explained it beautifully. Edutechional's React + Rails API Authentication video series. Here's the link, check it out, it's amazing and helped me finally grasp the basics of this concept. Here's the link to the series on youtube: https://www.youtube.com/playlist?list=PLgYiyoyNPrv_yNp5Pzsx0A3gQ8-tfg66j

Okay so this post will be a summary of what I learned and act as a reference guide for myself for future projects, and hopefully will be a guide for someone else as well.

Rails as the backend

Though rails has an -api only way of creation, the above mentioned series and a few other sources as well in fact, it seems to me that a decent number of devs out there find it is easier to implement an api build when it's not just and api build. Something to do with dependancies and things that are beyond the scope of this blog (and my understanding at the time of writing this blog frankly).

Step 1: create the rails app

I will do my best to make note of where names are specific to my applicaiton and what things are needed as is for the build to work.

# rails new <app_name_here> --database=postgresql
rails new familicule_api --database=postgresql

This gets the ball rolling on things and may take a moment or two depending on your system.

Step 2: gems

I like awesome print, a lot. It makes looking at rails database information, routes, and methods a lot easier, so I have been adding it to all my rails projects as of late.

It easy to do, just open the Gemfile and add gem 'awesome_print', '~> 1.8'. I tend to add it at the top below ruby '2.6.1 but I don't think the location of it is super important as long as it's not placed within the group: ..... sections

The other item that needs to be added to the Gemfile is CORS. This gem does a lot of things, most of which are still a mystery to me. I've added gem 'rack-cors', :require => 'rack/cors' at the bottom of the Gemfile -- again, not sure if it really is important where these go; please comment if you do.

Finally, bcrypt. Lets make sure it's going to bundle install the latest version gem 'bcrypt', '~> 3.1', '>= 3.1.12' update to that and all should be good.

Step 3: CORS and Sessions

Create a cors file that allows for locahost for now but later we will need to also allow deployment server(s)

Rails.application.config.middleware.insert_before 0, Rack::Cors do
  allow do
    origins 'http://localhost:3000'
    resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head], credentials: true
  end

  # allow do
  #   origins 'https://api.herokuapp.com' 
  #   resource '*', headers: :any, methods: [:get, :post, :put, :patch, :delete, :options, :head], credentials: true
  # end
end

Session Store is another initalizer which defines what the cookie is going to be called on a local system and the domain the cookie is tied to.

if Rails.env == 'production' 
  Rails.application.config.session_store :cookie_store, key: '_familicule_app', domain: 'familicule-api.herokuapp.com'
else 
  Rails.application.config.session_store :cookie_store, key: '_familicule_app'
end 

Skipping ahead a little; the conditional allows for a localhost for testing and a deployed domain for deployment.

Step 4: Basic route and controller

The last two files to create so that we can test that this rails app can be spun up are a route in the routes.rb file and a controller called static_controller.rb.

In routes.rb:

root to: 'static#home'

This creates a route for the browser to look at a controller called static at it's root level.

The static_controller.rb will one def, home (to match the static#home in the routes.rb file).

class StaticController < ApplicationController
  def home
    render json: { status: "It's working" }
  end 
end

Spin up the rails server rails s -p 3001.

Note: I spin the rails server up on port 3001 so it won't conflict with the react server later.

Go to localhost:3001 in your browser and you'll be greeted by a simple rendered json object. {"status":"It's working"}

At this point it's a great time to initialize this backend into github. I won't cover that little step here in this blog (maybe a furture blog), but this will make a perfect master branch. All future steps are in upcoming blog posts - I'm doing this so that this guide isn't a mile long.