Fullstack React GraphQL TypeScript Tutorial

Overview

Learn to build a full-stack web application from scratch in this comprehensive 14-hour tutorial. Master React, TypeScript, GraphQL, Node.js, PostgreSQL, and more as you develop a complete project. Explore essential concepts like ORM setup, authentication, pagination, and deployment. Gain hands-on experience with popular technologies including URQL/Apollo, MikroORM/TypeORM, Redis, Next.js, TypeGraphQL, and Chakra UI. Follow along step-by-step to create a robust backend and frontend, then deploy your application. Perfect for developers looking to enhance their full-stack skills and build modern, scalable web applications.

Syllabus

Intro.
Node/TypeScript Setup.
MikroORM Setup.
Apollo Server Express Setup.
MikroORM TypeGraphQL Crud.
Register Resolver.
Login Resolver.
Session Authentication.
Sessions Explained.
Next.js + Chakra.
URQL Basics.
GraphQL Code Generator.
Register Error Handling.
NavBar.
URQL Cache Updates.
Logout.
Next.js URQL SSR.
Forgot Password.
Change Password.
Why Switching to TypeORM.
Switching to TypeORM.
Many to One.
Global Error Handling.
Next.js Query Params.
URQL Pagination Start.
Adding Mock Data.
Chakra Styling.
More URQL Pagination.
Fix Mock Data.
URQL Pagination Has More.
GraphQL Fetching Relationships.
GraphQL Field Permissions.
Many to Many.
Invalidate Queries.
Upvote UI.
Change Vote.
Write Fragments.
Vote Status.
SSR Cookie Forwarding.
Single Post.
Delete Post.
Edit Post.
DataLoader.
Cache Reset.
Deploy Backend.
Docker.
Environment Variables.
DB Migrations.
Docker Hub.
DNS.
Deploy Frontend.
Fix Cookie.
Switch to Apollo.