Full-Stack Final Project Using React + Redux + Rails

Setup Backend

#gemfilegem 'bcrypt'
gem 'jwt'
gem 'pg'

User model

rails g model User username:string password_digest:string name:string bio:text pronouns:string 
# db/migrat/create_users.rb User Table
# /user.rb model

Controllers

ApplicationController

AuthController

skip_before_action :require_login, only [:login, :auto_login]

UsersController

create action for User
Strong params

Routes

Frontend User Authentication With React + Redux

User Actions

Now this (below), is where the fetch calls take place, the user.js actions.

There’s a lot going on here, so break it down a bit:

User Reducer

Protected Routes

index.js BrowserRouter

Higher-Order Components

Home Component — If User’s Authenticated

If User Is NOT Authenticated — Redirect’s to /loginRequired

/loginRequired component prompts user to create account or login
loginRequired Component

Login

Unsuccessful Login

Authentication failed /login
Redux Action upon auth error

Upon successful authentication

Login Component

Create Account

Upon successful submission:

Upon authentication, the token is saved to localStorage

CreateAccount Component

In Summary

Questions Are Welcome! Email Me: tifftiff.email@gmail.com

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store