Full Stack Development With Next JS & Typescript

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

Learn Next JS from scratch with Typescript and Tailwind CSS by building a real world fullstack blog application.

1. Typescript For Beginners

1. What is TS

2. Environment Set Up & First Taste of Typescript

3. Basic Types in JavaScript

4. Type Inference

5. Basic Rules to Define Types

6. Types for Objects and Arrays

7. Type Keyword & Optional Type

8. Functions

9. Interface

10. Generic Types

11. Any Type

12. When to use any

2. React and TypeScript

1. React TS Project Setup

2. Rendering App

3. Component & Props

4. Input and Change Handler

3. Core Concept of Next JS

1. What is the concept of Next JS

2. React vs Next JS

4. Project Setup

1. New Next JS Project

2. Custom CSS Style

3.1 dev-blog.zip

3. Setting up Tailwind CSS

4. VS Code Shortcuts

5. Cheat Sheet.html

5. The Real World Project

1. Future Plan

2.1 posts.zip

2. What is Markdown

3.1 smippet.zip

3. Custom Code Snippets

4. Making Blog Card

5. Lets Look at API

6. Before We Read Files & Folder

7. Reading Files & Folders

8. Trust Me Gray Matters

9. Fetching Data

10. getStaticProps

11. getStaticProps in action

12. Why getStaticProps

13. Fixing Types

14. Fixing Styles

15. Linking to SinglePage

16. Dynamic Route

17. getStaticPaths

18. Returning All Paths

19. Rendering Static Props

20. Fixing Types Part 2

21. Rendering Markdown

22. Styling Markdown

23. Lets Build Static App

24. The Build Command

25.1 dev-blog.zip

25. fallback

26. Setting up GitHub

27. Git Push

28. Publishing The App

29.1 dev-blog.zip

29. Updating The App

6. New Project Setup

1. The Plan

2. Project Setup

3.1 colors.zip

3.2 dev-blogs-v2.zip

3. Custom Colors

7. Admin Nav

1. Nav Container & Dark Mode

2.1 logo.zip

2. App Logo

3. Rendering Nav Items

4. Nav Toggler Button

5. Toggle Nav Logic

6. Using Localstorage For Nav

7. Adding Nav Transition

8.1 dev-blogs-v2.zip

8. Creating Common Admin Layout

8. Rich Text Editor

1. Rich Editor Options

2. Configuring Editor

3. Editor Commands

4. Toolbar

5.1 dropdownoptions.zip

5. Custom Dropdown

6. Changing Headers

7. Button Component

8. Rendering Buttons

9. Applying Logic

10. Styling Editor

11. Button Active Style

12. Insert Link UI

13.1 linkform.zip

13. Insert Link Form

14. Link Form State

15. Insert Link Logic

16. Resetting Link Form

17. Selecting Link Text

18.1 editlink.zip

18. Bubble Menu

19. Update Link Form

20. Updating Link in Real

21. Embed Youtube

22. Image Gallery

23.1 modalcontainer.zip

23. Creating Modal

24. Close Logic

25.1 res.zip

25. Gallery For Images

26. Image Component

27.1 empty-bg.zip

27. Busy Indicator on Upload

28. Selecting Image

29.1 actionbutton.zip

29. Alt Input and Select Button

30. Image Upload Input

31. Handling Change Event

32. Rendering Image

33. Important Changing Prop Name

9. Image Upload API Route

1.1 res.zip

1. Setup TipTap Edior

2. How to Upload Images (Discussion)

3. Uploading Image Part 1

4. Uploading Image Part 2

5. Reading All Images

6. Fetching Images

7.1 dev-blogs-v2.zip

7. Uploading Image From UI

10. Finishing Editor

1. Title Input

2. Seo Form

3. Finishing SEO Form UI

4. Seo Form State

5. Slug and onChange

6. Thumbnail Selector and Submit Button

7. Handling Editor State

8. Accepting Initial Value

9.1 dev-blogs-v2.zip

9.2 favicon.zip

9. Head Component

11. New Post

1. The Database

2. Lets Install Mongodb

3. Connecting to DB

4. Post Schema

5. Joi

6. Entire Post Validation

7. Handle New Post Submit

8. Accepting FormData

9. Saving Post Inside DB

10. Uploading Thumbnail

11. Types for Schema

12. getServerSideProps

13. Little Cleanup

14. Update Post With getServerSideProps

15. Submit Update Form

16. Update API Route

17. Fixing Types

18.1 dev-blogs-v2.zip

18. Updating Thumbnail

12. Rendering New Posts

1. The Plan

2. Basic UI

3. Post Card 1

4. Post Card 2

5. Link inside Link

6. Post Card Final

7. Setting up getServerSideProps

8. Fetching New Posts

9. Posts API Route

10. The Plan for Infinite Scroll

11. Infinite Scroll Component

12. Infinite Scroll Posts - Admin

13. Default Layout

14. Infinite Scroll Posts - User

15. User Nav

16. Github Auth Button

17. Profile Head

18. Dropdown Options

13. Authentication

1.1 Next Auth.html

1. Next Auth

2.1 Catch All Route.html

2. Catch All Route

3. Github Auth Provider

4. Register Github OAuth

5. Session with _app

6. Signin and Signout

7. User Model

8. Storing New User to DB

9. Auth Middleware

10. Updating Auth Token

11. Custom Auth Pages

12. Updating Session

13.1 dev-blogs-v2.zip

13. dbConnect

14. Going Live

1. The Plan

2. Single Post

3. Fetching Single Post

4. Rendering Single Post

5. Rendering Tool Tip

6. Dark Mode

7. Device Theme Mode

8. Secondary Nav - Admin

9. Search Bar

10. Fixing Theme

11. Confirm Modal

12. Delete Api Route

13. Problem With Delete

14. Common Ground for Delete

15. Confirm Delete

16. Finding The Culprit

17. It Was My Mistake

18. getServerSession

19. Next Build

20.1 dev-blogs-v2.zip

20. Uploading to Vercel

21. Setting MongoDB

139,000 تومان

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

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

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

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