End to End React with Prisma 2
- Description
- Curriculum
- FAQ
- Reviews
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
-
1
Introduction and OverviewLearn all about the app we will be building and details about where to find the repo and resources to help you along the way.
-
2
Create the Next.js base
Use Next.js to run both our frontend and backend servers for our app.
-
3
Configure Prisma 2 schema
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.
-
4
Configure Auth0
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.
-
5
Add graphQL server
Let's add the main api that our frontend will use for fetching and sending all its data.
-
6
Add Context and Middleware
Add the user and prisma to the context so we can access it in all of our resolvers.
-
7
Add Feed queries and mutations
Create all of the feed queries and the create mutation.
-
8
Add Bundle queries and mutations
Create all of the bundle queries and the create mutation.
-
9
Add Nested Author information
Incorporate author information into our feeds and bundles.
-
10
Add FeedTag and BundleTag relations
Create tags for our feeds and bundles.
-
11
Add LikeBundle and LikeFeed Mutations
Create mutations to allow us to like bundles and feeds.
-
12
Add Find queries
Create queries to allow us to find tags and feeds that match a substring.
-
13
Add Update mutations
Make mutations which will allow us to update feeds and bundles.
-
14
Add Create Saved Article operations
Create mutation to allow us to make saved articles.
-
15
Add Delete mutations
Add all of the delete mutations we will need.
-
16
Add queries, mutations, and fragments
Add all the query and mutations files that our frontend will need.
