اگه به دنیای فرانتاند علاقه داری و میخوای یه قدم جدیتر برداری، احتمالاً اسم React به گوشت خورده. ReactJS (یا همون ریاکت جیاس) یکی از محبوبترین کتابخانههای جاوااسکریپت برای ساخت رابط کاربریه که شرکتهای بزرگی مثل نتفلیکس، اینستاگرام و فیسبوک هم ازش استفاد...
معرفی دوره آموزش React JS مقدماتی
اگه به دنیای فرانتاند علاقه داری و میخوای یه قدم جدیتر برداری، احتمالاً اسم React به گوشت خورده. ReactJS (یا همون ریاکت جیاس) یکی از محبوبترین کتابخانههای جاوااسکریپت برای ساخت رابط کاربریه که شرکتهای بزرگی مثل نتفلیکس، اینستاگرام و فیسبوک هم ازش استفاده میکنن. جالبه بدونید این کتابخانه چند سالیه که در فهرست ۱۰ زبان و فریمورک برتر دنیا قرار داره و بازار کارش هم هر روز داغتر میشه.
دوره آموزش React JS مقدماتی از مجموعه دورههای آموزش برنامهنویسی مکتبخونه تهیه شده و هدفش اینه که شما رو از صفر با این کتابخانه پرطرفدار آشنا کنه. این روزها با تخفیف ویژه هم در دسترس علاقهمندان قرار گرفته.
📌 خلاصه مشخصات دوره
ویژگی
جزئیات
عنوان دوره
آموزش React JS مقدماتی
مدرس
احسان گازار
تعداد فصلها
۱۰ فصل
مدت آموزش
حدود ۹ ساعت
زمان مورد نیاز برای گذراندن
نزدیک به ۲۶ ساعت
سطح
مقدماتی
نسخه React
16.14
چرا یادگیری React مهمه؟
فرض کن میخوای یه اپلیکیشن فروشگاهی بسازی که وقتی کاربر یه محصول رو به سبد خرید اضافه میکنه، کل صفحه رفرش نشه و فقط همون بخش کوچیک بهروز بشه. این دقیقاً همون جاییه که React میدرخشه. این فریمورک به توسعهدهندهها اجازه میده وباپلیکیشنهای بزرگ بسازن که بدون بارگذاری مجدد صفحه، دادهها رو تغییر بدن.
هدف اصلی React سادهست: سریع بودن، سادگی و مقیاسپذیری. این کتابخانه فقط روی لایه رابط کاربری کار میکنه و میتونه با کتابخانهها یا فریمورکهای دیگه جاوااسکریپت مثل Angular ترکیب بشه.
این دوره برای کی مناسبه؟
کسایی که با HTML، CSS و جاوااسکریپت آشنایی دارن و دوست دارن صفحه وب بسازن
توسعهدهندههای بکاند (مثل PHP، جاوا یا ++C) که میخوان مهارت فرانتاند یاد بگیرن
کسایی که میخوان وارد بازار کار این حوزه بشن
افرادی که قصد دارن وبسایت شخصی خودشون رو راه بندازن
بعد از این دوره چه مهارتهایی به دست میارید؟
با تماشای این دوره، یه سری مهارت کاربردی و ملموس یاد میگیرید که مستقیم توی پروژههای واقعی به کارتون میاد:
ساخت یک اپلیکیشن ساده با React
درک مفهوم Virtual DOM و تفاوتش با DOM معمولی
کار با Hookها بهعنوان قابلیتهای جدید React
طراحی اپلیکیشن فروشگاهی همراه با سبد خرید
کار با Local Storage
ساخت صفحات مختلف سایت و Deploy کردنش
استفاده از انیمیشن، عکس و آیکون در پروژه
کار با کتابخانه Create React App
سرفصلهای دوره
توی این دوره ۱۰ فصل جداگانه طراحی شده که هر کدوم یه بخش مشخص از React رو پوشش میده:
فصل اول: آشنایی با React و ویژگیهاش
فصل دوم: معرفی Create React App
فصل سوم: نکات مربوط به Life Cycleها
فصل چهارم: آموزش React Hookها
فصل پنجم: انیمیشن و اعتبارسنجی (Validation)
فصل ششم: نحوه Deploy کردن پروژه
فصل هفتم: نکات تکمیلی و سوالات متداول
فصل هشتم: پروژه Todo بهعنوان تکلیف دوره
فصل نهم: ساخت وبسایت شخصی برای رزومه با Figma
فصل دهم: ویژگیهای جدید React JS 18
ReactJS دقیقاً چیه؟ 🤔
React.js یه چارچوب جاوااسکریپت سمت فرانتانده که فیسبوک توسعهش داده. با React میتونیم رابطهای کاربری قابل ترکیب و قابل پیشبینی بسازیم. این چارچوب منبعباز و مبتنی بر کامپوننته و از معماری MVC پیروی میکنه که لایه view اون مسئول مدیریت اپلیکیشنهای موبایل و وبه.
تاریخچه کوتاه
React توسط جردن واک (Jordan Walke) که یه مهندس نرمافزار فیسبوک بود ساخته شد. اولین نمونه اولیهاش با نام «FaxJS» منتشر شد. سال ۲۰۱۱ اول توی فید خبری فیسبوک و بعد سال ۲۰۱۲ توی اینستاگرام به کار گرفته شد.
ReactJS با React Native چه فرقی داره؟
ReactJS برای اپلیکیشنهای وب طراحی شده و باید با HTML، CSS و جاوااسکریپت کار کنید. اما React Native از همون مکانیزمهای React استفاده میکنه با این شعار که «یک بار یاد بگیر، همهجا بنویس» و بهتون اجازه میده برای چند پلتفرم بهطور همزمان اپلیکیشن موبایل بسازید.
چرا React رو انتخاب کنیم؟
دلایل زیادی برای انتخاب React وجود داره که مهمترینهاش ایناست:
سرعت بالا: بهروزرسانیهای پیچیده رو خیلی سریع مدیریت میکنه
مدولار بودن: به جای فایلهای بزرگ، فایلهای کوچیک و قابل استفاده مجدد مینویسید
مقیاسپذیری: برای اپلیکیشنهای بزرگ با تغییرات داده زیاد عالیه
انعطافپذیری: با تقسیم اپلیکیشن به اجزای کوچیک، رویکرد متفاوتی در ساخت UI داره
محبوبیت: به خاطر Virtual DOM عملکرد بهتری نسبت به رقبا داره
یادگیری آسان: فقط به درک حداقلی از HTML و جاوااسکریپت نیاز داره
مناسب برای سئو: رندر سمت سرور باعث میشه سایتهای React در نتایج جستجو رتبه بهتری بگیرن
کامپوننتهای قابل استفاده مجدد: فرآیند توسعه و دیباگ رو بهتر میکنه
انجمن قوی: ابزارها و افزونههای زیادی برای توسعهدهندههای React وجود داره
مفاهیم اساسی که یاد میگیرید
کامپوننت (Component)
کامپوننتها قلب React هستن. مثل توابع جاوااسکریپت بهتون اجازه میدن رابط کاربری رو به قطعههای مستقل و قابل استفاده مجدد تقسیم کنید. دو نوع کامپوننت داریم:
کامپوننتهای تابعی: بدون حالت (state) و شامل توابع ساده جاوااسکریپت
کامپوننتهای کلاسی: پیچیدهتر، با قابلیت مدیریت state و متد رندر اختصاصی
State و Props
State جاییه که دادهها از اون میان و میتونه در طول زمان تغییر کنه. Props هم به معنی خواصه و فقط خواندنیه. تفاوت اصلیشون اینه که State داخل کامپوننت مدیریت میشه ولی Props از بیرون به کامپوننت پاس داده میشه.