React Security Fundamentals
by
Ryan Chenkie
Login
Get access for free
Getting Started
Getting Started
Tour the Application
3 mins
Get access
Sign Up for MongoDB Atlas
5 mins
Get access
Clone the Repo and Install Dependencies
2 mins
Get access
Run the React App and Express API
3 mins
Get access
Checkout the Start Branch
1 min
Get access
Table of contents
React Security Fundamentals
by
Ryan Chenkie
ui-24px-outline-1_lock
Getting Started
Getting Started
Draft
Tour the Application
Draft
Tour the Application
Draft
Sign Up for MongoDB Atlas
Draft
Sign Up for MongoDB Atlas
Draft
Clone the Repo and Install Dependencies
Draft
Clone the Repo and Install Dependencies
Draft
Run the React App and Express API
Draft
Run the React App and Express API
Draft
Checkout the Start Branch
Draft
Checkout the Start Branch
ui-24px-outline-1_lock
JSON Web Tokens
JSON Web Tokens
Draft
Anatomy of a JSON Web Token
Draft
Anatomy of a JSON Web Token
Draft
Sign a JSON Web Token
Draft
Sign a JSON Web Token
Draft
JSON Web Token Dos and Don'ts
Draft
JSON Web Token Dos and Don'ts
ui-24px-outline-1_lock
Signup and Login
Signup and Login
Draft
View the Signup and Login Endpoints
Draft
View the Signup and Login Endpoints
Draft
Complete the User Signup Form
Draft
Complete the User Signup Form
Draft
Complete the User Login Form
Draft
Complete the User Login Form
ui-24px-outline-1_lock
Handling Auth State
Handling Auth State
Draft
Set Auth State after Login
Draft
Set Auth State after Login
Draft
Use Auth State in UI Elements
Draft
Use Auth State in UI Elements
Draft
Persist Auth State on Page Refresh
Draft
Persist Auth State on Page Refresh
Draft
Check if the User is Currently Authenticated
Draft
Check if the User is Currently Authenticated
Draft
Navigate Conditionally Based on Auth State
Draft
Navigate Conditionally Based on Auth State
Draft
Add Logout Functionality
Draft
Add Logout Functionality
Draft
Check the User's Role
Draft
Check the User's Role
Draft
Conditionally Display Sidebar Items
Draft
Conditionally Display Sidebar Items
ui-24px-outline-1_lock
Handling Client-Side Routing
Handling Client-Side Routing
Draft
Guard Client Side Routes Based on Auth State
Draft
Guard Client Side Routes Based on Auth State
Draft
Guard Client Side Routes Based on Role
Draft
Guard Client Side Routes Based on Role
ui-24px-outline-1_lock
Handling Authenticated HTTP Requests
Handling Authenticated HTTP Requests
Draft
Add a JWT to an Axios Request
Draft
Add a JWT to an Axios Request
Draft
Add an HTTP Interceptor to Axios
Draft
Add an HTTP Interceptor to Axios
ui-24px-outline-1_lock
Protecting API Endpoints
Protecting API Endpoints
Draft
Add a JWT Verification Middleware
Draft
Add a JWT Verification Middleware
Draft
Attach a User to the Request Object
Draft
Attach a User to the Request Object
Draft
Limit Access to Admin Users
Draft
Limit Access to Admin Users
Draft
Get the User ID from Requests
Draft
Get the User ID from Requests
ui-24px-outline-1_lock
Hardening the Application
Hardening the Application
Draft
Use Lazy Loading to Limit Access to Code
Draft
Use Lazy Loading to Limit Access to Code
Draft
Maintain an Allowed Origin List for Tokens
Draft
Maintain an Allowed Origin List for Tokens
Draft
Sanitize Content when Setting InnerHTML
Draft
Sanitize Content when Setting InnerHTML
Draft
Carry Out a Cross-Site Scripting Attack
Draft
Carry Out a Cross-Site Scripting Attack
Draft
Steal a JSON Web Token
Draft
Steal a JSON Web Token
Draft
Sanitize a Cross-Site Scripting Attack
Draft
Sanitize a Cross-Site Scripting Attack
ui-24px-outline-1_lock
Switching to Cookies
Switching to Cookies
Draft
How Cookies Work
Draft
How Cookies Work
Draft
Add a Proxy to the API
Draft
Add a Proxy to the API
Draft
Set a Cookie on Login and Signup
Draft
Set a Cookie on Login and Signup
Draft
Stop Storing JWT in Local Storage
Draft
Stop Storing JWT in Local Storage
Draft
Verify JWT from Cookie
Draft
Verify JWT from Cookie
Draft
Add a Cross-Site Request Forgery Token
Draft
Add a Cross-Site Request Forgery Token