Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Subscribe
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
End to End React with Prisma 2
Rating: 4.0 out of 5(110 ratings)
21,292 students

End to End React with Prisma 2

Learn everything needed to build a fully-featured social RSS news reader
Created byStephen Jensen
Last updated 6/2021
English

What you'll learn

  • Students will build an entire social RSS reader full stack application from scratch over 10 hours and learn all of the fundamentals of building a professional grade app.
  • Learn all the techniques needed to build a fully fledged app- user login, permissions, database management, backend creation. The works!

Course content

2 sections • 34 lectures • 10h 29m total length

  • Lecture 0: Reference Github Repo- save this for later!0:10
  • Introduction and Overview6:22

    Learn all about the app we will be building and details about where to find the repo and resources to help you along the way.

  • Create the Next.js base5:55

    Use Next.js to run both our frontend and backend servers for our app.

  • Configure Prisma 2 schema18:27

    We want to set up all of our data models using Prisma 2 up front so we can use them across all our videos more easily.

  • Configure Auth021:30

    Let's set up Auth0 so we have a way to verify who is making the request so we can tell if they have access to or not.

  • Add graphQL server11:07

    Let's add the main api that our frontend will use for fetching and sending all its data.

  • Add Context and Middleware18:14

    Add the user and prisma to the context so we can access it in all of our resolvers.

  • Add Feed queries and mutations10:45

    Create all of the feed queries and the create mutation.

  • Add Bundle queries and mutations4:29

    Create all of the bundle queries and the create mutation.

  • Add Nested Author information18:17

    Incorporate author information into our feeds and bundles.

  • Add FeedTag and BundleTag relations17:53

    Create tags for our feeds and bundles.

  • Add LikeBundle and LikeFeed Mutations6:41

    Create mutations to allow us to like bundles and feeds.

  • Add Find queries8:47

    Create queries to allow us to find tags and feeds that match a substring.

  • Add Update mutations18:05

    Make mutations which will allow us to update feeds and bundles.

  • Add Create Saved Article operations20:13

    Create mutation to allow us to make saved articles.

  • Add Delete mutations9:07

    Add all of the delete mutations we will need.

  • Add queries, mutations, and fragments5:41

    Add all the query and mutations files that our frontend will need.

Requirements

  • Should be able to create basic React js components and have experience with HTML, css and javascript.

Description

This course teaches you all of the skills and techniques needed for building a feature-packed application from the ground up.

Over the course of 10 hours, we will build an RSS reader application that will allow people to create RSS feeds, share and bundle them together, and like their favorite ones. Articles within the feeds can also be saved to a saved articles list for easy access later.

This is the full-stack tutorial that I wish I had after learning the basics of React.js- we will teach you how to take those basic skills and build on them to create all sorts of useful functionality that you need for real-life apps.

First, we will build out our backend which will store and manage all of our data and provide an expressive API to fetch exactly the data that we need in a secure manner.

  • Use GraphQL and authorizer functions to prevent users from performing actions that they shouldn't be able to such as deleting or editing records that they are not the author of.

  • Utilize Prisma 2 for managing a connection to the database and creating tables and schemas due to the relationships that we set up in our model.

  • Build a GraphQL API that allows us to fetch the fields and relations we need with no over-fetching.

  • Use Auth0 for authentication to trust requests coming from users and block malicious attacks.

After building our backend we will create a responsive frontend that can consume data from our backend.

  • Create a super snappy frontend with Next.js that is SEO friendly

  • Utilize optimistic response with Apollo to allow the UI to respond immediately to the user's requests, even when backend requests are involved

  • Build our own beautiful and responsive UI with TailwindCSS

Who this course is for:

  • Intermediate React developers looking to bring together all components of a modern web app.

Report abuse