CursosPago

Next.js From Scratch 2024

11:54:09 Inglés Free 21/02/2024 76 videos

Descripción del curso

The main project in this course is a full-featured property rental website with property search, browsing and management. User authentication using Next Auth along with the Google provider. Internal messaging, property bookmarking, Mapbox integration, geocoding and more.

What you'll learn

  • Learn how to create SSR websites with Next.js 14
  • Build a property rental website from the ground up
  • MongoDB, Mongoose & API routes for backend
  • Next Auth & Google provider for authentication
  • User profiles with listing management
  • Cloudinary Image integration
  • Bookmarking, maps, pagination, sharing and more
  • Internal messaging system for communication
  • Deploy to production using Vercel

Curriculum

Section 1: Module 1

  • 02 - Welcome To The Course 02:38
  • 03 - Premium Docs Download 01:15
  • 04 - PropertyPulse Project Demo 08:36
  • 05 - What Is Next.js? 08:45
  • 06 - Environment Setup 04:11
  • 07 - Creating a New Next.js Project 06:14
  • 08 - Layout, Homepage & Metadata 10:48
  • 09 - File-Based Routing 07:17
  • 10 - Server Components, Client Components & Router Hook 09:45
  • 11 - Start the Navabar Component 10:04
  • 12 - Navbar Links, Dropdowns & React Icons 12:29
  • 13 - Active Links & Conditional Rendering 11:49
  • 14 - Homepage Components 15:46
  • 15 - Properties Page 07:27
  • 16 - Property Card Dynamic Data 14:42
  • 17 - Home Properties Component 07:43
  • 18 - Custom Not Found & Loading Page 05:59
  • 19 - Create MongoDB Database 08:45
  • 20 - Compass & Importing Data 04:37
  • 21 - Database Connection With Mongoose 06:32
  • 22 - Your First API Route 06:06
  • 23 - Property & User Models 12:31
  • 24 - Fetch Data From Server Components 09:49
  • 25 - Requests File 04:26
  • 26 - Fetch Single Property 10:52
  • 27 - Single Property Page 11:55
  • 28 - Property Details Component 15:35
  • 29 - Spinner Component 02:38
  • 30 - Google OAuth Setup 06:39
  • 31 - Next Auth & Provider Setup 08:46
  • 32 - Session Provider Wrapper 05:38
  • 33 - Sign In Button 09:31
  • 34 - Save User to Database & Session 05:58
  • 35 - Profile Image 04:40
  • 36 - Sign Out & Protect Routes 06:16
  • 37 - Add Property Form & State 12:44
  • 38 - Form Input Handlers 13:45
  • 39 - Add Property POST API Route 13:57
  • 40 - Get User & Submit To Database 13:47
  • 41 - Cloudinary Image Upload 15:55
  • 42 - Property Image Display 15:51
  • 43 - User Profile Info 04:55
  • 44 - User Profile Listings 17:04
  • 45 - Deleting Properties 10:14
  • 46 - Toast Notifications 03:55
  • 47 - Edit Property Form 12:14
  • 48 - Update PUT API Route 12:32
  • 49 - Geocoding & Mapbox Map 16:41
  • 50 - Handle Geocode Error 04:05
  • 51 - Property Page Cleanup 06:12
  • 52 - Bookmark API Route 10:29
  • 53 - Bookmark Button Request 08:28
  • 54 - Bookmark Status & Button Toggle 08:55
  • 55 - Saved Properties 12:18
  • 56 - Share Buttons 10:42
  • 57 - Property Search Component 09:06
  • 58 - Search API Endpoint 09:56
  • 59 - Fetch Results From API 07:19
  • 60 - Display Search Results 10:49
  • 61 - Message Model & Form State 13:00
  • 62 - Message Submit & API Route 14:23
  • 63 - Require Auth For Contact Form 03:54
  • 64 - Fetch Messages 10:31
  • 65 - Display Messages 11:16
  • 66 - Mark As Read 15:20
  • 67 - Delete Messages 08:39
  • 68 - Order New First 03:26
  • 69 - New Message Count Display 11:06
  • 70 - Global Context For Unread Messages 11:07
  • 71 - Properties Component Refactor 06:34
  • 72 - Implement Pagination 08:57
  • 73 - Pagination Component 09:32
  • 74 - Photoswipe Lightbox Gallery 06:38
  • 75 - Fetch Featuted Properties 06:54
  • 76 - Featured Property Component 13:12
  • 77 - Deploy To Vercel 11:05

About the Instructor

Instructor

Brad Traversy

Course

$0.00

$8.00
Que esta incluido?
  • Streaming Multiplataforma
  • Acceso de por vida
  • Soporte al cliente
  • Actualizaciones gratuitas