Blog Cover Image

FullStack Twitter Clone

Md Taqui imam's photo
Tanya Shankar's photo
Sujan Thapa's photo
Charles Hurt's photo
Twitter is one of the most popular social media platforms in the world, with over 330 million active users as of 2021. If you are interested in building a Twitter-like application, this tutorial will guide you through the process of building a FullStack Twitter Clone using the latest technologies.

Link to Course: https://learn.piyushgarg.dev/learn/twitter-clone?COUPON=EARLY_BIRD

Overview
In this tutorial, we will create a FullStack Twitter Clone that allows users to create and post tweets, follow other users, and like, and view their own profiles and the profiles of other users.

Tech Stack
Node.js for our backend code would run the graphql server inside the node.js environment.

GraphQL for our API provides a flexible and efficient way to define and query our data model.

Prisma ORM for our database ORM, which provides a type-safe and easy-to-use interface for interacting with our PostgreSQL database.

PostgreSQL is our database, which is a powerful and reliable relational database system.

Supabase for hosting and managing cloud Postgresql db.

Redis for query caching on the server side and increasing query speeds

Google OAuth for Sign in with Google

JSON WEB TOKENS for authentication

Next.js for our front end is a popular framework for building React applications with server-side rendering and optimized performance.

TailwindCSS for styling and reusable components.

Codegen for typesafe graphql queries and mutations.

Graphql-Request as API client for client-server communication

React-Query for client-side data caching and query caching

Typescript to maintain code quality and write type-safe code.

Amazon Web Services for storage and deployments.

Prerequisites
To follow along with this tutorial, you will need the following:

Basic programming knowledge

Min 6 months of experience with Node.js and Express

Beginner-level experience with React and NextJS

Overview of Graphql (Optional)

Learning Outcomes
After this course, learners would have a strong hands-on over several latest technologies, tools and programming practices such as:

How to use Graphql with Express

How to use PrismaORM with Node and PostgreSQL

How relational DBs work and how to make relations in SQL database

Complex Joins and Lookups in SQL using Prisma ORM

Client Query Caching with React Query

On-Demand Query Invalidation

Server Side Data Fetching and Rendering with Next.js SSR

How to Implement OAuth from Scratch

Creating Custom Hook Wrappers around React Query

Redis Caching to increase query speeds

Configuring and Setting up Custom S3 Bucket Policy on AWS

Uploading Media to AWS S3 using Pre-Signed URLs

Working in Typesafe code check with Typescript and Codegen

Link to Course: https://learn.piyushgarg.dev/learn/twitter-clone?COUPON=EARLY_BIRD

Sahil Shangloo

Comments (2)

Sahil Shangloo

Good One!

Arkan Khan

Gonna Try it