GraphQL with React & Node js - Real Time Private Chat App

Master GraphQL by building real time web applications using React & Node js

4.25 (56 reviews)
Udemy
platform
English
language
Web Development
category
instructor
1,550
students
6.5 hours
content
Apr 2022
last update
$64.99
regular price

What you will learn

🔥 Discount is available! Use DISCOUNT300 coupon!

GraphQL with Apollo Server

Apollo Client v3

Prima v3 to interact with database

Authentication and Authorization

Material UI v 5 (MUI)

WebSocket and GraphQL Subscriptions

Description

This course will get you up and running with GraphQL quickly, and teach you the core knowledge you need to deeply understand and build GraphQL application quickly using React and Node.js

Authentication? you will learn it. Apollo client? included. Subscriptions? of course.

In this course you'll learn how to use GraphQL both on the server side and in client applications. You will be introduced to all the main GraphQL concepts like schema definition, Queries, Mutations, and Subscriptions, as well as to solution to common requirements such as handling authentication, authorization and client-side caching.


This course will teach you -

  • What and why of GraphQL

  • Material UI v5 for neat & beautiful UI

  • Building GraphQL with Apollo Server

  • Apollo Client for server side state management

  • Authentication and Authorization

  • Prisma v3 to interact with relational databases like MySQL

  • GraphQL Subscriptions for real time functionality

  • One to One private Chat app like MS teams

  • Deploy GraphQL application

In the end of this course you will get solid understanding of GraphQL that you can apply in projects & you will also have you own real time one to one chat application project like MS teams that you can add in your portfolio.


This course assumes good knowledge of modern JavaScript, and ideally some familiarity with Node.js and React.

Content

Introduction

Project Overview
Why GraphQL - Over fetching and Under fetching
REST API vs GraphQL API
GraphQL Terminology - Query, Mutation, Schema and Resolvers
source code

GraphQL basics

Setup Apollo server and Hello world
Query, variables and Resolvers
Mutation and input type
parent argument for relational data
Context, Aliases and Fragment

Authentication and Authorization + Prisma v3

Setup Prisma and User Model
Signup User mutation and Password hashing
Sign In User mutation and Jwt sign
Understanding jwt and Authorization
Adding Authorization

Send And Receive Message

Message Model Prisma
Send Message Mutation
Query to get messages between 2 users

Creating UI using React and MUI

create react app and install dependencies
Sign Up page UI
Login page UI
Side Bar Component
Adding Routing
Chat Screen UI
Typo and Logout icon

Apollo Client v3+

Why Apollo client, Making request using fetch
Setup Apollo client with React
useMutation hook and Signup User
call Login mutation and logout
useQuery & attach token in headers
Showing messages on UI
Sending text message from UI

GraphQL Subscriptions

Setup graphql-ws with Apollo Server
Subscription schema, resolver and PubSub asyncIterator
Testing Subscription in playground
Setup Subscription with apollo client
useSubscription hook for real time notification
Inspecting web socket request in network tab

Deploy - Going Live

Deploy Apollo Server
Deploy Apollo Client (React App)

Screenshots

GraphQL with React & Node js - Real Time Private Chat App - Screenshot_01GraphQL with React & Node js - Real Time Private Chat App - Screenshot_02GraphQL with React & Node js - Real Time Private Chat App - Screenshot_03GraphQL with React & Node js - Real Time Private Chat App - Screenshot_04

Reviews

Becky
September 29, 2023
His course is good, well organised and good structure. However I personally feel difficult to understand his English accent sometimes but he tries to explain properly, also code and naming he writes is a bit messy. But overall this is a good course!
Oscar
September 23, 2022
The course is good, I bought it to see some subscription details. I would say that it is basic but that it helps you remember some necessary topics. If you are looking for a course that goes deeper into topics such as subscription, this is not it, but it will help you understand the basics.
Kenneth
March 21, 2022
This course is an excellent refresher for reviewing your knowledge regarding GraphQL and WebSockets. The only catch is that you will have difficulty understanding this course if you are a beginner. This course is a purely project-based learning experience where you need to have at least a little bit of knowledge with GraphQL, or you might ask a lot of questions inside your head. Buy this course if you want to experience doing a GraphQL-based project but don't if you are looking for an in-depth guide when it comes to GraphQL.

Coupons

DateDiscountStatus
3/6/2022100% OFF
expired
4/3/2022100% OFF
expired

Charts

Price

GraphQL with React & Node js - Real Time Private Chat App - Price chart

Rating

GraphQL with React & Node js - Real Time Private Chat App - Ratings chart

Enrollment distribution

GraphQL with React & Node js - Real Time Private Chat App - Distribution chart

Related Topics

4391514
udemy ID
11/10/2021
course created date
3/6/2022
course indexed date
Bot
course submited by