Source Code: https://github.com/truthseekers/fullstack-auth0-gql
https://truthseekers.io/fullstack-authentication-react-auth0-graphql/
Initial server setup. query todos: 0:00 - 14:11
Queries & Mutations on front end 14:11 - 31:36
Setting up Auth0 on Front end. filled in env vars 31:36 - 38:44
login & log out works in auth0 front end. 49:45
get token on react frontend from auth0 49:45 - 53:50
Sending auth0 token from react to graphql server 53:50 - 59:05
Verifying token. (is malformed) 59:05 - 1:07:44
Setting up auth0 API for server side authentication (still malformed) 1:07:44 - 1:09:32
Connected auth0 frontend to auth0 server side auth (valid token!): 1:09:32 - 1:11:56
Requires auth on server. shows auth error from server in client 1:11:56 - 1:18:00
get authenticated users info from /userinfo auth0 endpoint 1:18:00 - 1:30:56
redirect users to route of choice on login 1:30:56 - END
In this video we're going to go through the process of setting up a full stack application with authentication both on the front end (react) and the back end (node) using a GraphQL api and Auth0. The front end will have access to the authentication status and user info, allowing the program to show & hide details based on the authentication status of the user.
The server will also allow the program to check the authentication status of the user, as well as retrieving user information from a REST endpoint on Auth0's domain: /userinfo.
Full source code provided for the React, GraphQL, and Auth0 application.