Overview

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

Tech Stack

• Node.js for our backend code which would be running graphql server inside node.js environment.
• GraphQL for our API, which provides a flexible and efficient way to define our data model and query it.
• Prisma ORM for our database ORM, which provides a type-safe and easy-to-use interface for interacting with our PostgreSQL database.
• PostgreSQL as our database, which is a powerful and reliable relational database system.
• Supabase for hosting and managing cloud postgresql db.
• Redis for query caching on server side and increase query speeds
• Google OAuth for Signin with Google
• JSON WEB TOKENS for authentication
• Next.js for our frontend, which is a popular framework for building React applications with server-side rendering and optimized performance.
• TailwindCSS for styling and re-useable components.
• Codegen for typesafe graphql queries and mitations.
• 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 knowlege
• Min 6 months of experience with Node.js and Express
• Beginner level experince with React and NextJS
• Overview of Graphql (Optional)

Learning Outcomes

After this course, learners would have strong hand-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 db’s 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