Auth For My React Rails Application Including Reset Password

I’m currently working on a project which is my final project at Flatiron School. The idea of this project is about building an inventory system that is integrated with a Point-of-Sale feature.

To get started, I chose to build authentication and Authorization features first. Because I think Auth features are the most significant function in every app that allows users to access the application and keep data more securely.

Let's get started by setting up requires files:

Part 1: The Back-end (built by Rails) first.

First, I run the command below to generate the resource of User.

rails g resource User username password address email phone --no-test-frame
# Note: --no-test-framework is not required, is a flag that tells the generator not to create any tests for the newly-generated models, controllers, etc

By running the command above, it will create a users table, User model, users_controller, user_serializer, and recourse: users under config/routes.rb file.

Second, then I run the command below to generate sessions_controller

rails g controller sessions --no-test-framework

Third, I want to create a password controller to manage reset action for resetting the password

rails g controller password --no-test-framework

Step 1: Define Routes

Now, back to config/routes.rb file, I created 5 custom routes

Route post “/signup”, to: “users#create” => responsible for Signup if the customer does not have an account

Route get “/me”, to: “users#show” => responsible for auto-login and remember session

Route post “/login”, to: “sessions#login” => responsible for login

Route delete “/logout”, to: “sessions#logout” => responsible for logout

Route post “/reset”, to: “passwords#reset” => responsible for reset password.

Step 2: Set up validations in user.rb file (User model)

Set up some validations and define reset action in user.rb file (User Model)

Step 3: Set up application_controller.rb:

Step 4: Setting actions in users_controller.rb file

Now, I go to the users_controller.rb file and define some actions:

create action => responsible for login

show action => responsible for auto-login

Step 5: Define login and logout action in sessions_controller.rb

Step 6: Define reset action in passwords_controller.rb

Part 2: Front-end

Step 1: in my App.js

Step 2: Login.js

Step 3: Building Login and Signup Form

Step 4: Reset Password

I appreciate it if you can make it here. That’s how I built my Authentication and Authorization for my React & Rails App.