Let's Code a Netflix Clone with GraphQL Pagination! Reviewed by a NETFLIX ENGINEER!

Let's Code a Netflix Clone with GraphQL Pagination! Reviewed by a NETFLIX ENGINEER!

In this video, I build a Netflix Clone using React, @Apollo GraphQL, @DataStax Astra + @Netlify Serverless Functions! This video is great for those wanting to see how I build an app that fetches data from our Cassandra database using the GraphQL API, as well as learn how to use pagination and slicing.

In this video, I build a Netflix Clone using React, @Apollo GraphQL, @DataStax Astra + @Netlify Serverless Functions! For more free credits on top of your already free ones, use code ANIA200 on https://www.datastax.com/

This video is great for those wanting to see how I build an app that fetches data from our Cassandra database using the GraphQL API, as well as learn how to use pagination and slicing. Here are just a few things we will be covering:

  • 00:00 Introduction
  • 04:32 Signing up to our Datastax Astra Cassandra database
  • 07:16 Using the GraphQL Playground
  • 09:51 Creating Tables using GraphQL mutations
  • 18:22 Adding Data using GraphQL mutations (you can use my pre-made data below)
  • 25:03 Retrieving Data using GraphQL queries
  • 26:20 Adding our Movies to our database
  • 34:48 Retrieving all of our Movies by Genre
  • 36:39 Limiting our Data in GraphQL queries
  • 38:01 Creating our React App
  • 41:31 What is LOLOMO at Netflix?
  • 43:05 Setting up Netlify Serverless Functions
  • 49:36 Adding your DataStax token and endpoint
  • 46:03 Adding the Netlify config
  • 46:56 Writing a serverless function to get the Genres
  • 57:36 Getting the Genres using GraphQL
  • 01:04:48 Getting the Movies by Genre in our browsers
  • 01:20:45 Pagination in GraphQL
  • 01:23:51 Calling the next page by button
  • 01:31:19 Loading more Genres when we hover at the end of the screen
  • 01:38:20 Adding a NavBar and HeroSection
  • 01:42:20 Making our Movie Cards pop out when we hover over them
  • 01:51:24 Making videos auto-play and show more info on hover
  • 01:55:28 HeroSection
  • 02:13:36 Font Awesome Icons
  • 02:16:20 Final basic styling

Movie Data: https://github.com/kubowania/netflix-clone-graphql-datastax/tree/main/data

As always, please take this project and make it your own. I have done some basic styling for you to get going. This is not a tutorial on styling, it is more to practise your database management skills, so please go wild on the styling yourselves :D! I would love to see what you have made!!

The full finished project can be found here: https://github.com/kubowania/netflix-clone-graphql-datastax

graphql netflix

What is Geek Coin

What is GeekCash, Geek Token

Best Visual Studio Code Themes of 2021

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Start Your Own White Label Netflix Clone App Development

Launch a Subscription-based video streaming app for Android and iOS platforms using our white-label app like Netflix clone script development service.

Netflix Implements GraphQL Federation at Scale

Netflix Implements GraphQL Federation at Scale. Netflix has successfully implemented a federated GraphQL API at scale. With GraphQL federation, the API gateway implementation is distributed to backend teams owning the individual domain services they implement instead of centrally developed as part of the API gateway.

Netflix.com/activate | Netflix Activate | Netflix.com/activate code

[How to Activate netflix.com/activate On Device You have to follow these steps: Download the Netflix app from Google play store or Apple iStore Open the Netflix app once completed Select your plan Initiate your Netflix account...

Netflix Embraces GraphQL Microservices for Rapid Application Development

In this post, Netflix Embraces GraphQL Microservices for Rapid Application Development. Netflix engineering recently published a blog post detailing how Netflix embraced GraphQL microservices for rapid application development. A senior software engineer at Netflix, describes their key learnings in the process and how GraphQL lends itself well for proof-of-concept development.

How Much Does it Cost to Make an App like Netflix?

How much does it cost to make an app like Netflix? AppClues Infotech develops video streaming app like Netflix or Youtube at best price.