The Next.js 13 Bootcamp – The Complete Developer Guide

سرفصل های دوره

Learn all the new features of Next.js 13 by building a restaurant reservation app.

1. Introduction

1. Course Outline

2. Course Setup

2. File Based Routing and Navigation

1. Create a Next App

2. Exploring the Files and Folders

3. Adding Tailwind CSS

4.1 html.zip

4. Your Two Options

5. Defining the Pages We Want

6. Understanding File Based Routing

7. Creating Those Pages

8. Challenge Solution

9. The Two Ways of Navigating Between Routes

10. The Link Component

11. Programmatic Navigation With the useRouter Hook

3. Next Components (Server and Client)

1. Cleaning Our Code With Components

2. Refactoring Our Pages

3. Some More Refactoring

4. Server vs Client Components

5. Exploring Which Components Should Be Client and Which Should Be Server

4. Defining Page Layouts and Head Meta

1. Our Code is Not Very DRY

2. Placing Universally Used Components in the Root Layout

3. Nested Components

4. Updating the Head Meta for Each Page

5. Fetching Data in Server Components

1. A Little SQL Lesson

2. Connecting to a Postgres Database

3. Defining Our SQL Schema

4.1 seed.ts

4. Seeding Our Database

5. How We Fetch Data in Server Components

6. Fetching Data in a Server Component

7. A Little TypeScript Lesson

8. Rendering the Fetched Data

9. A Common Error You Might Encounter

10. Fetching a Restaurant By Slug

11. Populating the Data in the Restaurant Page

12. Fetching the Restaurants Menu

6. Time to Get Your Hands Dirty

1. Challenge 1 - Add Query Params

2. Solution for Challenge 1

3. Challenge 2 - Fetch Restaurants By Location

4. Solution for Challenge 2

5. Challenge 3 - Populating Data

6. Solution for Challenge 3

7. Challenge 4 - Fetching Data for Side NavBar

8. Solution for Challenge 4

9. Challenge 5 - Adding Query Params

10. Solution for Challenge 5

11. Challenge 6 - Filtering By Query Params

12. Solution for Challenge 6

13. Challenge 7 - Defining the User and Review Model

14. Solution for Challenge 7

15. Challenge 8 - Fetching Reviews Data

16. Solution for Challenge 8

17.1 icons.zip

17. Adding a Stars Component

18. More Star Components Stuff...

7. Handling Loading and Error States

1. Introduction to Loading State

2. Adding a Loading State

3. Overriding the Default Loading State

4. Handling Error States

5. Rendering the Stars Component

6. Handling Not Found States

8. Implementing Authentication

1. What is Authentication

2. Adding Material UI

3. Adding the Modal Content

4. Completing the Modal Functionality

5. Steps to Implement Authentication

6. Creating an Endpoint

7. Validating the Users Input

8. Validating That the Users Doesnt Already Have an Account

9. Exploring Password Storage Solutions

10. Hashing Our Password

11. Creating a User

12. Creating and Sending a JSON Web Token

13. Implementing the Sign in Endpoint

14. Identifying Users With Json Web Token

15. Adding Middleware

9. Global State With Context API

1. Adding Client Side Validation

2. Creating a Custom useAuth Hook

3. Discussing the Authentication State

4. Creating a AuthContext Component

5. Handling the Loading State

6. Handling the Error State

7. Saving the JWT to Our Browsers Cookie

8. Doing the Same Thing For the Signup Function

9. Persisting an Auth State

10. Fixing the Issue... Sorry

11. Conditionally Rendering UI Based on the Auth State

12. Implementing the Logout Functionaility

10. Building an Availability System

1. Intro to Scheduling and Availability

2. The Rules We Will Follow

3. Rendering the Party Size Options

4. Rendering a DatePicker Component

5. Dynamically Rendering the Time Options

6. Understanding Many to Many Relationships

7. Defining Our New Models

8. The Availability Endpoint Overview

9. Building the Availability Endpoint

10. Step 1 Determining the Search Times

11. Step 2 Fetching the Bookings

12. Step 3 Compressing the Booking

13. Step 4 Fetching the Restaurant Tables

14. Step 5 Reformatting the Search Times

15. Step 6 Filtering Out the Booked Tables

16. Step 7 Determining the Availability

17. Step 8 Filtering by Restaurant Time Window

18. Building a useAvailabilities Hook

19. Storing the Reservation Criteria in State

20. Rendering the Available Time Options

21.1 convertToDisplayTime.ts

21. Converting the Time to a Displayable Time

11. Building the Scheduling System

1. The Reservation Endpoint

2. Step 1 Validation

3. Step 2.0 Extracting the Table Availability Logic Into its Own Function

4. Step 2.5 Determining the Available Tables

5. Step 3 Count the Tables Based on Seats

6. Step 4 Determine the Tables to Book

7. Step 5 Creating the Booking and Linking it to the Tables

8. Dynamically Rendering Data for the Reserve Header

9. Extracting the Query Params

10. Storing Our Inputs in State

11. Creating a useReservation Hook

12. Making a Reservation From the Client

13. Showing a Success State

12. Appendix A - Building the UI

1. The Nav and Header

2. The Search Bar and Restaurant Card

3. The Restaurant Page

4. The Title and Description

5. The Image Gallery

6. The Reservation Card

7. The Menu Page

8. The Search Page

9. The Reserve Page

53,700 تومان

خرید اشتراک افزودن به سبد خرید

خرید دانلودی فوری

در این روش نیاز به افزودن محصول به سبد خرید و تکمیل اطلاعات نیست و شما پس از وارد کردن ایمیل خود و طی کردن مراحل پرداخت لینک های دریافت محصولات را در ایمیل خود دریافت خواهید کرد.

تولید کننده: Udemy-Training