课程介绍

正如 React 改变了我们构建 Web 应用程序的方式一样，GraphQL 正在改变我们构建 API 来查询和改变数据的方式

本课程侧重于现代 JavaScript和现实世界应用程序，是一种从头到尾学习全栈高级 React、Next.js、GraphQL、Node.js 的方式

加入我，我将向您展示如何使用当今一些顶级 JavaScript 技术构建一个全栈在线商店

我们将一起建立 “Sick Fits”，这是一个全栈式的在线服装店，具有真正的信用结帐功能。用户可以搜索、销售、添加到购物车和结账他们喜欢的物品

该应用程序有六个主要模型–用户、物品、订单、购物车物品、订单物品和角色–所有这些都是关系型的，展示了关系型GraphQL查询的力量

该应用程序还包括许多服务器端的部分，包括认证、权限、发送电子邮件、上传图片和信用卡收费。 除了建立应用程序的前端和后端之外，我们还用课程的最后一节来测试React应用程序

课程目录

• 01 - Tooling and Starter Files Setup
• 01 - Tooling and Starter Files Setup.srt
• 01 - Tooling and Starter Files Setup.vtt
• 02 - The Tech Stack Explained
• 02 - The Tech Stack Explained.srt
• 02 - The Tech Stack Explained.vtt
• 03 - An intro to Next
• 03 - An intro to Next.srt
• 03 - An intro to Next.vtt
• 04 - Creating a Page Layout Component
• 04 - Creating a Page Layout Component.srt
• 04 - Creating a Page Layout Component.vtt
• 05 - Creating our Header and Nav Components
• 05 - Creating our Header and Nav Components.srt
• 05 - Creating our Header and Nav Components.vtt
• 06 - An Intro to Styled Components and CSS
• 06 - An Intro to Styled Components and CSS.srt
• 06 - An Intro to Styled Components and CSS.vtt
• 07 - Global Styles, Typography and Layout Styles
• 07 - Global Styles, Typography and Layout Styles.srt
• 07 - Global Styles, Typography and Layout Styles.vtt
• 08 - Visualizing Route Changes
• 08 - Visualizing Route Changes.srt
• 08 - Visualizing Route Changes.vtt
• 09 - Fixing Styled Components Flicker on Server Render
• 09 - Fixing Styled Components Flicker on Server Render.srt
• 09 - Fixing Styled Components Flicker on Server Render.vtt
• 10 - Setting up MongoDB
• 10 - Setting up MongoDB.srt
• 10 - Setting up MongoDB.vtt
• 11 - An Intro to GraphQL
• 11 - An Intro to GraphQL.srt
• 11 - An Intro to GraphQL.vtt
• 12 - Setting up Keystone and Typescript
• 12 - Setting up Keystone and Typescript.srt
• 12 - Setting up Keystone and Typescript.vtt
• 13 - Creating our first User data type
• 13 - Creating our first User data type.srt
• 13 - Creating our first User data type.vtt
• 14 - Adding Auth to our Application
• 14 - Adding Auth to our Application.srt
• 14 - Adding Auth to our Application.vtt
• 15 - Creating our Products Data Type
• 15 - Creating our Products Data Type.srt
• 15 - Creating our Products Data Type.vtt
• 16 - Uploading Product Images
• 16 - Uploading Product Images.srt
• 16 - Uploading Product Images.vtt
• 17 - Creating two way data relationships in Keystone
• 17 - Creating two way data relationships in Keystone.srt
• 17 - Creating two way data relationships in Keystone.vtt
• 18 - Inserting Seed Data
• 18 - Inserting Seed Data.srt
• 18 - Inserting Seed Data.vtt
• 19 - Setting up Apollo Client
• 19 - Setting up Apollo Client.srt
• 19 - Setting up Apollo Client.vtt
• 20 - Fetching Data with hooks and Displaying it in our Front End
• 20 - Fetching Data with hooks and Displaying it in our Front End.srt
• 20 - Fetching Data with hooks and Displaying it in our Front End.vtt
• 21 - Fixing and Styling the Nav
• 21 - Fixing and Styling the Nav.srt
• 21 - Fixing and Styling the Nav.vtt
• 22 - A real good lesson in React Forms and Custom Hooks
• 22 - A real good lesson in React Forms and Custom Hooks.srt
• 22 - A real good lesson in React Forms and Custom Hooks.vtt
• 23 - Hooking up our File input and Form Styles
• 23 - Hooking up our File input and Form Styles.srt
• 23 - Hooking up our File input and Form Styles.vtt
• 24 - Creating Products via our Mutations
• 24 - Creating Products via our Mutations.srt
• 24 - Creating Products via our Mutations.vtt
• 25 - Refetching Queries after a Successful Mutation
• 25 - Refetching Queries after a Successful Mutation.srt
• 25 - Refetching Queries after a Successful Mutation.vtt
• 26 - Programmatically Changing the Page after product creation
• 26 - Programmatically Changing the Page after product creation.srt
• 26 - Programmatically Changing the Page after product creation.vtt
• 27 - Displaying Single Items, Routing and SEO
• 27 - Displaying Single Items, Routing and SEO.srt
• 27 - Displaying Single Items, Routing and SEO.vtt
• 28 - Updating Items
• 28 - Updating Items.srt
• 28 - Updating Items.vtt
• 29 - Using useEffect to deal with a tricking loading state issue
• 29 - Using useEffect to deal with a tricking loading state issue.srt
• 29 - Using useEffect to deal with a tricking loading state issue.vtt
• 30 - Deleting Products
• 30 - Deleting Products.srt
• 30 - Deleting Products.vtt
• 31 - Evicting Items from the Apollo Cache
• 31 - Evicting Items from the Apollo Cache.srt
• 31 - Evicting Items from the Apollo Cache.vtt
• 32 - Pagination Links
• 32 - Pagination Links.srt
• 32 - Pagination Links.vtt
• 33 - Pagination Dynamic Routing
• 33 - Pagination Dynamic Routing.srt
• 33 - Pagination Dynamic Routing.vtt
• 34 - Adjusting our Query for Pagination Values
• 34 - Adjusting our Query for Pagination Values.srt
• 34 - Adjusting our Query for Pagination Values.vtt
• 35 - Custom Type Policies and Control over the Apollo Cache
• 35 - Custom Type Policies and Control over the Apollo Cache.srt
• 35 - Custom Type Policies and Control over the Apollo Cache.vtt
• 36 - Querying The Current User
• 36 - Querying The Current User.srt
• 36 - Querying The Current User.vtt
• 37 - Creating a Sign In Component
• 37 - Creating a Sign In Component.srt
• 37 - Creating a Sign In Component.vtt
• 38 - Creating a Sign Out Component
• 38 - Creating a Sign Out Component.srt
• 38 - Creating a Sign Out Component.vtt
• 39 - Creating our Sign Up Flow
• 39 - Creating our Sign Up Flow.srt
• 39 - Creating our Sign Up Flow.vtt
• 40 - Password Reset - Requesting a Reset
• 40 - Password Reset - Requesting a Reset.srt
• 40 - Password Reset - Requesting a Reset.vtt
• 41 - Password Reset - Setting a new Password
• 41 - Password Reset - Setting a new Password.srt
• 41 - Password Reset - Setting a new Password.vtt
• 42 - Password Reset - sending the email
• 42 - Password Reset - sending the email.srt
• 42 - Password Reset - sending the email.vtt
• 43 - Cart - Creating the Data Type and Two Way Relationships
• 43 - Cart - Creating the Data Type and Two Way Relationships.srt
• 43 - Cart - Creating the Data Type and Two Way Relationships.vtt
• 44 - Cart - Displaying Items in a Custom Component
• 44 - Cart - Displaying Items in a Custom Component.srt
• 44 - Cart - Displaying Items in a Custom Component.vtt
• 45 - Cart - Using Recat Context for our Cart State
• 45 - Cart - Using Recat Context for our Cart State.srt
• 45 - Cart - Using Recat Context for our Cart State.vtt
• 46 - Cart - Adding Items to Cart
• 46 - Cart - Adding Items to Cart.srt
• 46 - Cart - Adding Items to Cart.vtt
• 47 - Cart - Adding Items To Cart in React
• 47 - Cart - Adding Items To Cart in React.srt
• 47 - Cart - Adding Items To Cart in React.vtt
• 48 - Cart - Animating the Cart Cart Value
• 48 - Cart - Animating the Cart Cart Value.srt
• 48 - Cart - Animating the Cart Cart Value.vtt
• 49 - Cart - Remove From Cart Button
• 49 - Cart - Remove From Cart Button.srt
• 49 - Cart - Remove From Cart Button.vtt
• 50 - Cart - Evicting Cart Items from the Cache
• 50 - Cart - Evicting Cart Items from the Cache.srt
• 50 - Cart - Evicting Cart Items from the Cache.vtt
• 51 - Search
• 51 - Search.srt
• 51 - Search.vtt
• 52 - Setting Up our Stripe Checkout
• 52 - Setting Up our Stripe Checkout.srt
• 52 - Setting Up our Stripe Checkout.vtt
• 53 - Writing our Client Side Checkout Handler Logic
• 53 - Writing our Client Side Checkout Handler Logic.srt
• 53 - Writing our Client Side Checkout Handler Logic.vtt
• 54 - Creating our Order and OrderItem Data Types
• 54 - Creating our Order and OrderItem Data Types.srt
• 54 - Creating our Order and OrderItem Data Types.vtt
• 55 - Custom Checkout Mutation with Stripe
• 55 - Custom Checkout Mutation with Stripe.srt
• 55 - Custom Checkout Mutation with Stripe.vtt
• 56 - Linking up our Frontend to the custom backend checkout mutation
• 56 - Linking up our Frontend to the custom backend checkout mutation.srt
• 56 - Linking up our Frontend to the custom backend checkout mutation.vtt
• 57 - Creating our Order and OrderItems in our Mutation
• 57 - Creating our Order and OrderItems in our Mutation.srt
• 57 - Creating our Order and OrderItems in our Mutation.vtt
• 58 - Finishing up the Checkout UI and Flow
• 58 - Finishing up the Checkout UI and Flow.srt
• 58 - Finishing up the Checkout UI and Flow.vtt
• 59 - Displaying a Single Order
• 59 - Displaying a Single Order .srt
• 59 - Displaying a Single Order .vtt
• 60 - Displaying All Orders
• 60 - Displaying All Orders.srt
• 60 - Displaying All Orders.vtt
• 61 - Roles and Permissions - A Primer
• 61 - Roles and Permissions - A Primer.srt
• 61 - Roles and Permissions - A Primer.vtt
• 62 - Creating the Roles and Permissions Schema + UI
• 62 - Creating the Roles and Permissions Schema + UI.srt
• 62 - Creating the Roles and Permissions Schema + UI.vtt
• 63 - Basic Access Control via Sessions
• 63 - Basic Access Control via Sessions.srt
• 63 - Basic Access Control via Sessions.vtt
• 64 - Permissions Access Functions
• 64 - Permissions Access Functions.srt
• 64 - Permissions Access Functions.vtt
• 65 - More Flexible Rule Based Functions
• 65 - More Flexible Rule Based Functions.srt
• 65 - More Flexible Rule Based Functions.vtt
• 66 - Getting Meta - Roles based Roles and Hiding UI
• 66 - Getting Meta - Roles based Roles and Hiding UI.srt
• 66 - Getting Meta - Roles based Roles and Hiding UI.vtt
• 67 - Cart and Order based Rules
• 67 - Cart and Order based Rules.srt
• 67 - Cart and Order based Rules.vtt
• 68 - User and Field Based Permissions
• 68 - User and Field Based Permissions.srt
• 68 - User and Field Based Permissions.vtt
• 69 - Product Image Permissions
• 69 - Product Image Permissions.srt
• 69 - Product Image Permissions.vtt
• 70 - Creating a Gated Sign In Component
• 70 - Creating a Gated Sign In Component.srt
• 70 - Creating a Gated Sign In Component.vtt
• 71 - Test Setup, Tooling and Methodology
• 71 - Test Setup, Tooling and Methodology.srt
• 71 - Test Setup, Tooling and Methodology.vtt
• 72 - Testing Basics
• 72 - Testing Basics.srt
• 72 - Testing Basics.vtt
• 73 - Testing our formatMoney function
• 73 - Testing our formatMoney function.srt
• 73 - Testing our formatMoney function.vtt
• 74 - React Testing Library
• 74 - React Testing Library.srt
• 74 - React Testing Library.vtt
• 75 - Snapshot Testing
• 75 - Snapshot Testing.srt
• 75 - Snapshot Testing.vtt
• 76 - More on Testing Library Queries
• 76 - More on Testing Library Queries.srt
• 76 - More on Testing Library Queries.vtt
• 77 - Mocking GraphQL Data Requests
• 77 - Mocking GraphQL Data Requests.srt
• 77 - Mocking GraphQL Data Requests.vtt
• 78 - Updating Props and re-rendering
• 78 - Updating Props and re-rendering.srt
• 78 - Updating Props and re-rendering.vtt
• 79 - Testing Signed in and Signed out Nav States
• 79 - Testing Signed in and Signed out Nav States.srt
• 79 - Testing Signed in and Signed out Nav States.vtt
• 80 - Pagination Testing
• 80 - Pagination Testing.srt
• 80 - Pagination Testing.vtt
• 81 - Testing User Events and Mutations
• 81 - Testing User Events and Mutations.srt
• 81 - Testing User Events and Mutations.vtt
• 82 - Testing Password Reset Component
• 82 - Testing Password Reset Component.srt
• 82 - Testing Password Reset Component.vtt
• 83 - Mocking 3rd Party Libraries
• 83 - Mocking 3rd Party Libraries.srt
• 83 - Mocking 3rd Party Libraries.vtt