آموزش React Redux NodeJs Marketplace - ساخت اپلیکیشن رزرو هتل

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

معرفی Introduction

• درباره برنامه About the app

• نکات برجسته دوره Course highlights

• کد منبع را دانلود کنید Download source code

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

معرفی Introduction

• درباره برنامه About the app

• نکات برجسته دوره Course highlights

• کد منبع را دانلود کنید Download source code

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

راه اندازی برنامه React React app setup

• پیاده سازی مسیریابی Implement routing

راه اندازی برنامه React React app setup

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

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

• نسخه روتر React React router version

• نسخه روتر React React router version

• پیاده سازی مسیریابی Implement routing

• منوی Nav Nav menu

• منوی Nav Nav menu

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

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

• دسترسی به حالت redux Accessing redux state

• دسترسی به حالت redux Accessing redux state

راه اندازی سرور گره Node server setup

• استفاده از دستور صادرات واردات Using import export syntax

• مسیرها Routes

• بارگیری خودکار مسیرها Autoloading routes

• متغیرهای Env Env variables

• نسخه Mongoose Mongoose version

راه اندازی سرور گره Node server setup

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

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

• سرور اکسپرس Express server

• سرور اکسپرس Express server

• استفاده از دستور صادرات واردات Using import export syntax

• مسیرها Routes

• بارگیری خودکار مسیرها Autoloading routes

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

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

• متغیرهای Env Env variables

• استفاده از مورگان Using morgan

• استفاده از مورگان Using morgan

• نسخه Mongoose Mongoose version

• راه اندازی پایگاه داده Database setup

• راه اندازی پایگاه داده Database setup

ثبت نام کاربر User Registration

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

• فرم ثبت نام Register form

• با استفاده از axios Using axios

• نقطه پایانی و میان افزار json را ثبت کنید Register endpoint and json middleware

• ذخیره کاربر در پایگاه داده Save user in database

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

ثبت نام کاربر User Registration

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

• فرم ثبت نام Register form

• جزء فرم جدا Separate form component

• جزء فرم جدا Separate form component

• با استفاده از axios Using axios

• نقطه پایانی و میان افزار json را ثبت کنید Register endpoint and json middleware

• طرحواره کاربر User schema

• طرحواره کاربر User schema

• رمز عبور هش Bcrypt Bcrypt hash password

• رمز عبور هش Bcrypt Bcrypt hash password

• ذخیره کاربر در پایگاه داده Save user in database

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

• متغیرهای Env در react Env variables in react

• متغیرهای Env در react Env variables in react

ورود کاربر User login

• اقدامات Actions

• JWT هنگام ورود JWT on login

• وضعیت Redux در بارگذاری مجدد صفحه Redux state on page reload

• رندر و خروج مشروط Conditional rendering and logout

ورود کاربر User login

• اقدامات Actions

• صفحه ورود Login page

• صفحه ورود Login page

• درخواست ورود Login request

• درخواست ورود Login request

• مقایسه رمز عبور Compare password

• مقایسه رمز عبور Compare password

• فرآیند ورود به سیستم Process login

• فرآیند ورود به سیستم Process login

• JWT هنگام ورود JWT on login

• کاربر و توکن در ذخیره سازی redux و محلی User and token in redux and local storage

• کاربر و توکن در ذخیره سازی redux و محلی User and token in redux and local storage

• وضعیت Redux در بارگذاری مجدد صفحه Redux state on page reload

• رندر و خروج مشروط Conditional rendering and logout

مسیر خصوصی، ناوبری و داشبورد کاربر Private route, navigation and user dashboard

• مسیر خصوصی Private route

• ناوبری داشبورد Dashboard nav

• Nav 1 را وصل کنید Connect nav 1

• پیوندها در صفحه داشبورد کاربر Links on user dashboard page

مسیر خصوصی، ناوبری و داشبورد کاربر Private route, navigation and user dashboard

• مسیر خصوصی Private route

• ناوبری داشبورد Dashboard nav

• لینک فعال Active link

• لینک فعال Active link

• Nav 1 را وصل کنید Connect nav 1

• Nav 2 را وصل کنید Connect nav 2

• Nav 2 را وصل کنید Connect nav 2

• پیوندها در صفحه داشبورد کاربر Links on user dashboard page

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

• نمایش محتوا برای کاربران غیر متصل Showing content for not connected users

• اتصال اقدام حساب Connect account action

• رمز را با express jwt تأیید کنید Verify token with express jwt

• شناسه حساب راه راه را ذخیره کنید Save stripe account id

• ایجاد لینک ورود Create login link

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

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

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

• رندر مشروط برای کاربران متصل و غیر متصل Conditional rendering for connected and not connected users

• رندر مشروط برای کاربران متصل و غیر متصل Conditional rendering for connected and not connected users

• نمایش محتوا برای کاربران غیر متصل Showing content for not connected users

• اتصال اقدام حساب Connect account action

• رمز را با express jwt تأیید کنید Verify token with express jwt

• استفاده از نوار در باطن Using stripe in backend

• استفاده از نوار در باطن Using stripe in backend

• شناسه حساب راه راه را ذخیره کنید Save stripe account id

• ایجاد لینک ورود Create login link

تنظیمات راه‌اندازی و پرداخت Stripe onboarding and payout settings

• وضعیت حساب را در پاسخ به تماس نواری دریافت کنید Get account status in stripe callback

• وضعیت نوار کاربر در redux و ذخیره سازی محلی User stripe status in redux and local storage

• موجودی حساب را دریافت کنید Get account balance

• تنظیمات پرداخت کاربران راه راه Stripe users payout settings

تنظیمات راه‌اندازی و پرداخت Stripe onboarding and payout settings

• روند شبانه روزی Onboarding process

• روند شبانه روزی Onboarding process

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

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

• عملکردهایی برای دریافت وضعیت نوار کاربر Functions to get user stripe status

• عملکردهایی برای دریافت وضعیت نوار کاربر Functions to get user stripe status

• وضعیت حساب را در پاسخ به تماس نواری دریافت کنید Get account status in stripe callback

• وضعیت به روز شده فروشنده نواری را در پایگاه داده ذخیره کنید Save stripe seller's updated status in database

• وضعیت به روز شده فروشنده نواری را در پایگاه داده ذخیره کنید Save stripe seller's updated status in database

• وضعیت نوار کاربر در redux و ذخیره سازی محلی User stripe status in redux and local storage

• روزهای تأخیر پرداخت راه راه را به‌روزرسانی کنید Update stripe payout delay days

• روزهای تأخیر پرداخت راه راه را به‌روزرسانی کنید Update stripe payout delay days

• موجودی معلق کاربر راه راه Stripe user pending balance

• موجودی معلق کاربر راه راه Stripe user pending balance

• موجودی حساب را دریافت کنید Get account balance

• سبک روبان و فرمت کننده ارز Ribbon style and currency formatter

• سبک روبان و فرمت کننده ارز Ribbon style and currency formatter

• لینک ورود به سیستم تنظیم پرداخت را درخواست کنید Request payout setting login link

• لینک ورود به سیستم تنظیم پرداخت را درخواست کنید Request payout setting login link

• تنظیمات پرداخت کاربران راه راه Stripe users payout settings

• خلاصه Recap

• خلاصه Recap

ایجاد هتل ها Create hotels

• فرم هتل جدید 1 New hotel form 1

• فرم هتل جدید 2 New hotel form 2

• پیشنهاد آدرس مکان‌های الگوریتم کشویی خودکار Auto dropdown algolia places address suggestion

• مولفه انتخاب و گزینه مورچه Ant select and options component

• ایجاد عملکرد هتل Create hotel function

• طرح هتل Hotel schema

ایجاد هتل ها Create hotels

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

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

• فرم هتل جدید 1 New hotel form 1

• فرم هتل جدید 2 New hotel form 2

• در تغییر کنترل کننده تصویر و پیش نمایش تصویر On change image handler and image preview

• در تغییر کنترل کننده تصویر و پیش نمایش تصویر On change image handler and image preview

• پیشنهاد آدرس مکان‌های الگوریتم کشویی خودکار Auto dropdown algolia places address suggestion

• خرماگیر Datepicker

• خرماگیر Datepicker

• مولفه انتخاب و گزینه مورچه Ant select and options component

• ایجاد عملکرد هتل Create hotel function

• ارسال داده های فرم Sending form data

• ارسال داده های فرم Sending form data

• طرح هتل Hotel schema

• هتل جدید ایجاد کنید Create new hotel

• هتل جدید ایجاد کنید Create new hotel

• ایجاد جزء هتل Create hotel component

• ایجاد جزء هتل Create hotel component

• پیغام خطا Error messages

• پیغام خطا Error messages

نمایش هتل ها Display hotels

• دریافت نقطه پایانی هتل ها Get hotels endpoint

• نمایش ویژگی های هتل Display hotel's features

نمایش هتل ها Display hotels

• دریافت نقطه پایانی هتل ها Get hotels endpoint

• هتل ها در صفحه اصلی Hotels in home page

• هتل ها در صفحه اصلی Hotels in home page

• نمایش هتل ها در جزء کارت کوچک Display hotels in small card component

• نمایش هتل ها در جزء کارت کوچک Display hotels in small card component

• نمایش ویژگی های هتل Display hotel's features

• نمایش تصویر هتل Show hotel image

• نمایش تصویر هتل Show hotel image

فروشنده هتل ها Seller hotels

• اشکال زدایی - سرصفحه ها قبلاً خطا ارسال کرده اند Debug - Headers already sent error

• هتل ها در داشبورد فروشنده Hotels in seller's dashboard

فروشنده هتل ها Seller hotels

• رندر مشروط ویرایش حذف Conditional rendering edit delete

• رندر مشروط ویرایش حذف Conditional rendering edit delete

• اشکال زدایی - سرصفحه ها قبلاً خطا ارسال کرده اند Debug - Headers already sent error

• فروشنده هتل ها Seller hotels

• فروشنده هتل ها Seller hotels

• درخواست هتل های فروشنده و رفع مشکل postedBy Seller hotels request and fixing postedBy issue

• درخواست هتل های فروشنده و رفع مشکل postedBy Seller hotels request and fixing postedBy issue

• هتل ها در داشبورد فروشنده Hotels in seller's dashboard

هتل ها را ویرایش و حذف می کنند Hotels edit and delete

• مشتری هتل را حذف کنید Delete hotel client

• هتل مجردی را بیاورید Fetch single hotel

• ویرایش صفحه هتل Edit hotel page

• داده های فرم را برای به روز رسانی هتل ارسال کنید Send form data to update hotel

• رفع به روز رسانی تصویر Image update fix

هتل ها را ویرایش و حذف می کنند Hotels edit and delete

• مشتری هتل را حذف کنید Delete hotel client

• سرور هتل را حذف کنید Delete hotel server

• سرور هتل را حذف کنید Delete hotel server

• API هتل تنها Single hotel API

• API هتل تنها Single hotel API

• هتل مجردی را بیاورید Fetch single hotel

• ویرایش صفحه هتل Edit hotel page

• هتل را در فرم ویرایش از قبل پر کنید Pre populate hotel in edit form

• هتل را در فرم ویرایش از قبل پر کنید Pre populate hotel in edit form

• داده های فرم را برای به روز رسانی هتل ارسال کنید Send form data to update hotel

• ویرایش هتل را ذخیره کنید Save hotel edit

• ویرایش هتل را ذخیره کنید Save hotel edit

• رفع به روز رسانی تصویر Image update fix

رزرو هتل و تسویه حساب با راه راه Booking a hotel and checkout with stripe

• نمای هتل یک نفره 2 Single hotel view 2

• پرداخت با راه راه Checkout with stripe

رزرو هتل و تسویه حساب با راه راه Booking a hotel and checkout with stripe

• نمای هتل یک نفره 1 Single hotel view 1

• نمای هتل یک نفره 1 Single hotel view 1

• نمای هتل یک نفره 2 Single hotel view 2

• رفع خطای ورود دکمه اکنون رزرو کنید Book now button login error fix

• رفع خطای ورود دکمه اکنون رزرو کنید Book now button login error fix

• درباره پرداخت جلسه راه راه About stripe session checkout

• درباره پرداخت جلسه راه راه About stripe session checkout

• دریافت شی جلسه راه راه Get stripe session object

• دریافت شی جلسه راه راه Get stripe session object

• Stripe session ذخیره و پاسخ Stripe session save and response

• Stripe session ذخیره و پاسخ Stripe session save and response

• پرداخت با راه راه Checkout with stripe

• مشاهده موجودی حساب View account balance

• مشاهده موجودی حساب View account balance

دست زدن به موفقیت راه راه Handling stripe success

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

دست زدن به موفقیت راه راه Handling stripe success

• نوار موفقیت و لغو صفحه Stripe success and cancel page

• نوار موفقیت و لغو صفحه Stripe success and cancel page

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

• مدل سفارش Order model

• مدل سفارش Order model

• باطن موفقیت راه راه Stripe success backend

• باطن موفقیت راه راه Stripe success backend

• تلاش برای موفقیت در پرداخت موفق Trying stripe success on successful payment

• تلاش برای موفقیت در پرداخت موفق Trying stripe success on successful payment

رزرو هتل کاربران Users hotel bookings

• رزرو هتل توسط کاربر User's hotel bookings

• نمایش رزروهای کاربر Show user bookings

• از قبل رندر مشروط رزرو شده است Is already booked conditional rendering

رزرو هتل کاربران Users hotel bookings

• رزرو هتل توسط کاربر User's hotel bookings

• نمایش رزروهای کاربر Show user bookings

• جزء معین برای اطلاعات پرداخت Modal component for payment info

• جزء معین برای اطلاعات پرداخت Modal component for payment info

• از قبل رندر مشروط رزرو شده است Is already booked conditional rendering

• هتل های با تاریخ موجود قدیمی را پنهان کنید Hide hotels with old available date

• هتل های با تاریخ موجود قدیمی را پنهان کنید Hide hotels with old available date

جستجو در هتل ها Searching hotels

• فرم جستجو مکان های algolia Search form algolia places

• صفحه نتایج جستجو Search results page

جستجو در هتل ها Searching hotels

• فرم جستجو مکان های algolia Search form algolia places

• محدوده تاریخ و تخت را جستجو کنید Search date range and beds

• محدوده تاریخ و تخت را جستجو کنید Search date range and beds

• صفحه نتایج جستجو Search results page

• پاسخ هتل به درخواست جستجو Hotel response on search query

• پاسخ هتل به درخواست جستجو Hotel response on search query

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

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

جایزه Bonus

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

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

جایزه Bonus

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

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