Next Js: The Complete Developer'S Guide By Stephen Grider

[BaDshaH]

Published 11/2023
MP4 | Video: h264, 1920x1080 | Audio: AAC, 44.1 KHz
Language: English | Size: 4.52 GB | Duration: 12h 51m

Build and deploy amazingly fast apps using Next v14 using App Router, Next Auth, NextUI, and TailwindCSS!

[b]What you'll learn[/b]
Make incredibly performant web apps using Next JS
Understand the differences between running Next JS in development and production environments
Utilize four different caching systems to speed up request response times
Use the latest React tech with Server Components to build streaming interfaces
Implement robust and secure user authentication with the Next Auth library
Build complicated routing structure by using route interception and parallel routing
Automatically update and refresh data with the use of Server Actions with Revalidation
Optimize image fetching and loading through the use of Next's Image component
Add robust form validation and handling by implementing React's new useFormState hook

[b]Requirements[/b]
Basic knowledge of React and Typescript is helpful, but refresher sections on these topics are included

[b]Description[/b]
Congratulations! You're on the brink of entering the fast-evolving world of NextJS, designed to empower developers with the tools to create high-performance, feature-rich web applications that stand out in the modern digital landscape.NextJS is the key to unlocking the full potential of server-rendered React applications, combining the best of web development into one powerful, developer-friendly framework. This comprehensive course takes you on a deep dive into advanced NextJS features that can set you apart in the job market, equipping you to tackle real-world projects with confidence. By exploring the intricacies of authentication with the Next-Auth library, the innovative approach to data mutations using server actions, and the foundational concepts of server and client components, you'll be well on your way to mastering modern web development.With the tech industry looking for skilled professionals, mastering Next puts you at the forefront of opportunity, with a skill set that's in high demand. Whether you're eyeing a new career as a software engineer or aiming to enhance your existing projects, there's never been a better time to delve into Next.What will you achieve?Through an extensive collection of video lectures complemented by detailed diagrams and real-world examples, this course ensures a thorough understanding of Next's capabilities, no pre-existing knowledge of the framework necessary. I've crafted a learning experience that's both rigorous and encouraging, with layers of knowledge built one at a time and ample dialogue to contextualize each feature of Next.I proudly offer the most detailed journey through Next available online. No stone is left unturned in this resource-packed adventure.Prepare to conquer a diverse array of topics, including:Implementing user authentication flows with next-auth, for secure and scalable user managementEffectively structuring server actions to handle data mutations Dissecting the theory of server vs client components, and knowing how to leverage each for maximum efficiencyMastering data validation techniques to ensure the reliability and integrity of user inputNavigating Next's sophisticated caching systems to deliver lightning-fast content performanceRecognizing the critical differences between development and production environments and preparing your applications for successful deploymentTailoring Server-Side Rendering (SSR) and Static Site Generation (SSG) to your application's needsUtilizing Incremental Static Regeneration (ISR) for the best of SSR and SSGEnriching user interfaces with TailwindCSS support for styling componentsOptimizing images on-the-fly with Next's Image component for better performance and user experienceDeploying your Next applications with Vercel and other hosting platforms with easeLeveraging TypeScript with Next for robust, type-safe applicationsWith each new topic, you'll gain knowledge, proficiency, and the assurance to apply what you've learned to practical scenarios.Embrace the opportunity to define the future of web development with your newly acquired NextJS expertise. Join the ranks of developers who not only follow best practices but also contribute to them. Sign up now and transform your understanding and execution of modern web development with Next.

Overview
Section 1: Get Started Here!
Lecture 1 How to Learn NextJS Quickly
Lecture 2 Project Overview
Lecture 3 File-Based Routing
Lecture 4 Adding Additional Routes
Lecture 5 Linking Between Pages
Lecture 6 Common UI with Layouts
Lecture 7 Project Structure Strategy
Lecture 8 Absolute Path Import Shortcut
Lecture 9 Image Files
Lecture 10 Adding Images
Lecture 11 More on the Image Component
Lecture 12 Adding a Reusable Presentation Component
Lecture 13 Adding Some Styling
Lecture 14 Production Deployment with Vercel
Lecture 15 Diagrams
Section 2: Changing Data with Mutations
Lecture 16 App Overview
Lecture 17 Project Setup
Lecture 18 Adding a Create Page
Lecture 19 Creating a Prisma Client
Lecture 20 Adding a Creation Form
Section 3: Streaming Content with React Server Components
Lecture 21 Introducing Server Actions
Lecture 22 A Deeper Dive into Server Actions
Lecture 23 Server Components vs Client Components
Lecture 24 Fetching Data with Server Components
Lecture 25 Adding Dynamic Paths
Lecture 26 Fetching Particular Records
Lecture 27 Custom Not Found Pages
Lecture 28 Automatic Loading Spinnners
Lecture 29 A Few Quick Tasks
Lecture 30 Styling the Show Page
Lecture 31 Linking to the Edit Page
Lecture 32 Showing a Client Component in a Server Component
Lecture 33 Adding the Monaco Editor
Lecture 34 Handling Editor Changes
Section 4: Server Actions in Great Detail
Lecture 35 Server Actions in Client Components
Lecture 36 Server Actions in a Separate File
Lecture 37 Options for Calling Server Actions from Client Components
Lecture 38 Calling a Server Action from a Client Component
Lecture 39 Deleting a Record with a Server Action
Section 5: Server Forms with the UseFormState Hook
Lecture 40 Understanding the UseFormState Hook
Lecture 41 UseForm State in Action
Lecture 42 Adding the Form Validation
Lecture 43 Gotchas Around Error Handling
Section 6: Understanding Next's Caching System
Lecture 44 Super Unexpected Behavior
Lecture 45 The Full Route Cache System
Lecture 46 What Makes a Static or Dynamic Route
Lecture 47 When to Use Each Cache Control
Lecture 48 Help, My Page is Showing Old Data!
Lecture 49 Enabling Caching with GenerateStaticParams
Lecture 50 Caching Dynamic Routes
Section 7: Authentication with Next-Auth
Lecture 51 Project Overview
Lecture 52 Critical Libraries in Our Project
Lecture 53 NextUI Installation and Setup
Lecture 54 Prisma Schema File
Lecture 55 Database Setup
Lecture 56 OAuth Setup
Lecture 57 Next-Auth Setup
Lecture 58 The Theory Behind OAuth
Lecture 59 Wrapping Auth in Server Actions
Lecture 60 Sign In, Sign out, and Checking Auth Status
Lecture 61 Upfront Design Process
Lecture 62 Why Path Helpers?
Lecture 63 Path Helper Implementation
Lecture 64 Creating the Routing Structure
Lecture 65 Stubbing Out Server Actions
Lecture 66 Planning Revalidating Strategies
Lecture 67 Building the Header
Lecture 68 Displaying the Sign In and Sign Out Buttons
Lecture 69 Enabling Sign Out
Lecture 70 More Caching Issues
Lecture 71 Static Caching While Using Auth
Lecture 72 Creating Topics
Lecture 73 Creating a Popover Form
Lecture 74 Receiving Form Data
Lecture 75 Adding Form Validation With Zod
Lecture 76 Reminder on the UseFormState Hook
Lecture 77 Fixing UseFormState Type Errors
Lecture 78 Here's our FormState Type
Lecture 79 Displaying Validation Errors
Lecture 80 Handling General Form Errors
Lecture 81 Handling Database Errors in Forms
Section 8: Supplement - React Primer
Lecture 82 Let's Build an App!
Lecture 83 Critical Questions
Lecture 84 A Few More Critical Questions
Lecture 85 Node Setup
Lecture 86 Creating a React Project
Lecture 87 What is Create React App
Lecture 88 Showing Basic Content
Lecture 89 What is JSX?
Lecture 90 Printing JavaScript Variables in JSX
Lecture 91 Shorthand JSX Expressions
Lecture 92 Typical Component Layouts
Lecture 93 Customizing Elements with Props
Lecture 94 Converting HTML to JSX
Lecture 95 Applying Styling in JSX
Lecture 96 Extracting Components
Lecture 97 Module Systems Overview
Lecture 98 Cheatsheet for JSX
Lecture 99 Project Overview
Lecture 100 Creating Core Components
Lecture 101 Introducing the Props Systems
Lecture 102 Picturing the Movement of Data
Lecture 103 Adding Props
Lecture 104 Using Argument Destructuring
Lecture 105 React Developer Tools
Lecture 106 Most Common Props Mistake
Lecture 107 Images for the App
Lecture 108 Including Images
Lecture 109 Handling Image Accessibility
Lecture 110 Review on How CSS Works
Lecture 111 Adding CSS Libraries with NPM
Lecture 112 A Big Pile of HTML!
Lecture 113 Last Bit of Styling
Section 9: Supplement - TypeScript Primer
Lecture 114 TypeScript Overview
Lecture 115 Environment Setup
Lecture 116 A First App
Lecture 117 Executing TypeScript Code
Lecture 118 One Quick Change
Lecture 119 Catching Errors with TypeScript
Lecture 120 Catching More Errors!
Lecture 121 Types
Lecture 122 More on Types
Lecture 123 Examples of Types
Lecture 124 Where Do We Use Types
Lecture 125 Type Annotations and Inference
Lecture 126 Annotations with Variables
Lecture 127 Object Literal Annotations
Lecture 128 Annotations Around Functions
Lecture 129 Understanding Inference
Lecture 130 The "Any" Type
Lecture 131 Fixing the "Any" Type
Lecture 132 Delayed Initialization
Lecture 133 When Inference Doesn't Work
Lecture 134 More on Annotations Around Functions
Lecture 135 Inference Around Functions
Lecture 136 Annotations for Anonymous Functions
Lecture 137 Void and Never
Lecture 138 Destructuring with Annotations
Lecture 139 Annotations Around Objects
Lecture 140 Arrays in TypeScript
Lecture 141 Why Typed Arrays?
Lecture 142 Multiple Types in Arrays
Lecture 143 When to Use Typed Arrays
Lecture 144 Tuples in TypeScript
Lecture 145 Tuples in Action
Lecture 146 Why Tuples?
Lecture 147 Interfaces
Lecture 148 Long Type Annotations
Lecture 149 Fixing Annotations with Interfaces
Lecture 150 Syntax Around Interfaces
Lecture 151 Functions in Interfaces
Lecture 152 Code Reuse with Interfaces
Lecture 153 General Plan with Interfaces
Any engineer looking to build high-performance web apps with Next JS

Homepage

[To see links please register or login]

[To see links please register or login]