Lessons
Explore all newline lessons
lesson
Prevent Cross-Site Request Forgery Attacks With X-CSRF TokenTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoWeβll take an additional step in this lesson to prevent Cross-Site Request Forgery attacks. We'll see how we can have the client pass a CSRF token with every request and where the server can use the token to verify the identity of the viewer making the request.
lesson
How to Use a Viewer Cookie to Automatically Log In a UserTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoOur server is now able to help set and clear the "viewer" cookie in our client when we sign-in with Google. In this lesson, we'll modify our client such that it will use the "viewer" cookie to automatically log a viewer in when the app first renders and the cookie is available.
lesson
Using NPM cookie-parser to Read Cookies in ReactTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoWe'll utilize the `cookie-parser` package in our Node server to help parse a "viewer" cookie from HTTP requests sent from the client.
lesson
sessionStorage vs localStorage vs Cookies for Secure StorageTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoBefore we dive into implementing persistent login sessions in our app, we'll touch on the different storage mechanisms of the web browser. In this lesson, we explore the differences between localStorage, sessionStorage, and cookies.
lesson
How to Store Persistent Google Sign-In Sessions With CookiesTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoA browser cookie is data that a server can send to a user's web browser where the browser can often send back to the server. With this lesson, we begin discussing how persistent login sessions can be made with cookies by going through a simple exercise with the Google search web application.
lesson
Module 5 IntroductionTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoThis is an introduction to the work we'll be doing in Module 5.0.
lesson
Module 4 SummaryTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoThis lesson is a summary of the work we've done in Module 4.0.
lesson
How to Build a React Header With a React Log Out MutationTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoA user is now able to successfully sign-in from the Login page. In this lesson, we'll spend some time creating the AppHeader component that will help allow users to navigate around our app.
lesson
How to Query Google Sign-In Authentication URL From a ClientTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoHaving the UI of the Login page built in our client, we'll investigate how we can make the query for Google Sign In's authentication URL when a user attempts to sign in.
lesson
How to Build a Custom Google Sign-In UI in ReactTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoWe'll now switch over to work in our React application and have it communicate with the server to allow a user to sign-in via Google OAuth.
lesson
Build GraphQL Authentication Resolvers for Google AuthTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoWe'll continue to update the GraphQL resolver functions we've prepared to allow users to log-in & log-out of our application.
lesson
Using Google Auth and People API With React and GraphQLTinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL - Part TwoBefore we update our GraphQL OAuth resolvers, we'll use Google's official Node.js library to help access and interact with Google APIs.