دوره جامع Full-Stack با Next.js 15 - پلتفرم وبلاگ چند کاربره
✅ سرفصل و جزئیات آموزش
آنچه یاد خواهید گرفت:
- بیاموزید چگونه یک پلتفرم وبلاگنویسی فولاستک و چندکاربره مانند Medium یا DEV را در Next.js 15 ،Typescript و TailwindCSS بسازید.
- بیاموزید چگونه از جدیدترین ویژگیهای Next.js مانند App Router ،Server Actions ،Server Component و موارد دیگر استفاده کنید.
- یک سیستم احراز هویت کامل با استفاده از Auth.js v5 ایجاد کنید - شامل ورود با ایمیل و رمز عبور، ادامه با گوگل یا گیتهاب، تأیید ایمیل، بازنشانی رمز عبور و موارد دیگر.
- یک ویرایشگر وبلاگ با استفاده از BlockNote ایجاد کنید - چیزی شبیه به ویرایشگر Notion
- آپلود تصاویر - شامل آپلود، جایگزینی و حذف تصاویر
- بخش نظرات وبلاگ - امکان نظر دادن روی وبلاگها و پاسخ به نظرات
- پروفایل کاربر - شامل جزئیات کاربر، تنظیمات کاربر (بروزرسانی پروفایل) و وبلاگهای کاربر
- یک سیستم نوتیفیکیشن بلادرنگ را در SocketIO ایجاد کنید.
پیشنیازهای دوره
- HTML & CSS
- دانش JavaScript و React.js
- بدون نیاز به دانش قبلی در مورد Next.js
توضیحات دوره
در این دوره، مدرس از Next.js 15 ،TypeScript ،ailwindCSS ،Auth.js v5، Prisma و ابزارهای دیگر برای ساخت یک وب اپلیکیشن فولاستک کامل از ابتدا استفاده میکند.
این دوره مبتنی بر پروژه است و برای توسعهدهندگانی که میخواهند با ساخت یک اپلیکیشن واقعی یاد بگیرند، عالی است. دانشجویان با ایجاد و استقرار یک پلتفرم وبلاگ، چیزی شبیه به DEV یا Medium، با ابزارهای مدرن و بهترین شیوه ها تجربه عملی کسب خواهند کرد.
ویژگیهایی که در پروژه دوره ایجاد میشوند:
- سیستم احراز هویت کامل با استفاده از Auth.js v5 - شامل ورود با اعتبارنامه (ایمیل و رمز عبور)، ادامه با Google یا GitHub، تایید ایمیل، بازنشانی رمز عبور و موارد دیگر
- ویرایشگر Block Note - یک ویرایشگر متن غنی الهام گرفته از Notion، با پشتیبانی از تصاویر، بلوکهای کد و غیره
- صفحهبندی وبلاگها - صفحهبندی سمت سرور برای بهبود سئو و عملکرد
- حالتهای تم تاریک و روشن - جابجایی بدون وقفه بین تمها
- آپلود تصاویر - آپلود، جایگزینی و حذف تصاویر
- واکنشها به وبلاگ - لایک کردن و نشانگذاری وبلاگهای مورد علاقه
- جستجو و فیلتر - فیلتر کردن وبلاگها بر اساس تگها و کلمات کلیدی
- سیستم نظرات - نظر دادن روی وبلاگها و پاسخ به نظرات
- پروفایلهای کاربر - مشاهده و بروزرسانی تنظیمات کاربر و مشاهده وبلاگهای نوشته شده
- سیستم دنبال کردن - دنبال کردن و لغو دنبال کردن کاربران
- نوتیفیکیشن های بلادرنگ - با قدرت SocketIO
- داشبورد ادمین - نظارت بر کاربران و وبلاگها
- استقرار - یادگیری چگونگی استقرار پروژه در محیط Production
در پایان، دانشجویان یک اپلیکیشن وبلاگ قدرتمند و مدرن آماده برای دنیای واقعی خواهند داشت.
این دوره برای چه کسانی مناسب است؟
- توسعهدهندگان React که میخواهند یاد بگیرند چگونه اپلیکیشنهای فولاستک را در Next.js مدرن (App Router Server Actions و غیره) ایجاد کنند.
دوره جامع Full-Stack با Next.js 15 - پلتفرم وبلاگ چند کاربره
-
دموی اپلیکیشن 15:36
-
پیشنیازها 01:36
-
مقایسه React و Next.js 02:39
-
ایجاد یک اپلیکیشن Next.js 07:15
-
RootLayout و صفحه اصلی 04:36
-
افزودن فونتهای گوگل 03:18
-
تابع cn 04:27
-
معرفی TailwindCSS 05:52
-
راهاندازی اولیه 10:01
-
کامپوننت Container 03:29
-
تغییر تم 09:42
-
لوگو 02:26
-
معرفی Shadcn و استایل ورودی جستجو 08:08
-
استایل نوتیفیکیشن ها 07:03
-
استایل دکمه کاربر 06:09
-
افزودن صفحات و صفحات تو در تو 07:50
-
افزودن صفحات پویا 05:52
-
افزودن طرح بندی های تو در تو 04:42
-
لینک کردن صفحات 07:14
-
ارسال کد به Github 04:14
-
مقدمهای بر Typescript 11:10
-
کامپوننت ورودی قابل استفاده مجدد 10:55
-
فرم ورود 11:38
-
کامپوننت دکمه 08:02
-
کامپوننت Heading 03:11
-
کامپوننت احراز هویت اجتماعی 02:50
-
فرم ثبتنام 09:02
-
راهاندازی Prisma 03:42
-
ایجاد یک پایگاه داده Postgres 02:32
-
اسکیمای کاربر 04:24
-
Server Action ثبتنام 09:15
-
فراخوانی Server Action 08:27
-
کامپوننت Alert 06:06
-
راهاندازی Authjs 08:09
-
Middleware 06:12
-
محافظت از مسیرها 05:29
-
ورود کاربر 13:04
-
خروج کاربر 02:23
-
تغییر مسیر کاربر 02:12
-
بروزرسانی سشن 06:47
-
ادامه با Github 07:02
-
ادامه با Google 05:20
-
تایید خودکار ایمیل Oauth 02:45
-
سفارشیسازی خطای متصل نبودن حساب 04:06
-
تولید توکن تایید ایمیل 06:08
-
ارسال ایمیل تایید 09:39
-
صفحه تایید ایمیل 19:34
-
ارسال ایمیل بازنشانی رمز عبور 18:39
-
فرم بازنشانی رمز عبور 13:24
-
افزودن نقش کاربر و شناسه کاربر به Session 10:22
-
ایجاد فرم وبلاگ 09:39
-
راهاندازی Edgestore (آپلود تصویر در React) 08:54
-
آپلود تصویر کاور 16:38
-
نمایش، جایگزینی و حذف تصویر کاور 14:57
-
انتخاب تگها 08:10
-
ویرایشگر BlockNote 20:15
-
تنظیم محتوای ویرایشگر در State مربوط به React Hook Form 09:22
-
نمایش خطای فرم وبلاگ 02:13
-
انتشار وبلاگ 09:46
-
ذخیره وبلاگ به عنوان پیشنویس 02:39
-
دریافت وبلاگهای منتشر شده 07:10
-
استایلدهی لیست و جزئیات وبلاگها 51:37
-
ویرایش وبلاگ و فیلترها 52:42
-
Server Action تشویق وبلاگ 06:27
-
بروزرسانی رابط کاربری خوشبینانه 12:47
-
نشانگذاری وبلاگ 06:37
-
رفع مشکلات ناوبری 09:46
-
صفحه نشانگذاریها 19:02
-
اسکیمای نظرات 10:55
-
Server Action نظرات 11:56
-
فرم نظرات 24:20
-
افزودن پیام Toast 05:04
-
لیست نظرات 13:37
-
کارت نظرات 03:17
-
واکنش به نظرات 12:55
-
افزودن پاسخها 05:50
-
لیست پاسخها 20:33
-
حذف نظر 05:23
-
تشویق نظرات 10:59
-
نمایش تعداد نظرات 03:28
-
حذف وبلاگ بخش 1 12:59
-
حذف وبلاگ بخش 2 03:12
-
Server Action پروفایل کاربر 24:40
-
دریافت وبلاگهای کاربر 17:44
-
صفحهبندی وبلاگهای پروفایل کاربر 06:30
-
Server Action ویرایش کاربر 09:19
-
فرم ویرایش کاربر 22:24
-
ویرایش ایمیل کاربر 08:32
-
حذف کاربر بخش 1 18:52
-
حذف کاربر بخش 2 00:43
-
اسکیمای Prisma دنبال کردن 08:29
-
مسیر API دنبال کردن 09:19
-
اجرای Prisma Generate 00:11
-
دکمه دنبال کردن (ارسال درخواست API) 25:03
-
لیست دنبالکنندگان و دنبالشوندگان 19:09
-
اسکیمای نوتیفیکیشن ها 08:44
-
ایجاد نوتیفیکیشن ها 15:13
-
دریافت نوتیفیکیشن ها 07:38
-
لیست و باز کردن نوتیفیکیشن ها 15:39
-
علامتگذاری نوتیفیکیشن ها به عنوان خوانده شده 06:05
-
راهاندازی سرور Socket 20:11
-
ارسال نوتیفیکیشن ها 19:52
-
داشبورد مدیریت ساده 10:56
-
استقرار اپلیکیشن 16:22
-
چگونگی اجرای کدهای منبع 15:15
مشخصات آموزش
دوره جامع Full-Stack با Next.js 15 - پلتفرم وبلاگ چند کاربره
- تاریخ به روز رسانی: 1404/12/10
- سطح دوره:متوسط
- تعداد درس:105
- مدت زمان :17:54:37
- حجم :10.08GB
- زبان:دوبله زبان فارسی
- دوره آموزشی:AI Academy