There are currently no items in your shopping cart.

User Panel

Forgot your password?.

Udemy GraphQL from Scratch – Realtime MERN Stack with React Node

Video Introducing this tutorial

Introduction :
Course Introduction
What is GraphQL
Trying GraphQL playground
GraphQL vs REST
About the course

GraphQL Node Server, Type Definitions and Resolvers :
Download source code bundle for each lectures
Express server
GraphQL server
GraphQL express server
Multiple TypeDefs
Multiple resolvers
Mongo atlas setup
Local MongoDB connection
Post query
Post mutation
Input type and query variables

GraphQL React Client and Query Hooks :
React setup
GraphQL query
useQuery hook
useLazyQuery hook

Authentication with Firebase and React (Client Side) :
Firebase auth flow
Firebase setup
State management with context and reducer hooks
Using dispatch context and router hooks
React router
User register form
Confirmation email using firebase
Toast notification and loading
Complete registration form
Register with email and password
Dispatch user info to context state
User onAuthStateChanged
Logout from firebase
Login with firebase
Login with google

Authentication with Firebase Node MongoDB (Server Side) :
Server auth logic
GraphQL auth logic
GraphQL req headers auth logic
Firebase admin verify authtoken
Apollo client authtoken in headers
User model
User create typeDefs
User create mutation
Create or update user in mongodb
Mutation from apollo client
User update or create in login
Reusable auth form
Code refactor in login and register complete

User Dashboard :
What is next?
Private route
Dashboard with static nav
Dashboard pages and nav links update
Password forgot
Password update form
Password update with firebase
Code refactoring typeDefs

Public Profile :
User input and image types
User update mutation
User profile query
Scalar type datetime
Profile query apollo client
useMemo hook
Profile update form
useMutation hook to update profile
Remove typename from mutation
GraphQL fragments
Queries and mutations refactor

Multiple Image Upload and Resize :
Cloudinary setup
Upload flow and more middlewares
Upload image to cloudinary
Delete image and auth middleware
Cloudinary config
Image resize in react
Cloudinary upload react
Display images
Delete image

Code Refactor :
Code refactor profile form
Code refactor image upload and delete
Code refactor display images and delete
Code refactor image component

Public Routes :
Countdown to redirect
Public route
Public profile query and resolver
All users query and resolvers
useQuery hook all users
User card component
Public profile component
Profile query using route param

Posts (Server Side) :
Post model
Post type
Post create resolver
Post create mutation
All posts resolver
Posts by user resolver

Posts (Client Side) :
All posts query
Create post form
Post create upload
Post create mutation
useMutation hook to create post
useQuery hook posts by user
Read and write to apollo client cache
Update post typeDef and resolver
Delete post typeDef and resolver
Single post typeDef and resolver
Update delete buttons
Delete mutation and refetch queries
Post update component
Queries and mutations to get single post and update
useQuery hook for single post
useMutation hook to update post
Show single post
Total posts query and mutations

Pagination :
All posts pagination server side
Total post count for pagination
Pagination previous and next options
Code refactor pagination

Search :
Search component
Search type and resolver
Search results

Realtime Subscriptions :
Introduction to subscriptions
Adding pubsub in apollo server context
Realtime subscription post added
NPM packages for subscription
Apollo client setup for subscription
useSubscription hook
Realtime post create subscription and local cache
Code refactor subscriptions
Update delete subscriptions server
Realtime post update subscription
Realtime post delete subscription

Deployment :
Deploy graphql node server to heroku part 1
Deploy graphql node server to heroku part 2
Deploy graphql react client to heroku
Trying the deployed app in production
Download source code bundle