آموزش React.js Academy برای مبتدیان با Firebase

React.js Academy for Beginners with Firebase

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره:

React یکی از محبوب‌ترین و مورد تقاضاترین فناوری‌ها در توسعه وب مدرن است!

این دوره طراحی شده است تا هر آنچه را که برای ساختن برنامه های کاربردی مدرن با استفاده از React نیاز دارید به شما آموزش دهد.

با استفاده از یک رویکرد مبتنی بر مؤلفه، React به شما امکان می‌دهد با استفاده از جاوا اسکریپت رابط‌های کاربری تعاملی بسازید.

این دوره کاملاً مبتنی بر پروژه است و هر چیزی که یاد می گیرید فوراً در یک پروژه بزرگ عملی می شود.

ما پروژه ای الهام گرفته از Trello خواهیم ساخت که به ما امکان می دهد از ویژگی های React از جمله:

  • پروژه های داربست با استفاده از Create React App

  • ساختار فایل و پوشه React و کاری که انجام می دهند

  • چه اجزایی هستند و چگونه از آنها استفاده کنید

  • نوشتن JSX

  • اجزای مبتنی بر کلاس و تابع

  • مدیریت وضعیت

  • درحال چرخش در میان داده ها

  • استفاده از props برای انتقال داده‌ها و روش‌ها به اجزا

  • تأیید اعتبار

  • اجزای سبک

  • فرم ها و ورودی ها با استفاده از اجزای کنترل شده و کنترل نشده

  • تنظیم روتر React

  • عبور وسایل روتر

  • پارامترهای URL

  • استفاده از با روتر و فشار

  • استفاده از روتر برای عبور از وضعیت

  • Context API

این دوره برای مبتدیان React طراحی شده است، یا اگر قبلاً آن را امتحان کرده اید و کاملاً موفق به درک آن نشده اید.

اگرچه HTML، CSS و برخی از تجربیات اولیه جاوا اسکریپت به شما کمک می‌کند تا بیشترین بهره را از این دوره ببرید.

با این حال، ما در اینجا متوقف نمی شویم! حتی فکر می‌کنیم که React رابط کاربری ما را مدیریت می‌کند، اکثر برنامه‌ها نیز به یک Backend نیز نیاز دارند.

ما از Firebase برای ارائه یک پایگاه داده بیدرنگ به پروژه خود استفاده می کنیم.

این به ما این امکان را می‌دهد که نه تنها داده‌های خود را ذخیره کنیم، بلکه در صورت وقوع هر گونه تغییر پایگاه داده، همراه با موارد زیر، مشترک باقی بمانیم:

  • تنظیم پایگاه داده Firestore

  • فشار و خواندن داده ها از پایگاه داده ما

  • به روز رسانی و حذف داده ها

  • مرتب‌سازی و فیلتر کردن داده‌ها

  • داده های بیدرنگ با استفاده از onSnapshot

  • بررسی تغییرات سند

ما همچنین از Firebase برای رسیدگی به احراز هویت استفاده می‌کنیم. کاربران می توانند ثبت نام کنند، وارد و خارج شوند و به کاربران این امکان را می دهند که تابلوهای شخصی خود را داشته باشند که فقط آنها می توانند ببینند و ویرایش کنند.

ما از Context API React استفاده می‌کنیم تا وضعیت احراز هویت کاربران را در سراسر برنامه خود منتقل کنیم و رندر شرطی را مدیریت کنیم.

برای جمع‌بندی همه چیز، به نحوه ساخت پروژه خود برای تولید نگاه می‌کنیم و سپس برای دیدن بقیه جهان مستقر می‌کنیم!

بنابراین، اگر به دنبال یادگیری React، همراه با ساخت یک پروژه سرگرم کننده هستید، در این دوره ثبت نام کنید و من شما را در کلاس می بینم!

این دوره کاملاً مبتنی بر پروژه است و ما در طول دوره یک پروژه بزرگ خواهیم ساخت.

ما یک برنامه سبک Trello با استفاده از React و Firebase برای پایگاه داده و احراز هویت پروژه های خود خواهیم ساخت.

با خیال راحت پروژه خود را به طور کامل سفارشی کنید و آن را شخصی تر کنید یا ویژگی های جدیدی اضافه کنید.

اگر شما هم بتوانید پروژه خود را به اشتراک بگذارید، عالی خواهد بود!


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

درس ها Lessons

  • ایجاد React App Create React App

  • نقش ها و مجوزها Roles & permissions

  • کار با تغییرات سند Working with document changes

  • انتقال داده به عنوان پایه Passing data as props

  • متشکرم Thank you

  • به روز رسانی داده ها در Firebase Updating data in Firebase

  • خواندن داده ها از Firebase Reading data from Firebase

  • کارت های بیدرنگ با به روز رسانی Realtime cards with updates

  • احراز هویت Firebase و راه اندازی Firebase Authentication and set up

  • وضعیت عبور از طریق روتر Passing state via router

  • با استفاده از روتر و فشار Using withRouter and push

  • راه اندازی Firebase Setting up Firebase

  • راه اندازی روتر React Setting up React router

  • اجزا و ارجاعات کنترل نشده Uncontrolled components and refs

  • حذف تابلوها Deleting boards

  • فایل ها و پوشه های پروژه Project files & folders

  • فرم کارت جدید ایجاد کنید Create new card form

  • گذراندن روش ها به عنوان ابزار Passing methods as props

  • ابتدا به state و JSX نگاه کنید First look at state and JSX

  • مودال کارت را ویرایش کنید Edit card modal

  • اعتبار سنجی نوع Prop Prop type validation

  • ساختمان برای تولید Building for production

  • اجزای کنترل شده Controlled components

  • تغییر اندازه خودکار ناحیه متن Text area auto resize

  • ثبت نام کاربر User sign up

  • ورود و خروج Logging in and out

  • رندر مشروط Conditional rendering

  • چیزی که خواهیم ساخت What we will be building

  • تغییر مسیر و پیام های خطا Redirecting and error messages

  • پارامترهای URL URL parameters

  • چرخه عمر کامپوننت و حلقه Component lifecycle and looping

  • ابتدا به onSnapshot نگاه کنید First look at onSnapshot

  • آنچه برای این دوره نیاز خواهید داشت What you will need for this course

  • React Context API React Context API

  • تابلوهای رندر بر اساس کاربر Rendering boards based on user

  • حذف کارت ها و لیست ها از Firebase Deleting cards and lists from Firebase

  • اجزا در عمل Components in action

  • گوش دادن برای تغییرات auth Listening for auth changes

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

  • انتقال داده به Firebase Pushing data to Firebase

  • تنظیم برچسب ها Setting the labels

  • روش‌های Where & orderBy The where & orderBy methods

  • در حال استقرار در Netlify Deploying to Netlify

  • ارسال props به جزء روتر Passing props to a router component

  • به روز رسانی متن کارت Updating the card text

  • نگاهی دقیق تر به اجزا A closer look at components

نمایش نظرات

آموزش React.js Academy برای مبتدیان با Firebase
جزییات دوره
6h 33m
46
Skillshare (اسکیل شیر) Skillshare (اسکیل شیر)
(آخرین آپدیت)
539
- از 5
دارد
دارد
دارد
Chris Dixon
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Chris Dixon Chris Dixon

توسعه دهنده وب و معلم آنلاین

سلام، نام من کریس است و من یک توسعه دهنده وب از بریتانیا هستم. من یک مربی با تجربه هستم که بوت کمپ های توسعه وب را هدایت می کنم و همچنین دوره های آنلاین را تدریس می کنم.

زمینه های اصلی مورد علاقه من Vue.js، وردپرس، Shopify، جاوا اسکریپت، تجارت الکترونیک و تجارت هستند. من نسبت به کاری که انجام می‌دهم و به آموزش دیگران علاقه دارم.

دلیل شما برای یادگیری ساخت وب‌سایت هر چه باشد، انتخاب شغلی بسیار خوبی داشته‌اید.

انگیزه شخصی من این بود که رئیس خودم شوم و آزادی و انعطاف بیشتری در زندگی ام داشته باشم. من همچنین از چالش فنی آن و روشی که دائماً در حال تکامل است لذت می برم. من اولین وب‌سایت خود را در سال 1999 ساختم و مشاهده کردم که وب به آنچه امروز است تبدیل شده است.

من سعی می‌کنم دوره‌هایم را لذت‌بخش کنم و سعی می‌کنم به یاد بیاورم که در زمان یادگیری چگونه بود. من همچنین معتقدم بهترین راه برای یادگیری انجام دادن است و سعی می کنم تا حد امکان مثال های عملی را در دوره های خود بگنجانم.

از علاقه شما متشکریم و مشتاقانه منتظرم که به من بپیوندید.

کریس