آموزش جامع Next.js 14 از صفر: ساخت پروژه واقعی با Next.js 14 و MongoDB - آخرین آپدیت

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

مقدمه Introduction

• راه‌اندازی محیط توسعه Environment setup

• Next.js چیست؟ What is Next.js?

• خوش‌آمدگویی به دوره Welcome to the course

• دموی پروژه PropertyPulse PropertyPulse project demo

1. مبانی Next.js و شروع پروژه 1. Next.js Fundamentals and Project Start

• لیست املاک صفحه اصلی Home property listings

• مقایسه کامپوننت‌های سرور و کلاینت و هوک‌های روتر Server vs. client components and router hooks

• داده‌های پویا برای کارت ملک Property card dynamic data

• لینک‌های فعال و رندرینگ شرطی Active links and conditional rendering

• لینک‌های نوبار، منوهای کشویی و آیکون‌های React Navbar links, drop-downs, and React icons

• مسیریابی مبتنی بر فایل (File-based routing) File-based routing

• صفحات سفارشی Not Found و Loading Custom not found and loading pages

• لایه Layout، صفحه اصلی و متا دیتا Layout, homepage, and metadata

• کامپوننت‌های صفحه اصلی Homepage components

• ساختار پروژه و پوشه‌بندی جدید New project and folder structure

• صفحه املاک Properties page

• شروع طراحی نوبار Start on the navbar

2. دیتابیس، مسیرهای API و کامپوننت‌های ملک 2. Database, API Routes, and Property Components

• صفحه جزئیات هر ملک Single property page

• مدل‌های ملک و کاربر Property and user models

• اتصال به دیتابیس و Mongoose Database connection and Mongoose

• اولین مسیر API شما Your first API route

• ایجاد دیتابیس MongoDB Create MongoDB database

• کامپوننت جزئیات ملک Property details component

• کامپوننت Spinner (لودینگ) Spinner component

• دریافت اطلاعات یک ملک Fetch single property

• استفاده از MongoDB Compass و وارد کردن داده‌ها MongoDB Compass and importing data

• دریافت داده‌ها با استفاده از Server Component Fetch data using server component

• فایل درخواست‌ها (Requests) Requests file

3. NextAuth، سشن‌ها و گوگل پرووایدر 3. NextAuth, Sessions, and Google Provider

• خروج از حساب و محافظت از مسیرها Sign-out and protect routes

• راه‌اندازی NextAuth و Provider NextAuth and provider setup

• ذخیره کاربر در دیتابیس و سشن Save user to database and session

• رپ‌ر (Wrapper) برای Session Provider Session provider wrapper

• راه‌اندازی Google OAuth Google OAuth setup

• دکمه ورود Sign-in button

• تصویر پروفایل Profile image

4. ایجاد املاک و یکپارچه‌سازی با Cloudinary 4. Create Properties and Cloudinary Integration

• آپلود تصویر با Cloudinary Cloudinary image upload

• نمایش تصاویر ملک Property image display

• ایجاد مسیر API برای افزودن ملک (POST) Add property POST API route

• مدیریت ورودی‌های فرم (Input Handlers) Form input handlers

• دریافت کاربر و ارسال به دیتابیس Get user and submit to database

• فرم افزودن ملک و مدیریت State کامپوننت Add property form and component state

5. پروفایل و مدیریت املاک 5. Profile and Manage Properties

• فرم ویرایش ملک Edit property form

• حذف املاک Deleting properties

• نمایش اطلاعات پروفایل کاربر User profile info display

• اعلان‌های Toast Toast notifications

• ایجاد مسیر API برای بروزرسانی (PUT) Update PUT API route

• لیست املاک کاربر در پروفایل User profile listings

6. نقشه، بوک‌مارک‌ها و اشتراک‌گذاری 6. Map, Bookmarks, and Sharing

• دکمه‌های اشتراک‌گذاری Share buttons

• مدیریت خطای Geocode Handle geocode error

• درخواست دکمه بوک‌مارک Bookmark button request

• صفحه املاک ذخیره شده Saved properties page

• ژئوکدینگ و نقشه Mapbox Geocoding and Mapbox map

• وضعیت بوک‌مارک و تغییر حالت دکمه Bookmark status and button toggle

• مسیر API بوک‌مارک Bookmark API route

• بهینه‌سازی و پاک‌سازی صفحه ملک Property page cleanup

7. جستجوی ملک 7. Property Search

• کامپوننت جستجوی ملک Property search component

• دریافت نتایج از API Fetch results from API

• نمایش نتایج جستجو Display search results

• اندپوینت (Endpoint) ای‌پی‌آی جستجو Search API endpoint

8. سیستم پیام‌رسانی 8. Messaging System

• نمایش تعداد پیام‌های جدید New message count display

• حذف پیام‌ها Delete messages

• اجباری کردن احراز هویت برای فرم تماس Require auth for contact form

• علامت‌گذاری به عنوان خوانده شده Mark as read

• ارسال پیام و مسیر API Message submit and API route

• نمایش پیام‌ها Display messages

• کانتکست سراسری برای پیام‌های خوانده نشده Global context for unread messages

• مرتب‌سازی پیام‌های جدید در ابتدا Order new first

• دریافت پیام‌ها Fetch messages

• مدل پیام و مدیریت State فرم Message model and form state

9. صفحه‌بندی، املاک ویژه، لایت‌باکس و استقرار 9. Pagination, Featured, Lightbox, and Deploy

• پیاده‌سازی صفحه‌بندی (Pagination) Implement pagination

• لایت‌باکس Photoswipe Photoswipe lightbox

• دریافت املاک ویژه (Featured) Fetch featured properties

• کامپوننت ملک ویژه Featured property component

• بازنویسی (Refactor) کامپوننت کلاینت املاک Properties client component refactor

• استقرار (Deploy) روی Vercel Deploy to Vercel

• کامپوننت صفحه‌بندی Pagination component