بازار آموزش الکترونیکی MERN در جاوا اسکریپت React Node FullScript

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

معرفی Introduction

• ساخت react node udemi clone Build react node udemy clone

• کد منبع را برای هر سخنرانی دانلود کنید Download source code for each lectures

• آیا با JavaScript React و NodeJs تازه کار هستید؟ Are you new to JavaScript React and NodeJs?

راه اندازی مشتری Client setup

• راه اندازی مشتری Nextjs Nextjs client setup

• طراحی بوت استرپ و مورچه Bootstrap and ant design

• CSS سفارشی Custom CSS

• صفحات Pages

• منوی مورچه و نمادها Ant menu and icons

• صفحه ثبت نام Register page

راه اندازی سرور Server setup

• راه اندازی سرور Server setup

• بیان Express

• مسیرها Routes

• کنترل کننده ها Controllers

• اطلس مونگو یا نصب محلی Mongo atlas or local install

• Mongoose نسخه 6 (نسخه جدیدتر) Mongoose version 6 (newer version)

• Mongoose وصل کنید Mongoose connect

• درخواست پست Axios Axios post request

• مدل کاربر User model

• توابع کمکی Bcrypt Bcrypt helper functions

ثبت Registration

• ثبت نام کاربر Register user

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

• در حال بارگیری اسپینر Loading spinner

• فایل های Env و gitignore Env and gitignore files

• سرور توسعه دهنده بعدی سفارشی (فقط برای حالت توسعه دهنده) Custom next dev server (for dev mode only)

• لینک های ناوبری فعال Active nav links

وارد شدن Login

• صفحه ورود Login page

• باطن ورود به سیستم به روز شد Login backend updated

• در حال تلاش برای ورود به سیستم Trying login

وضعیت جهانی، CSRF، رهگیرهای محوری و مسیرهای حفاظت شده Global state, CSRF, axios interceptors and protected routes

• حالت جهانی با api زمینه و قلاب کاهنده Global state with context api and reducer hook

• ارسال پاسخ کاربر به زمینه Dispatch user response to context

• اطلاعات کاربر را در بازخوانی و تغییر مسیر صفحه حفظ کنید Preserve user info on page refresh and redirect

• خروج Logout

• پیوندهای ناوبری مشروط Conditional nav links

• محافظت از صفحات در برابر کاربر لاگین شده Protecting pages from loggedin user

• مدیریت توکن منقضی شده با استفاده از رهگیرهای axios Handling expired token using axios interceptors

• حفاظت CSRF CSRF protection

• رمز را تأیید کنید و کاربر فعلی را دریافت کنید Verify token and get current user

• صفحه محافظت شده Protected page

• مسیر کاربر جزء Wrapper Wrapper component user route

AWS IAM AWS IAM

• راه اندازی AWS کاربر IAM AWS setup IAM user

• به عنوان کاربر IAM وارد AWS شوید و ایمیل را تأیید کنید Login to AWS as IAM user and verify email

ارسال ایمیل و بازنشانی رمز عبور Sending email and password reset

• ارسال ایمیل آزمایشی Sending test email

• گردش کار بازنشانی رمز عبور Password reset workflow

• صفحه رمز عبور را فراموش کرده اید Forgot password page

• برای بازنشانی رمز عبور ایمیل ارسال کنید Send email to reset password

• کلاینت رمز عبور را بازنشانی کنید Reset password client

• بازنشانی سرور رمز عبور Reset password server

نصب نوار Stripe onboarding

• راه اندازی راه راه Stripe setup

• ناوبری نوار کناری کاربر User sidebar nav

• پیوندها و صفحات مشروط Conditional links and pages

• صفحه مربی شوید Become instructor page

• پیوند حساب راه راه برای ورود Stripe account link for onboarding

• سرویس گیرنده Stripe onboarding Stripe onboarding client

• مشکلات اتصال Stripe Connect Stripe Connect Onboarding Issues

• صفحه برگشت به تماس خطی Stripe callback page

• وضعیت حساب کاربری از نوار User account status from stripe

مربی فعلی و مسیرهای حفاظت شده Current instructor and protected routes

• اطلاعات کاربر به روز شده را به متن ارسال کنید Dispatch updated user info to context

• سرور مربی فعلی Current instructor server

• مسیرهای حفاظت شده مربی Instructor protected routes

• لینک های ناوبری فعال Active nav links

• لینک های ناوبری فعال Active nav links

ایجاد دوره Create course

• فرم دوره 1 را ایجاد کنید Create course form part 1

• ایجاد فرم قسمت 2 دوره Create course form part 2

• ایجاد جزء دوره Create course component

• کشویی قیمت و دسته بندی Price dropdown and category

آپلود تصویر AWS S3 AWS S3 Image upload

• پیش نمایش تصویر Image preview

• مشتری تغییر اندازه تصویر Image resize client

• خط مشی سطل AWS S3 AWS S3 bucket policy

• آپلود تصویر در S3 Upload image to S3

• مشتری حذف تصویر Image remove client

• حذف تصویر سرور S3 Delete image S3 server

ذخیره دوره و دسترسی مدرس Save course and instructor access

• طرح واره دوره Course schema

• میان افزار مربی است و نقطه پایانی ایجاد می کند Is instructor middleware and create endpoint

• ذخیره دوره ها در پایگاه داده Save courses in database

• دوره های مدرس در داشبورد Instructor courses in dashboard

• لیست دوره های مدرس Instructor course list

• نمای تک دوره ای برای مدرسان Single course view for instructors

• نمای تک دوره Single course view

• زمینه نشانه گذاری را نمایش دهید Display markdown context

آپلود ویدئو AWS S3 و دروس AWS S3 Video upload and lessons

• اضافه کردن مدال درس Add lesson modal

• اضافه کردن فرم درس Add lesson form

• دکمه آپلود ویدیو Video upload button

• آپلود ویدیو را با استفاده از داده های فرم ارسال کنید Send video upload using form data

• آپلود ویدیو در S3 Upload video to S3

• درخواست ویدیو را حذف کنید Remove video request

• حذف ویدیو از S3 Remove video from S3

• فقط مربی می تواند ویدیوها را آپلود و حذف کند Only instructor can upload and delete videos

• اضافه کردن درس Add lesson

• ارائه دروس به عنوان آیتم های فهرست Rendering lessons as list items

به روز رسانی دوره، درس ها و تنظیم مجدد Update course, lessons and rearrange

• صفحه ویرایش دوره Course edit page

• استفاده مجدد از مؤلفه برای به‌روزرسانی دوره Reuse component to update course

• سرور دوره را به روز کنید Update course server

• فهرست دروس در صفحه ویرایش List of lessons on edit page

• اقلام قابل کشیدن Draggable items

• برای مرتب کردن مجدد درس ها را بکشید و رها کنید Drag and drop lessons to reorder

به روز رسانی و حذف درس Lesson update and delete

• کلاینت درس را حذف کنید Delete lesson client

• سرور درس را حذف کنید Delete lesson server

• به روز رسانی مدال درس Update lesson modal

• به روز رسانی جزء درس Update lesson component

• دکمه پیش‌نمایش ویدیو و سوئیچ Video preview and switch button

• حذف و آپلود ویدیو جدید در به روز رسانی Remove and upload new video on update

• مشتری درخواست درس را به روز کنید Update lesson request client

• سرور درس را به روز کنید Update lesson server

دوره های نشر Publishing courses

• انتشار نمادهای لغو انتشار Publish unpublish icons

• دوره انتشار مشتری لغو انتشار Course publish unpublish client

• دوره انتشار سرور لغو انتشار Course publish unpublish server

• سرور دوره های منتشر شده Published courses server

• مشتری دوره های منتشر شده Published courses client

• جزء کارت مورچه برای نمایش دوره ها Ant card component to display courses

نمای تک دوره و سئو Single course view and SEO

• دوره های رندر سرور برای سئو Server render courses for SEO

• واکشی دوره تک Fetch single course

• نمایش اطلاعات تک دوره Display single course info

• پیش نمایش ویدیو یا تصویر Video or image preview

• جامبوترون تک دوره Single course jumbotron

• حالت پیش نمایش دوره Course preview modal

• نمایش دروس دوره Show course lessons

• نمایش پیش نمایش دروس Show lessons preview

ثبت نام رایگان Free enrollment

• دکمه ثبت نام Enroll button

• سرور ثبت نام را بررسی کنید Check enrollment server

• رندر مشروط دکمه ثبت نام Conditional rendering of enroll button

• سرور ثبت نام رایگان Free enrollment server

• مشتری ثبت نام رایگان Free enrollment client

ثبت نام پولی Paid enrollment

• تنظیم پرداخت خطی Stripe payment setup

• سرور ثبت نام پولی Stripe Stripe paid enrollment server

• مشتری ثبت نام پولی Stripe Stripe paid enrollment client

• صفحه لغو راه راه Stripe cancel page

• صفحه موفقیت راه راه Stripe success page

• سرور موفقیت راه راه Stripe success server

دوره های کاربری و مسیر دانشجویی User courses and student route

• دوره های کاربر در داشبورد User courses on dashboard

• لیست دوره های کاربری List of user courses

• نمای تک دوره ای برای کاربر Single course view for user

• میان افزار ثبت نام شده است Is enrolled middleware

• مشتری مسیر دانش آموزی Student route client

داشبورد دوره کاربر User course dashboard

• نوار کناری منوی درس ها Lessons menu sidebar

• روی محتوای درس کلیک کرد و نوار کناری جمع شد Clicked lesson content and collapsed sidebar

• علامت گذاری به عنوان مشتری تکمیل شده Mark as completed client

• علامت گذاری به عنوان سرور تکمیل شده Mark as completed server

• دروس تکمیل شده Completed lessons

• علامت پیاده سازی تکمیل شد Implement mark completed

• علامت پیاده سازی ناقص است Implement mark incomplete

داشبورد مربی Instructor dashboard

• تعداد دانش آموزان ثبت نام شده Enrolled students count

• صفحه درآمد Revenue page

• مانده درآمد مربی Instructor revenue balance

• تاریخچه حساب مربی و پرداخت ها Instructor account history and payouts

• مقداری استایل Some styling

گسترش Deployment

• راه اندازی اقیانوس دیجیتال Digital ocean setup

• دسترسی به SSH SSH access

• کد را به Github فشار دهید Push code to Github

• نصب Nodejs، NGINX و pull code از Github Installing Nodejs, NGINX and pull code from Github

• اجرای سرور، نصب MongoDB و commit تغییرات Running server, installing MongoDB and commit changes

• در حال اجرا React، مشتری Nextjs Running React, Nextjs client

• به عنوان مربی در سایت زنده ثبت نام کنید Signup as instructor in live site

• ایجاد دوره ثبت نام رایگان، پولی، دریافت پول و موارد دیگر Create enroll publish free, paid course, getting paid and more

جایزه Bonus

• دوره های دیگری که ممکن است دوست داشته باشید Other courses you may like

• به سرور Discord من بپیوندید Join my Discord server