ساخت برنامه های React و React Native بوسیله API های NodeJS

JavaScript React React-Node Node MongoDB Socketio RealTime Full Stack Web & Mobile (iOS Android) توسعه دهنده دوره MEGA

عنوان اصلی : React and React Native Apps with NodeJs API for Web & Mobile

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

مقدمه:
کد منبع را از Github دانلود کنید
پروژه React با روتر react 6 و bootstrap:
ایجاد پروژه react جدید
ایجاد صفحات و استفاده از bootstrap css
مسیریابی با روتر react v6
استفاده از ناوبری بوت استرپ با روتر react
ایجاد فرم و استفاده از افزونه های vscode
کار با React Hook ها، اجزا و ایجاد صفحات برای ورود/ثبت نام:
استفاده از قلاب useState برای افزودن حالت به اجزای واکنش
جزء قابل استفاده مجدد و افزونه tabnene
فیلدهای فرم اضافی و دکمه غیرفعال
در حال تأیید اعلان‌های گذرواژه و نان تست
ایجاد درخواست HTTP با استفاده از axios
ایجاد سرور احراز هویت:
تولید خودکار NodeJs API با احراز هویت کامل
نمای کلی فایل‌ها و پوشه‌های سرور
اطلس مونگو، sendgrid، env و gitignore:
در mongo atlas ثبت نام کنید و رشته اتصال را دریافت کنید
در Sendgrid ثبت نام کنید، فرستنده را تأیید کنید و کلید API را دریافت کنید
فایل Env، فایل gitignore و پاسخ ثبت نام
مدیریت ایالت، ذخیره‌سازی محلی، پاسخ ورود به سیستم و ناوبری:
مدیریت دولت جهانی با استفاده از زمینه در واکنش
افزودن پاسخ ثبت به متن
داده ها را از حافظه محلی ذخیره و دریافت کنید، سپس کاربر را با تاخیر هدایت کنید
ایجاد صفحه ورود به سیستم برای ورود کاربران
جزء دکمه قابل استفاده مجدد
نمایش تصویر در حال بارگیری تا زمان دریافت پاسخ
ارائه مشروط پیوندهای ورود و خروج
استفاده از منوی کشویی بوت استرپ
گذرواژه را فراموش کرده اید، رمز عبور را بازنشانی کنید:
گذرواژه فراموش شده و بازنشانی توضیح داده شده است
فراموش کردن درخواست رمز عبور و ارسال کد بازنشانی به ایمیل کاربران
به کاربر اجازه می‌دهد رمز عبور را بازنشانی کند و از مؤلفه توستر در سطح جهانی استفاده کند
محافظت از صفحات، مسیرها، میان افزارها و پیکربندی axios:
محافظت از صفحات با مسیریاب خصوصی React
تغییر مسیر را با استفاده از setInterval به تاخیر بیندازید
ایمن سازی مسیرهای سرویس گیرنده با ارسال توکن در هدرها به سرور
برای محافظت از مسیرها، میان افزار را بررسی کنید
میان افزار RequireSignin
پیکربندی Axios و مدیریت پاسخ خطای auth
گزینه‌های پیکربندی توستر و پیوند کشویی ناوبری اضافی
ایجاد مسیر وظیفه، کنترل‌کننده‌ها، فرم، زمینه و وظایف رندر:
مسیر کار، کنترل کننده، طرحواره و مدل
صفحه وظایف برای ایجاد کارهای جدید
Textarea برای ایجاد کار و ارسال به باطن
ذخیره کار در پایگاه داده و پر کردن پاسخ با اطلاعات کاربر
در حال واکشی همه وظایف از باطن
زمینه کار ایجاد کنید و حالت محلی را به بافت منتقل کنید
بازسازی کد - در حال حرکت ایجاد کار
ایجاد جزء لیست کارها برای ارائه همه وظایف
قالب‌بندی تاریخ با dayjs و لیست وظایف یک ظاهر طراحی شده
کارها را به‌روزرسانی و حذف کنید و می‌توانید میان‌افزار حذف را به‌روزرسانی کنید:
نصب طراحی مورچه و کار بر روی کار به روز رسانی
قابلیت مشاهده مؤلفه مدال را تغییر دهید
به روز رسانی فرم در جزء مودال
نمایش وظایف کاربرانی که وارد سیستم شده اند متفاوت از سایرین
دکمه های به روز رسانی و حذف مشروط
به‌روزرسانی وظایف و حذف درخواست‌های مشتری
می‌تواند میان‌افزار را در سرور به‌روزرسانی و حذف کند
به روز رسانی و حذف توابع کنترلر و امتحان آنها در کلاینت
تعداد کارها و برخی استایل
بارگیری بیشتر، جستجو، قلاب سفارشی و سبک چیدمان بنایی:
شمارش وظایف و به‌روزرسانی کنترل‌کننده وظایف برای پیاده‌سازی ویژگی بیشتر بارگذاری
در حال تلاش برای بارگیری عملکرد بیشتر از مشتری
ادامه کار در دکمه بارگذاری بیشتر
منطقه طرح‌بندی سفارشی
جستجو و فیلتر کردن وظایف
استفاده از قلاب سفارشی Search
کارهای بیدرنگ با استفاده از سوکتیو:
تنظیم سرور SockerIO
اتصال سوکت سرویس گیرنده سرور
هنگام ایجاد یک کار جدید، رویداد سوکت را منتشر کنید
کارهای بیدرنگ با استفاده از سرویس گیرنده سوکت و سرور
دقایق ایجاد شده را به صورت بیدرنگ نمایش دهید
بازسازی کد با استفاده از مؤلفه نوار جستجو
شروع با react native، expo، پیش نمایش برنامه و شبیه سازها:
استفاده از طرح بنایی برای نمایش وظایف
استایل
برنامه های موبایل بومی React
کمی صحبت بیشتر در مورد توسعه بومی React
با استفاده از expo پروژه react native ایجاد کنید
شبیه سازهای IOS و اندروید
نحوه پیش نمایش پروژه خود در تلفن واقعی
قطعات اصلی، استایل فلکس باکس، نمای وب و تصاویر:
استفاده از مؤلفه های بومی
استفاده از flexbox برای تعیین موقعیت عناصر روی صفحه
به اجزاء و لوازم بومی واکنش نشان دهید
استفاده از لوگوی خود به عنوان صفحه نمایش اسپلش
استفاده از نمای وب برای نمایش صفحات وب موجود در برنامه
صفحه ثبت نام و سبک متن
ثبت صفحه با تصویر پس زمینه
ورودی متن اصلی، نمای پیمایشی و کدورت قابل لمس:
استفاده از ورودی متن برای دریافت ورودی کاربر
ایجاد جزء ورودی قابل استفاده مجدد
استفاده از نمای پیمایش آگاه از صفحه کلید
ایجاد دکمه قابل استفاده مجدد با استفاده از کدورت قابل لمس
استفاده از حالت برای ذخیره ورودی کاربر
آزمودن چندین ابزار ورودی متنی متناسب با تفاوتموارد استفاده اولیه
درخواست API، زمینه، فضای ذخیره سازی ناهمگام و پیمایش واکنش:
ایجاد درخواست API برای ثبت نام کاربر
ایجاد زمینه احراز هویت
ذخیره کاربر و نشانه در فضای ذخیره‌سازی متنی و ناهمگام
استفاده از فضای ذخیره سازی ناهمگام با زمینه برای از پیش پر کردن اطلاعات
استفاده از react navigation
در حال امتحان کردن گزینه‌های سرصفحه
نمایش صفحات بر اساس وضعیت احراز هویت
در حال پیاده سازی خروج
صفحه نمایش های Axios، ورود، فراموشی و بازنشانی رمز عبور:
axios را با url پایه و رهگیر پیکربندی کنید
در حال آماده سازی صفحه ورود به سیستم
ورود با موفقیت انجام شد
رمز عبور را فراموش کرده اید
بازنشانی رمز عبور
استفاده از نمادها، پیمایش برگه پاورقی، ایجاد و ارائه وظایف و بارگذاری موارد دیگر:
استفاده از نمادها در react native
پیمایش برگه پاورقی
یک کار جدید ایجاد کنید
زمینه کار
همه کارها را بارگیری کنید
کار روی بارگذاری وظایف بیشتر
بارگیری وظایف بیشتر و بارگیری اسپینر
پردازش، به‌روزرسانی، حذف و جستجو/فیلتر کردن وظایف:
لیست وظایف را ارائه دهید
وظایف را در طرح بنایی ارائه دهید
ارائه وظایف متفاوت برای صاحبان کار
صفحه ویرایش کار را با فشار دادن باز کنید
به روز رسانی وظایف
حذف وظایف
جستجو/فیلتر کردن کار و استفاده از قلاب جستجو