Full Stack Advanced React + GraphQL
15h 43m 10s
English
Paid
Just as React has transformed the way we build web applications, GraphQL is changing how we build APIs to query and mutate data. With a focus on modern JavaScript and real world application, this course is a start-to-finish way to learn Full Stack Advanced React, GraphQL, Node.js and friends. Join me as I show you how to build a full stack online store with some of today's top JavaScript technology.
Watch Online Full Stack Advanced React + GraphQL
Join premium to watch
Go to premium
# | Title | Duration |
---|---|---|
1 | Tooling and Starter Files Setup | 09:34 |
2 | The Tech Stack Explained | 07:42 |
3 | An intro to Next | 08:53 |
4 | Creating a Page Layout Component | 18:13 |
5 | Creating our Header and Nav Components | 07:50 |
6 | An Intro to Styled Components and CSS | 11:53 |
7 | Global Styles, Typography and Layout Styles | 10:17 |
8 | Visualizing Route Changes | 06:22 |
9 | Fixing Styled Components Flicker on Server Render | 06:31 |
10 | Setting up MongoDB | 13:02 |
11 | An Intro to GraphQL | 06:52 |
12 | Setting up Keystone and Typescript | 11:29 |
13 | Creating our first User data type | 05:49 |
14 | Adding Auth to our Application | 08:09 |
15 | Creating our Products Data Type | 07:33 |
16 | Uploading Product Images | 08:00 |
17 | Creating two way data relationships in Keystone | 06:40 |
18 | Inserting Seed Data | 07:39 |
19 | Setting up Apollo Client | 18:36 |
20 | Fetching Data with hooks and Displaying it in our Front End | 29:53 |
21 | Fixing and Styling the Nav | 02:00 |
22 | A real good lesson in React Forms and Custom Hooks | 24:14 |
23 | Hooking up our File input and Form Styles | 10:42 |
24 | Creating Products via our Mutations | 17:30 |
25 | Refetching Queries after a Successful Mutation | 05:18 |
26 | Programmatically Changing the Page after product creation | 02:38 |
27 | Displaying Single Items, Routing and SEO | 25:58 |
28 | Updating Items | 24:51 |
29 | Using useEffect to deal with a tricking loading state issue | 07:31 |
30 | Deleting Products | 10:34 |
31 | Evicting Items from the Apollo Cache | 04:44 |
32 | Pagination Links | 17:05 |
33 | Pagination Dynamic Routing | 11:15 |
34 | Adjusting our Query for Pagination Values | 04:44 |
35 | Custom Type Policies and Control over the Apollo Cache | 26:33 |
36 | Querying The Current User | 09:35 |
37 | Creating a Sign In Component | 25:33 |
38 | Creating a Sign Out Component | 05:30 |
39 | Creating our Sign Up Flow | 13:27 |
40 | Password Reset - Requesting a Reset | 08:49 |
41 | Password Reset - Setting a new Password | 14:11 |
42 | Password Reset - sending the email | 17:33 |
43 | Cart - Creating the Data Type and Two Way Relationships | 06:47 |
44 | Cart - Displaying Items in a Custom Component | 16:50 |
45 | Cart - Using Recat Context for our Cart State | 15:53 |
46 | Cart - Adding Items to Cart | 23:20 |
47 | Cart - Adding Items To Cart in React | 05:55 |
48 | Cart - Animating the Cart Cart Value | 12:19 |
49 | Cart - Remove From Cart Button | 05:59 |
50 | Cart - Evicting Cart Items from the Cache | 05:03 |
51 | Search | 30:30 |
52 | Setting Up our Stripe Checkout | 11:23 |
53 | Writing our Client Side Checkout Handler Logic | 12:39 |
54 | Creating our Order and OrderItem Data Types | 10:28 |
55 | Custom Checkout Mutation with Stripe | 17:46 |
56 | Linking up our Frontend to the custom backend checkout mutation | 06:50 |
57 | Creating our Order and OrderItems in our Mutation | 09:05 |
58 | Finishing up the Checkout UI and Flow | 10:03 |
59 | Displaying a Single Order | 10:57 |
60 | Displaying All Orders | 12:48 |
61 | Roles and Permissions - A Primer | 03:29 |
62 | Creating the Roles and Permissions Schema + UI | 07:04 |
63 | Basic Access Control via Sessions | 09:16 |
64 | Permissions Access Functions | 07:13 |
65 | More Flexible Rule Based Functions | 14:08 |
66 | Getting Meta - Roles based Roles and Hiding UI | 03:12 |
67 | Cart and Order based Rules | 07:09 |
68 | User and Field Based Permissions | 05:15 |
69 | Product Image Permissions | 01:27 |
70 | Creating a Gated Sign In Component | 03:13 |
71 | Test Setup, Tooling and Methodology | 07:40 |
72 | Testing Basics | 10:51 |
73 | Testing our formatMoney function | 07:04 |
74 | React Testing Library | 15:38 |
75 | Snapshot Testing | 06:12 |
76 | More on Testing Library Queries | 04:46 |
77 | Mocking GraphQL Data Requests | 15:30 |
78 | Updating Props and re-rendering | 10:11 |
79 | Testing Signed in and Signed out Nav States | 14:41 |
80 | Pagination Testing | 15:24 |
81 | Testing User Events and Mutations | 17:17 |
82 | Testing Password Reset Component | 07:11 |
83 | Mocking 3rd Party Libraries | 23:32 |
Similar courses to Full Stack Advanced React + GraphQL
React Testing Library and Jest: The Complete GuideudemyStephen Grider
Category: React.js
Duration 7 hours 40 minutes 24 seconds
Course
NestJS GraphQL - Schema-first approachlearn.nestjs.com
Category: NestJS, GraphQL
Duration 1 hour 52 minutes 6 seconds
Course
The Software Architect Mindset (COMPLETE)ArjanCodes
Category: TypeScript, React.js, Others, Python
Duration 12 hours 6 minutes 39 seconds
Course
Building Large Scale Web Apps | A React Field GuideAddy OsmaniHassan Djirdeh
Category: React.js
Duration
Book
Solidity & Ethereum in React (Next JS): The Complete Guideudemy
Category: React.js, Next.js, Decentralized Applications (dApps) / 'Web 3'
Duration 38 hours 47 minutes 24 seconds
Course
Bedrock: Jumpstart your next SaaS productMax Stoiber (@mxstbr)
Category: React.js, Others, Next.js, GraphQL, Assemblies, ready-made solutions for development
Duration
Course
Discord Clone - Learn MERN Stack with WebRTC and SocketIOudemy
Category: JavaScript, React.js, Node.js, MongoDB, Socket.IO, WebRTC
Duration 19 hours 29 minutes 29 seconds
Course
Next.js and Apollo - Portfolio App (w/ React, GraphQL, Node)udemy
Category: React.js, Next.js, Node.js, GraphQL
Duration 28 hours 38 minutes 19 seconds
Course
Namaste ReactAkshay Saini (NamasteDev.com)
Category: React.js
Duration 65 hours 23 minutes 25 seconds
Course