Premium Only Content
 
			Full Stack TikTok Clone: NestJS, GraphQL, Prisma, Postgres, React, Apollo Client, Zustand & Tailwind
Full-Stack TikTok Clone using NestJS, GraphQL, ReactJS, Apollo Client, Zustand & TailwindCSS
Hey, coders,
Here I am again with another beautiful build, where we will build a full-stack TikTok clone.
We will be using TypeScript along with NestJS for the backend and ReactJS for the frontend. For the generation of types on the front end, we will make use of GraphQL Codegen, which allows us to automatically generate types from our backend. For styling, we will use TailwindCSS.
For syncing our front end with the data coming from the GraphQL API, we will use Apollo Client. For state management regarding the UI, we will use ZUSTAND.
What kind of functionality will our Tiktok clone have?
We will be able to register, log in, make posts containing a video, like and comment posts. Also, we will be able to update your user profile.
We will also have infinite loading, meaning whenever we reach the bottom, more posts will be loaded into our feed.
What will we be learning?
We will be learning how to create A GraphQL API and connect it to a separate frontend, and how to work with files, such as images and Videos on the front and backend.
Timestamps:
00:00 Intro
00:02: Setting up NestJS with GraphQL and Prisma, implementation of backend logic for registering, logging in, logging out, and issuing access tokens.
00:40: Setup for ReactJS to work with Apollo Client and GraphQL CodeGen; implementation of React Router with protected routes, only logged-in users will be able to perform actions, such as liking, commenting, or creating posts. Implementation of log-in, and register functionality.
2:06: Top Navigation with logout functionality and Sidebar
2:50 Building the Upload page and the backend logic for dealing with video files
3:50: Building the Feed Page for displaying the posts
4:10: Implementation of the comment and like feature on the backend, and building the Post page, where users can like and comment.
5:14: Implementation of the user profile feature on the backend as well as on the front end; working with image files and React Cropper.
6:12: A few big fixes and Big Thanks for watching :)
- 	
				 LIVE LIVEThe Quartering31 minutes agoFood Wars Begin! Terror Plot Foiled & Much More!9,255 watching
- 	
				 LIVE LIVEDeVory Darkins30 minutes agoNewsom EXPOSED after latest bombshell and Democrats pulls shocking stunt regarding shutdown679 watching
- 	
				 1:09:50 1:09:50The Culture War with Tim Pool1 hour agoJamaica Hurricane Predicts POLE SHIFT, The END Is Nigh | The Culture War with Tim Pool19.1K29
- 	
				 LIVE LIVELara Logan8 hours agoSHOTS FIRED: The Tyranny of Big Pharma Exposed with Dr. Sherri Tenpenny | EP 42 | Lara Logan281 watching
- 	
				 LIVE LIVESean Unpaved1 hour agoRavens' Resurrection Night: Lamar Buries Miami, NFL/CFB Spooky HC Shifts, & Kalshi's Week 9/10 Odds!85 watching
- 	
				 LIVE LIVEFilm Threat1 day agoHALLOWEEN HORROR + BACK TO THE FUTURE RERELEASE + MORE REVIEWS | Film Threat Livecast87 watching
- 	
				 1:21:16 1:21:16Steven Crowder3 hours ago10th Annual Halloween Spooktacular: Reacting to the 69 Gayest Horror Movies of All Time156K101
- 	
				 57:39 57:39The Rubin Report2 hours agoKamala Gets Visibly Angry as Her Disaster Interview Ends Her 2028 Election Chances16K40
- 	
				 LIVE LIVEDr Disrespect2 hours ago🔴LIVE - DR DISRESPECT - ARC RAIDERS - DANGEROUS ADVENTURES (LEVEL 12)1,627 watching
- 	
				 LIVE LIVELFA TV16 hours agoLIVE & BREAKING NEWS! | FRIDAY 10/31/252,572 watching