×
ribbon

آموزش React JS مقدماتی

ReactJS (ری اکت جی اس) یک کتابخانه محبوب جاوا اسکریپت است که برای توسعه وب استفاده می‌شود. React.js یا ReactJS یا React نام‌های مختلف کتابخانه ReactJS هستند. بسیاری از شرکت‌های بزرگ امروزی (نتفلیکس، اینستاگرام، فیس‌بوک ... ادامه

ارائه دهنده:  مکتب‌خونه  مکتب‌خونه
مدرس دوره:
4 (17 رای)
سطح: مقدماتی
 پلاس
  
زمان مورد نیاز برای گذارندن دوره:  26 ساعت
مجموع محتوای آموزشی:  9 ساعت ویدئو - 17 ساعت تمرین و پروژه
 (قابل دانلود می‌باشد)
مهلت دوره:  4 هفته
  
حد نصاب قبولی در دوره:  70 نمره
فارغ‌التحصیل شدن در این دوره نیاز به ارسال تمرین‌ها و پروژه‌های الزامی دارد. 
organization-pic  گواهینامه این دوره توسط مکتب‌خونه ارائه می‌شود.
course-feature   گواهی‌نامه مکتب‌خونه course-feature   خدمات منتورینگ course-feature   پروژه محور course-feature   تمرین و آزمون course-feature   تالار گفتگو course-feature   تسهیل استخدام

آنچه در این دوره می‌آموزیم:

 آموزش ری اکت جی اس

 آموزش React JS مقدماتی

 آموزش پروژه محور React JS مقدماتی

 آموزس طراحی اپلیکیشن با React JS

تغییرات دوره آموزش React JS مقدماتی

نسخه 1.0 - 1400/02/21

انتشار اولیه

نسخه 1.1 - 1401/04/25

فصل اول آپدیت شد و فصل دهم به دوره اضافه شد.

پیش‌نیاز‌ها

برای شروع آموزش ری اکت جی اس مقدماتی باید کار با CSS ،HTML و جاوا اسکریپت را یاد داشته باشید؛ بنابراین اگر کدنویسی به این زبان‌ها را بلد نیستید یا نمی‌دانید وظیفه جاوا اسکریپت در صفحات وب چیست باید دوره‌های زیر را بگذرانید:

  • آموزش HTML و CSS
  • آموزش جاوا اسکریپت

سرفصل‌های دوره آموزش React JS مقدماتی

فصل اول: React چیست و معرفی ویژگی‌های آن

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

  ابزار‌ها و محیط برنامه‌نویسی با React
"04:45  
  آشنایی با مفاهیم React و تفاوت آن با سایر کتابخانه‌ها
"06:48  
  JSX چیست و چطور از Babel استفاده کنیم
"04:59  
  کامپوننت چیست و اولین کامپوننت (React Component)
"05:07  
  کوییز - فصل اول
 100%    
"03:00  
  چطور دوره را بگذرانیم و از محتوای آموزشی React مقدماتی استفاده کنیم؟
"03:24  
فصل دوم: معرفی Create React App و ویژگی‌هان آن

پس از آشنایی با مفاهیم اولیه و کلیت ری اکت جی اس وقت آن است که بتوانید با آن کار کنید، در این فصل نحوه استفاده از Create React App را یاد می‌گیرید و با چیدمان صفحات، ساخت صفحات مختلف و Event ها در ری اکت آشنا می‌شوید.

  چطور از Create React App استفاده کنیم
"05:48  
  روش استفاده از CSS و استایل دادن به کامپوننت‌ها
"15:32  
  کد زدن برای داشتن Layout یا ساختار صفحه با React
"09:45  
  props ها در React
"11:25  
  ساخت صفحه‌های مختلف با React Router
"09:59  
  Event ها در React
"12:40  
  مدیریت State ها
"15:18  
  سورس کد دوره React JS مقدماتی
"00:00  
  کوییز - فصل دوم
 8.1%    
"03:00  
  تمرین برنامه‌نویسی: ساخت سایت شخصی (الزامی)
 91.9%    
"180:00  
فصل سوم: نکات در مورد Life Cycle ها در React

Life Cycle متد‌هایی هستند که برای دسترسی به هر یک از مراحل تولد تا نابودی یک Component مورد استفاده قرار می‌گیرند، پس از آشنایی با چیدمان صفحات، ساخت صفحات مختلف و Event ها در React در فصل سوم با Component Life Cycle Methods آشنا خواهید شد و نحوه کار با آن و پیاده‌سازی آن در React را یاد می‌گیرید.

  نوشتن یک کامپوننت به روش قدیمی و به صورت Class
"09:48  
  مفهوم Life Cycle در React چیست؟‌
"10:58  
  data در کامپوننت و قرار دادن در State
"08:24  
  کوییز - فصل سوم
 100%    
"03:00  
فصل چهارم: آموزش React Hookها

به صورت کلی Hookها توابعی ساده هستند که این امکان را به ما می دهند از قابلیت های state و lifecycle در react بدون استفاده از ساختار class در کامپوننت هایی که به صورت تابع هستند استفاده کنیم، در این فصل به بررسی Hookها و مفهوم UseContext و UseReducer پرداخته می‌شود.

  آشنایی با useEffect در React
"07:27  
  خواندن data از API و نمایش در React
"04:07  
  آشنایی با useCallback در React
"12:27  
  آشنایی با Context و useContext
"14:20  
  چطور با useRef کار کنیم
"06:24  
  آشنایی با Hook ها
"05:21  
  اضافه کردن Icon به پرورژه و آشنایی با مفهوم Fragment
"10:15  
  آشنایی با useReducer
"05:45  
  استفاده از ترکیب useReducer و useContext
"15:37  
  کوییز - فصل چهارم
 9.7%    
"03:00  
  تمرین برنامه‌نویسی: جستجوی Emoji (الزامی)
 90.3%    
"180:00  
فصل پنجم: ویژگی‌های بیشتر برای Animation و Validation

در فصل پنجم دوره آموزش React JS مقدماتی با مفهوم Validate آشنا شده و نحوه کار کردن با آن در React را یاد می‌گیرید. همچنین در این فصل نحوه اضافه کردن Animation به پروژه خود را آموزش می‌بینید.

  اضافه کردن Animation به پروژه
"06:58  
  Route مشخصی برای صفحه هر محصول
"09:26  
  مفهوم validate کردن prop ها و Type Checking
"06:48  
  روش ساده‌ای برای Store Persistence
"05:24  
  آشنایی با utils ها و ساختار دادن App
"05:01  
  کوییز - فصل پنجم
 9.1%    
"03:00  
  تمرین برنامه‌نویسی: قیمت ارز رمزنگاری (Cryptocurrency) (الزامی)
 90.9%    
"180:00  
فصل ششم: چگونگی Deploy کردن

بعد از اینکه تست برنامه‌تان را به تمام رساندید، وقت آن است که برنامه را روی اینترنت منتشر کنید (Deploy) تا کاربران بتوانند آن را مشاهده کنند، در این فصل راه‌های آماده‌سازی پروژه برای Deploy کردن و نحوه Deploy کردن پروژه را یاد می‌گیرید.

  آموزش React Devtool
"04:06  
  آماده‌سازی پروژه Create React App برای محیط Production
"04:04  
  چطور با Now JS پروژه‌ی خود را در Deploy کنیم
"04:49  
فصل هفتم: نکات اضافی و سوالات متداول در React

در این فصل نکاتی که در این زمینه بسیار پرکاربرد است به شما آموزش داده می‌شود. در حین کار ممکن است با سؤالاتی مواجه شوید؛ در این فصل پاسخ به تمام سؤالات متداول کار با ری اکت جی اس در قالب فیلم‌های آموزشی برای شما تهیه شده‌است.

  راه‌های نمایش عکس در پروژه
"06:26  
  استفاده از eslint برای استانداردسازی codebase همراه با vscode
"08:18  
  کار با git و پروژه Create React App
"09:10  
  استفاده از SASS در پروژه Create React App
"06:05  
  استفاده از Bootstrap در پروژه Create React App
"03:34  
  استفاده از Material UI در پروژه Create React App
"07:33  
  تعریف زبان‌های Backend و نحوه‌ی ارتباط آن‌ها با Frontend
"13:33  
  Slideshow در پروژه‌های React
"10:24  
  آشنایی با White Pages
"16:00  
  برنامه‌نویسی پروژه Countdown
"05:23  
  کوییز - فصل هفتم
 10%    
"03:00  
  تمرین برنامه‌نویسی: ظاهرسازی سایت شخصی (الزامی)
 90%    
"180:00  
فصل هشتم: برنامه‌نویسی تکلیف دوره و پروژه Todo

در این فصل قرار است با استفاده از مطالبی که در فصل‌های قبل یاد گرفتید، پروژه Todo بنویسید. در این پروژه باید لیستی از کارهایی که قرار است کاربر انجام دهد را از او بگیرید. کاربر پس از انجام‌دادن تسک موردنظر باید بتواند آن را در لیست کارهای انجام‌شده قرار دهد و حتی آن را حذف کند. همچنین باید بتوانید آیتم‌ها را در سه دسته فعال، کامل شده و همه قرار دهید.

  شروع پروژه، نصب پیش‌نیاز ها و ساختن ساختار پروژه
"08:14  
  برنامه‌نویسی استایل‌های اولیه و ساختار کامپوننت‌ها
"20:57  
  استایل دادن بیشتر و آماده‌سازی پروژه و آشنایی با BEM
"18:17  
  فانکشن‌های AddTask, DeleteTask
"17:19  
  Filtering و تغییر وضعیت تسک‌ها
"16:39  
  پیاده‌سازی localStorage و Persistence برای پروژه و Deploy کردن آن
"12:04  
  سورس کد پروژه Todo
"00:00  
فصل نهم: برنامه‌نویسی تکلیف دوره و پروژه وب‌سایت شخصی برای رزومه با Figma

پروژه فصل آخر دوره ری اکت مقدماتی به طراحی یک وب‌سایت شخصی برای رزومه با Figma اختصاص‌یافته است. فیگما نوعی ابزار طراحی مبتنی بر فضای ابری (cloud) است. در این فصل یاد می‌گیرید که چگونه یک سایت را برای قراردادن رزومه خود در آن با امکاناتی مانند توضیح درباره خودتان و همچنین چگونگی ارتباط با شما بسازید.

  ایجاد پروژه با Create React App
"07:56  
  پیاده سازی و پیدا کردن فونت پروژه و تعریف Layout
"09:06  
  پیاده سازی Header و تعریف Button در پروژه
"17:29  
  پیاده سازی منو‌ها و Routing در پروژه
"16:30  
  پیاده‌سازی Footer بر اساس Figma
"21:20  
  پیاده‌سازی بخش Banner و بررسی کد
"05:45  
  پیاده سازی صفحه‌ی درباره
"01:56  
  سورس کد پروژه وب‌سایت شخصی
"00:00  
  کوییز - فصل نهم
 4.8%    
"03:00  
  پروژه نهایی: ساخت یک App نظرسنجی (الزامی)
 95.2%    
"300:00  
فصل دهم: ویژگی‌های جدید React JS 18

در این فصل ویژگی‌های جدید ورژن هجدهم React JS را مورد بررسی قرار می‌دهیم.

  ویژگی‌های جدید startTransition و UseTransition
"11:39  
  ویژگی‌های جدید Automatic Batching
"08:28  

ویژگی‌های دوره

گواهی‌نامه مکتب‌خونه
گواهی‌نامه مکتب‌خونه

در صورت قبولی در دوره، گواهی نامه رسمی پایان دوره توسط مکتب‌خونه به اسم شما صادر شده و در اختیار شما قرار می گیرد.

مشاهده نمونه گواهینامه

ویژگی‌های دوره

خدمات منتورینگ
خدمات منتورینگ

خدمات منتورینگ به معنای برخورداری دانشجو از راهنما یا پشتیبان علمی در طول گذراندن دوره می‌باشد. این خدمات شامل پاسخگویی به سوالات آموزشی(در قالب تیکتینگ)، تصحیح آزمون یا پروژه های دوره و ارائه باز خورد موثر به دانشجو می‌باشد.

ویژگی‌های دوره

پروژه محور
پروژه محور

این دوره طوری طراحی شده است که محتوای آموزشی دوره حول چند پروژه واقعی و کاربردی هستند تا یادگیری دانشجو در طول دوره به کاربردهای عملی تبدیل شود و به این ترتیب بالاترین سطح یادگیری را فراهم نمایند.

ویژگی‌های دوره

تمرین و آزمون
تمرین و آزمون

با قرار گرفتن تمرین ها و آزمون های مختلف در طول دوره، محیطی تعاملی فراهم شده است تا بهره گیری از محتوا و یادگیری بهتر و عمیق تر شود.

ویژگی‌های دوره

تالار گفتگو
تالار گفتگو

شما می توانید از طریق تالار گفتگو با دیگر دانشجویان دوره در ارتباط باشید، شبکه روابط حرفه ای خود را تقویت کنید یا سوالات مرتبط با دوره خود را از دیگر دانشجویان بپرسید.

ویژگی‌های دوره

تسهیل استخدام
تسهیل استخدام

در صورت قبولی در دوره، شما می‌توانید با وارد کردن اطلاعات آن در بخش دوره‌های آموزشی رزومه‌ساز «جاب ویژن»، تایید مهارت خود را در قالب اضافه شدن «مدال مهارت» به روزمه آنلاین خود دریافت نمایید. این مدال علاوه بر ایجاد تمایز در نمایش رزومه شما، باعث بالاتر قرار گرفتن آن در لیست انبوه رزومه‌های ارسالی به کارفرما شده و بدین ترتیب شانس شما را برای استخدام در سازمانهای موفق و پر متقاضی افزایش می‌دهد.

بررسی فرصت‌های شغلی

درباره دوره

ReactJS (ری اکت جی اس) یک کتابخانه محبوب جاوا اسکریپت است که برای توسعه وب استفاده می‌شود. React.js یا ReactJS یا React نام‌های مختلف کتابخانه ReactJS هستند. بسیاری از شرکت‌های بزرگ امروزی (نتفلیکس، اینستاگرام، فیس‌بوک و غیره) نیز از React JS استفاده می‌کنند. استفاده از این فریمورک نسبت به سایر فریمورک‌ها مزایای زیادی دارد و در چند سال اخیر در زیر 10 زبان برنامه‌نویسی برتر تحت شاخص‌های رتبه‌بندی زبان‌های مختلف قرار گرفته است. دوره آموزش React JS مقدماتی با هدف آموزش این کتابخانه محبوب توسط مکتب خونه تهیه و تدین شده است که در ادامه به معرفی آن خواهیم پرداخت و سپس در بخش بیشتر بدانید اطلاعات کامل‌تری از ری اکت جی اس را در اختیار کاربران علاقه‌مند قرار می‌دهیم.

معرفی دوره آموزش React JS مقدماتی

دوره آموزش React JS مقدماتی یکی از بهترین دوره‌ها برای شروع کار با فریمورک ری اکت است. این دوره آموزشی یک دوره مقدماتی به‌حساب می‌آید که در 10 فصل و 9 ساعت آموزشی تدریس شده است. زمان مورد نیاز برای گذارندن این دوره نزدیک به 26 ساعت خواهد بود. دوره مذکور توسط استاد احسان گازار تهیه شده است.

کاربرد دوره آموزش React JS مقدماتی چیست؟

فریم‌ورک ری اکت به توسعه‌دهندگان امکان ساخت وب اپلیکیشن‌های بزرگی را می‌دهد که می‌توانند بدون بارگیری مجدد صفحه داده‌ها را تغییر دهند. هدف اصلی ری اکت جی اس این است که سریع، ساده و مقیاس‌پذیر باشد. این فریم‌ورک تنها روی رابط‌های کاربری در اپلیکیشن‌ها کار می‌کند و می‌تواند با ترکیبی از دیگر کتابخانه‌ها یا فریم‌ورک‌های جاوا اسکریپت مانند Angular JS در MVC استفاده شود.

در دوره آموزش مقدماتی ری اکت جی اس شما به‌طور کامل با این کتابخانه مهم جاوا اسکریپت آشنا می‌شوید و از مزایای آن در ساخت اپلیکیشن‌ها و وب‌سایت‌ها بهره می‌برید. دوره آموزش React JS مقدماتی بر اساس جدیدترین ورژن این فریم‌ورک یعنی نسخه 16.14 تدریس شده است.

هدف از یادگیری دوره آموزش React JS مقدماتی چیست؟

از ری اکت جی اس به منظور مدیریت لایه نمایش برای اپلیکیشن‌های موبایل و وب استفاده می‌شود. React همچنین به شما این امکان را می‌دهد که مؤلفه‌های UI با قابلیت استفاده مجدد بسازید. مزایای React باعث شد که محبوبیت این فریم‌ورک افزایش پیدا کند و درصد زیادی از اپلیکیشن‌ها با استفاده از آن در فرانت‌اند نوشته شوند.

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

دوره آموزش React JS مقدماتی مناسب چه کسانی است؟

دوره آموزش React JS مقدماتی برای افراد زیر مناسب است:

  • کسانی که با HTML،CSS و جاوا اسکریپت آشنایی دارند و نسبت به ساخت یک صفحه وب علاقه‌مندند.
  • توسعه‌دهندگان بک‌اند مانند توسعه‌دهندگان C++، PHP، جاوا و غیره که به یادگیری مهارت‌های فرانت‌اند علاقه‌مندند.
  • کسانی که قصد دارند در این حوزه کاری فعالیت کنند.
  • کسانی که دوست دارند وب‌سایت شخصی خود را راه‌اندازی کنند.
  • و بسیاری از افراد دیگر

بعد از فراگیری دوره آموزش React JS مقدماتی چه مهارت‌هایی کسب خواهید کرد؟

در این دوره با فریم‌ورک ری اکت و تمام کارهایی که می‌توان با استفاده از آن انجام داد، آشنا می‌شوید. با مشاهده فیلم آموزش مقدماتی ری اکت مهارت‌های زیر را یاد خواهید گرفت:

  • کار با ری اکت جی اس و ساخت یک اپلیکیشن ساده
  • آشنایی با مفاهیم Virtual DOM و درک تفاوت آن با حالت معمولی
  • استفاده از فانکشن‌های جدید React با نام Hooks
  • طراحی یک اپلیکیشن فروشگاهی به همراه سبد خرید
  • کار با Local Storage
  • ساخت صفحات مختلف در وب‌سایت خود و Deploy آن در جاهای مختلف
  • استفاده از انیمیشن، عکس و آیکون در پروژه
  • کار با کتابخانه Create React App

سرفصل‌های دوره آموزش React JS مقدماتی چیست؟

در دوره آموزش مقدماتی React JS با این کتابخانه مهم آشنا می‌شوید و نحوه کار با آن را به‌خوبی فرامی‌گیرید. پس از آموزش اولیه مفاهیم نکات کاربردی برای استفاده از آن به شما آموزش داده می‌شود. در انتها برای این‌که بتوانید از محتواهای آموزشی این دوره بهره کافی را ببرید، پروژه‌هایی به شما داده می‌شود. این پروژه‌ها علاوه بر ارتقاء مهارت‌های شما رزومه‌تان را هم پربارتر می‌کند. 

ویژگی‌های متمایز دوره آموزش React JS مقدماتی مکتب‌خونه چیست؟

دوره آموزش مقدماتی پروژه محور ری اکت جی اس یک دوره کاربردی، جامع و پروژه محور است. در این دوره پروژه‌هایی برای شما تعریف شده که می‌توانید با انجام آن‌ها آموخته‌های خود را در این دوره به خاطر بسپارید و از آن‌ها در عمل استفاده کنید. ممکن است در طول دوره آموزش React JS مقدماتی یا در حین انجام پروژه‌ها سؤالات زیادی برایتان مطرح شود. در این صورت می‌توانید در تالار گفتگویی که برایتان ایجاد شده است با سایر دانشجویان این دوره و حتی استاد تبادل نظر کنید و راهنمایی بگیرید.

درباره استاد

maktabkhooneh-teacher احسان گازار

احسان گازار برنامه‌نویسی را از ۱۷ سالگی با QBasic شروع کرد و سپس زبان C و C++ را آموخت. از همان ابتدا علاقه‌ی زیادی به برنامه‌نویسی وب داشت. از همین رو چندین سایت برای سرگرمی با HTML، CSS و JavaScript طراحی کرد.

احسان گازار فارغ‌التحصیل مهندسی کامپیوتر، گرایش سخت‌افزار از دانشگاه خواجه‌نصیر است اما به دلیل علاقه زیاد او به برنامه‌نویسی وب، برنامه‌نویسی JavaScript را ادامه داد و تبدیل به Full Stack JavaScript Developer شد.

وی از سال 90 در ایران در شرکت‌های معتبری مانند نت برگ به‌عنوان Back End Developer فعالیت داشته و از سال 95 تا سال 98 در سیدنی استرالیا به‌عنوان Full Stack JavaScript Developer مشغول به کار بود و از سال 98 در ملبورن استرالیا به‌عنوان مهندس نرم‌افزار مشغول به کار است و درحال حاضر به عنوان مدیر تیم برنامه نویسی فعالیت می‌کند. ایشان همیشه به آموزش علاقه‌‌مند بوده و دوره‌های مختلفی در زمینه Front End و سایر موضوعات برنامه‌نویسی تدریس کرده است.

مشاهده پروفایل و دوره‌‌های استاد

نظرات کاربران  ( نظر)

صفحه 1 از
شقایق وزیری 1401-03-01
کاشکی استاد با توجه به توانایی بالایی که در تدریس دارند ... دوره پروژه محوری که پیشرفته تر باشد هم برگزار کنند. بیشتر دوره های مکتب خونه در حد آشنایی و دید کلی از مبحث هست.
محمدرضا علی آبادی 1400-08-19
دوره مقدماتی بسیار خوبیه مدرس مسلط و با تجربه و چیزهای کاربردی رو تدریس می کنند. مدرس کد شما رو که خوب برسی میکنه و اشکالات و نقات قوت شما رو خوب بیان میکنه که باعث میشه کد تمیز تری بنویسید. اما اسلاید نداره
مکتب‌خونه
همراه عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. استفاده از اسلاید در دوره های برنامه نویسی مرسوم نیست و عدم وجود اسلاید به همین دلیل است.
وحید قاسمی 1400-07-20
سلام استاد من از نوع تدریس شما خیلی خوشم اومده لطفا react-native رو هم آموزش بدید :) خیلی ممنون
مونا خاجوئی جهرمی 1400-03-01
این دوره با اختلاف زیاد بالاتر، بهتر و باکیفیت تر از تمام دوره های فارسی ریکت هست. ممنون از استاد عالی و کاربلد
حسین سیم چی 1402-01-17
سلام دوره ی بسیار خوب با نحوه بیان بسیار خوبی است و در ابندا باید سپاسگزار مجموعه مکتب خونه و استاد باشیم. ولی برخی نکات گفتنش خالی از لطف نیست : 1) دوره حالت مروری داره و بنظرم از صفر شروع نمیشه و شاید میشه گفت کسی که میخواد این دوره رو تهیه کنه باید پیش زمینه ای از ری اکت و JSX و ... داشته باشه. 2) خیلی زود بنظرم سر اصل مظلب رفتند که البته برای کسانی که میخوان مرور کنند خوبه. درنهایت با تشکر از همه عزیزان
محمد رحیم پورابراهیم 1400-12-29
این دوره برای کسانی که تجربه کار با فرانت رو ندارن خوبه، ساده و روان درس داده شده، دوستانی که میخوان این دوره رو تهیه کنن، من پیشنهاد می کنم قبلش یه مرور بر js داشته باشن
فاطمه لهراسبی 1400-10-09
به نظرم برای کسی که تو ری اکت صفره اصلا دوره ی مناسبی نیس، من برای مرور کردن ری اکت دارم میبینم و راضی ام
وحید وحید 1400-07-07
من این دوره را به پایان رساندم. از مزایای دوره باید بگم مدرس دوره واقعا حرفه ای است و کاملا مسلط بر مباحث است. در مورد معایب دوره هم باید بگم متاسفانه همین حرفه ای بودن مدرس باعث شده ایشون مباحث را خیلی سطحی بررسی کنند و تصور کنند دانشجو به خوبی ایشان مطالب را میداند .به نظر من این دور بیشتر یه مرور برای افرادی است که با ری اکت آشنایی دارند و نه کسانی که از صفر میخوان ری اکت را بیاموزند . من خودم مجبور شدم تمام مواردی که ایشون درس دادند را با به انگلیسی سرچ کنم و با توضیحات کامل از منابع دیگه آموزش ببینم .
مکتب‌خونه
همراه عزیز؛ از اینکه نظر خود را با ما در میان گذاشتید صمیمانه سپاسگزاریم. موارد مطرح شده جهت بررسی بیشتر به بخش مربوطه ارسال شد. در صورت نیاز به پیگیری بیشتر با شما در ارتباط خواهیم بود.

دوره‌های پیشنهادی

سوالات پرتکرار

آیا در صورت خرید دوره، گواهی نامه آن به من تعلق می گیرد؟
خیر؛ شما با خرید دوره می توانید در آن دوره شرکت کنید و به محتوای آن دسترسی خواهید داشت. در صورتی که در زمان تعیین شده دوره را با نمره قبولی بگذرانید، گواهی نامه دوره به نام شما صادر خواهد شد.

سوالات پرتکرار

حداقل و حداکثر زمانی که می توانم یک دوره را بگذرانم چقدر است؟
برای گذراندن دوره حداقل زمانی وجود ندارد و شما می توانید در هر زمانی که مایل هستید فعالیت های مربوطه را انجام دهید. برای هر دوره یک حداکثر زمان تعیین شده است که در صفحه معرفی دوره می توانید مشاهده کنید که از زمان خرید دوره توسط شما تنها در آن مدت شما از ویژگی های تصحیح پروژه ها توسط پشتیبان و دریافت گواهی نامه بهره مند خواهید بود.

سوالات پرتکرار

در صورت قبولی در دوره، آیا امکان دریافت نسخه فیزیکی گواهی نامه دوره را دارم؟
خیر، به دلیل مسائل زیست محیطی و کاهش قطع درختان، فقط نسخه الکترونیکی گواهی‌نامه در اختیار شما قرار می‌گیرد

سوالات پرتکرار

پس از سپری شدن زمان دوره، به محتوای دوره دسترسی خواهم داشت؟
بله؛ پس از سپری شدن مدت زمان دوره شما به محتوای دوره دسترسی خواهید داشت و می توانید از ویدئوها، تمارین، پروژه و دیگر محتوای دوره در صورت وجود استفاده کنید ولی امکان تصحیح تمارین توسط پشتیبان و دریافت گواهی نامه برای شما وجود نخواهد داشت.

ReactJS چیست؟

React.js یک چارچوب جاوا اسکریپت بخش فرانت‌اند به‌حساب می‌آید که توسط فیس‌بوک توسعه یافته است. برای ساختن رابط‌های کاربری قابل‌ترکیب به‌طور قابل پیش‌بینی و کارآمد با استفاده از کدهای اعلامی، از React استفاده می‌کنیم. این یک چارچوب منبع باز و مبتنی بر مؤلفه است که در روند توسعه مسئول ایجاد لایه نمایش برنامه خواهد بود. ReactJs از معماری Model View Controller (MVC) پیروی می‌کند و لایه view مسئول مدیریت برنامه‌های موبایل و وب است. React برای ساخت اپلیکیشن تک‌صفحه‌ای و اپلیکیشن موبایل فریمورکی مناسب به‌حساب می‌آید و دوره آموزش React JS مقدماتی مبنی بر این رویکرد تهیه و تدوین شده است.

تاریخچه ReactJS

ری اکت جی اس توسط فردی به نام جردن واک (Jordan Walke) ایجاد شد که این فرد به عنوان مهندس نرم‌افزار در فیس‌بوک کار می‌کرد، اولین نمونه اولیه React را به نام «FaxJS» منتشر کرد. در سال 2011، React ابتدا در فید خبری فیس‌بوک و سپس در سال 2012 در اینستاگرام به کار گرفته شد.

تفاوت بین ReactJS و React Native چیست؟

React که در سال 2013 توسط فیس‌بوک منتشر شد (همچنین با نام ReactJS شناخته می‌شود). ری اکت جی اس، کتابخانه‌ای به‌حساب می‌آید که برای برنامه‌های کاربردی وب طراحی شده است. این چارچوب برای ایجاد برنامه‌های کاربردی وب فیس‌بوک استفاده می‌شود. ReactJS به دلیل سادگی و ماهیت بیانی آن هم به رسمیت شناخته شده و هم محبوبیت زیادی پیدا کرده است. این کتاب‌خانه جاوا اسکریپت یکی از ۳ کتابخانه محبوب در کنار آنگولار و Vue.js برای توسعه سریع و مؤثر برنامه‌های وب محسوب می‌شود.

React Native از مکانیسم‌های ReactJS در راستای اصل «یک بار بیاموز، همه‌جا بنویس» استفاده می‌کند و تفاوت اصلی برنامه‌های آن در پلتفرم مورد استفاده است. همان‌طور که قبلاً اشاره کردیم، ReactJS روی برنامه‌های کاربردی وب تمرکز دارد، بنابراین باید از HTML، CSS و البته جاوا اسکریپت برای ساخت برنامه‌های وب با آن استفاده کرد. با این حال، به لطف React Native، می‌توانیم یک اپلیکیشن برای چندین پلتفرم به‌طور هم‌زمان بسازیم و این نقطه تمایز React Native با ReactJS به‌حساب می‌آید.

دلایل استفاده از فریمورک ری اکت جی اس چیست؟

دلایل مختلفی وجود دارد که چرا باید ReactJS را به عنوان ابزار اصلی برای توسعه UI وب‌سایت انتخاب کرد. در اینجا، ما برجسته‌ترین آن‌ها را مطرح می‌کنیم و توضیح می‌دهیم که چرا این ویژگی‌ها بسیار مهم هستند:

  • سریع: از طریق برنامه‌های ساخته شده در React می‌توان به‌روزرسانی‌های پیچیده را بسیار سریع مدیریت کرد.
  • مدولار: ری اکت جی اس به کاربران این امکان را می‌دهد که به جای نوشتن فایل‌های بزرگ و متراکم کد، بسیاری از فایل‌های کوچک‌تر و قابل استفاده مجدد بنویسید. ماژولار بودن React راه‌حلی جذاب برای مشکلات جاوا اسکریپت است.
  • مقیاس‌پذیر: React در مورد برنامه‌های بزرگی که تغییرات داده زیادی را نمایش می‌دهند، بهترین عملکرد را دارد.
  • انعطاف‌پذیر: با تقسیم کردن برنامه به اجزاء در حین ساخت رابط کاربری، رویکردهای React متفاوت است. این در برنامه‌های بزرگ بسیار امر مهمی به‌حساب می‌آید.
  • محبوب: ReactJS عملکرد بهتری نسبت به سایر فریمورک‌های جاوا اسکریپت به دلیل اجرای DOM مجازی ارائه می‌دهد و از این رو بسیار محبوب است.
  • یادگیری آسان: ازآنجایی‌که شروع کار با ری اکت جی اس به درک حداقلی از HTML و جاوا اسکریپت نیاز دارد در نتیجه یادگیری آن نسبتاً آسان است.
  • رندر سمت سرور و مناسب برای سئو: وب‌سایت‌های ReactJS به دلیل ویژگی رندر سمت سرور معروف هستند. این برنامه‌ها را در مقایسه با محصولات دارای رندر سمت مشتری برای رتبه‌بندی موتورهای جستجو سریع‌تر و بسیار بهتر می‌کند. React حتی فرصت‌های بیشتری برای سئوی وب‌سایت ایجاد می‌کند و می‌تواند موقعیت‌های بالاتری را در صفحه نتایج جستجو اشغال کند.
  • اجزای UI قابل استفاده مجدد: React فرآیندهای توسعه و اشکال‌زدایی را بهبود می‌بخشد.
  • انجمن: تعداد انجمن‌های پشتیبانی، ابزارها و افزونه‌های موجود برای توسعه‌دهندگان ReactJS بسیار زیاد است. 

دلایل بالا دلیل محبوبیت ReactJS نسبت به سایر فریمورک‌ها را توجیه می‌کند و همین امر مکتب خونه را مجاب کرده است دوره آموزش React JS مقدماتی را برای شروع کار با این فریمورک در دسترس کاربران قرار دهد.

ویژگی‌های ReactJS

ری اکت جی اس ویژگی‌های منحصربه‌فردی دارد که آن را از سایر رقبا و فریمورک‌های دیگر جدا می‌کند که در ادامه به آن‌ها خواهیم پرداخت. در دوره آموزش React JS مقدماتی ما با ویژگی‌های این فریمورک در عمل آشنا خواهیم شد.

1. JSX - پسوند نحوی جاوا اسکریپت

JSX یک انتخاب ارجح برای بسیاری از توسعه‌دهندگان وب است. استفاده از JSX در توسعه React ضروری نیست، اما تفاوت زیادی بین نوشتن اسناد React.js در JSX و JavaScript وجود دارد. JSX یک پسوند نحوی برای جاوا اسکریپت است. با استفاده از آن، می‌توانیم ساختارهای HTML را در همان فایلی که حاوی کد جاوا اسکریپت است بنویسیم.

2. جریان داده یک طرفه

React.js طوری طراحی شده است که فقط از داده‌هایی پشتیبانی می‌کند که در یک جهت در پایین دست جریان دارند. اگر داده‌ها در جهت دیگری جریان داشته باشند، به ویژگی‌های اضافی نیاز خواهید داشت. React شامل مجموعه‌ای از مقادیر تغییرناپذیر است که به عنوان ویژگی در تگ‌های HTML به رندر مؤلفه ارسال می‌شود. مؤلفه‌ها نمی‌توانند هیچ ویژگی را مستقیماً تغییر دهند، اما از یک تابع تماس برای انجام تغییرات پشتیبانی می‌کنند.

3. مدل شیء سند مجازی (VDOM)

React حاوی یک نمایش سبک از DOM واقعی در حافظه به نام Virtual DOM است. دست‌کاری DOM واقعی در مقایسه با VDOM بسیار کندتر است زیرا چیزی روی صفحه‌نمایش داده نمی‌شود. هنگامی که وضعیت هر شیء تغییر می‌کند، VDOM به جای به‌روزرسانی کل اشیاء، فقط آن شی را در DOM واقعی تغییر می‌دهد. این باعث می‌شود کارها سریع پیش بروند، این ویژگی به‌ویژه در مقایسه با سایر فناوری‌های فرانت‌اند که باید هر شی را به‌روزرسانی کنند، حتی اگر تنها یک شی در برنامه وب تغییر کند، بسیار تفاوت ایجاد می‌کند.

4. افزونه‌های گوناگون

React از پسوندهای مختلف برای معماری اپلیکیشن پشتیبانی می‌کند. این برنامه از رندر سمت سرور، Flux و Redux به‌طور گسترده در توسعه برنامه‌های وب پشتیبانی می‌کند. React Native یک فریمورک محبوب به‌حساب می‌آید که از React برای ایجاد برنامه‌های موبایلی سازگار متقابل توسعه یافته است.

5. اشکال‌زدایی

آزمایش برنامه‌های React به دلیل پشتیبانی گسترده جامعه آسان است. حتی فیس‌بوک یک افزونه مرورگر کوچک ارائه می‌کند که اشکال‌زدایی React را آسان‌تر و سریع‌تر می‌کند.

برخی از مفاهیم اساسی در ری اکت جی اس

در کتابخانه ری اکت جی اس مفاهیم و اصطلاحات مختلفی وجود دارند که در دوره آموزش React JS مقدماتی به همه آن‌ها پرداخته شده است ولی با این حال ذکر آن‌ها در اینجا هم خالی از لطف نخواهد بود.

1. کامپوننت در ReactJS

کامپوننت‎‎‎ها (به اجزا نیز نام برده می‌شوند) قلب و روح React هستند. کامپوننتها (مانند توابع جاوا اسکریپت) به شما این امکان را می‌دهند که رابط کاربری را به قطعات مستقل و قابل استفاده مجدد تقسیم کنید و در مورد هر قطعه به صورت مجزا تصمیم بگیرید. کامپوننتها بلوک‌های سازنده هر برنامه React هستند. هر مؤلفه ساختارها، API ها و روش‌های خود را دارد. در React دو نوع کامپوننت وجود دارد که عبارت‌اند از حالت تابعی و کلاس حالت که نحوه استفاده کامپوننتهای تابعی و کلاسی در دوره آموزش مقدماتی ری اکت جی اس بیان شده است.

  • اجزای تابعی یا عملکردی - این کامپوننت ها هیچ حالتی ندارند و فقط شامل استفاده از متد رندر هستند. آن‌ها به سادگی توابع زبان برنامه‌نویسی جاوا اسکریپت بوده و ممکن است داده‌ها را به عنوان پارامتر دریافت کنند.
  • اجزای کلاس - این اجزا پیچیده‌تر از اجزای عملکردی هستند. آن‌ها می‌توانند وضعیت خود را مدیریت کنند و برای برگرداندن JSX روی صفحه یک روش رندر جداگانه دارند. شما می‌توانید داده‌ها را از یک کلاس به اجزای کلاس دیگر منتقل کنید.

2. React State

وضعیت در ری اکت مکانی است که داده‌ها ازآنجا می‌آیند. وضعیت در یک جزء می‌تواند در طول زمان تغییر کند و هر زمان که تغییر کرد، مؤلفه دوباره رندر می‌شود. تغییر در یک حالت می‌تواند به عنوان پاسخی به رویدادهای تولید شده توسط سیستم یا عملکرد کاربر اتفاق بیفتد و این تغییرات رفتار جزء و نحوه نمایش آن را مشخص می‌کند.

3. React Props

Props به معنی خواص است و اجزای فقط خواندنی هستند. هر دو Props و State اشیاء جاوا اسکریپت ساده به‌حساب می‌آیند و داده‌هایی را نگه می‌دارند  که بر خروجی رندر تأثیر می‌گذارند. این دو از یک جهت متفاوت هستند: State در داخل کامپوننت مدیریت می‌شود (مانند اعلان متغیر در یک تابع)، در حالی که props به کامپوننت منتقل می‌شود (مانند پارامترهای تابع).

4. React Keys

در React، کلیدها هنگام کار با اجزای ایجاد شده به صورت پویا تعریف می‌شوند. تنظیم مقدار کلید باعث می‌شود که پس از تغییر، کامپوننت شما به‌طور منحصربه‌فرد شناسایی شود. آن‌ها به React در شناسایی مواردی که تغییر، حذف یا اضافه شده‌اند کمک می‌کنند. به‌طور خلاصه، State، Props، کلیدها و کامپوننت‌ها مهمترین مفاهیم اساسی React هستند که قبل از کار روی آن باید با آن‌ها آشنا شوید.

مزایای ReactJS

به خودی خود ری اکت جی اس مزایای بسیار زیادی را ارائه می‌دهد که از مهم‌ترین آن‌ها می‌توان به موارد زیر اشاره کرد:

  • ری اکت جی اس DOM مجازی خود را ایجاد می‌کند. این کار عملکرد برنامه‌ها را بهبود می‌بخشد زیرا DOM مجازی جاوا اسکریپت سریع‌تر از DOM معمولی است.
  • ReactJS به ایجاد رابط کاربری عالی کمک می‌کند.
  • ReactJS برای سئو بسیار مناسب است.
  • ری اکت جی اس الگوهای مؤلفه و داده خوانایی را بهبود می‌بخشد که به حفظ برنامه‌های بزرگتر کمک می‌کند.
  • React را می‌توان با سایر فریمورک‌ها استفاده کرد.
  • React فرآیند کامل محیط اسکریپت را ساده می‌کند.
  • این فریمورک تعمیر و نگهداری برنامه را تسهیل می‌کند و بهره‌وری را افزایش می‌دهد.
  • ری اکت جی اس رندر سریع‌تر را تضمین می‌کند.
  • یک جامعه قوی از ReactJS حمایت می‌کند.
  • React JS با یک مجموعه ابزار توسعه‌دهنده مفید ارائه می‌شود.
  • و بسیاری از مزایای مختلف دیگر که در دوره آموزش React JS مقدماتی با برخی از آن‌ها آشنا خواهیم شد.

آیا React ارزش یادگیری دارد؟

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

سخن پایانی

با توجه به مطالبی که ارائه شد و با توجه به تحقیقاتی که انجام شده است، امروزه محبوبیت ری اکت از سایر فریمورک‌های دیگر جاوا اسکریپت بیشتر بوده و تقاضا برای متخصصین این زمینه نیز روزبه‌روز در حال افزایش است. ویژگی‌ها، مزایا، بازار کار فرصت‌های شغلی که React JS در اختیار کاربران قرار می‌دهد ما را مجاب به یادگیری آن می‌کند و چشم‌انداز این فریمورک برای آینده نیز همچنان روشن و پر بار است. اگر قصد ورود به دنیای ری اکت جی اس را دارید و قصد کامل کردن مهارت‌های توسعه‌ وب، توسعه اپلیکیشن و همچنین مهارت‌های جاوا اسکریپتی خود را دارید، هم‌اکنون با ثبت‌نام در دوره آموزش React JS مقدماتی اولین و مهمترین قدم در این زمینه را بردارید و نحوه استفاده از React جهت پیاده‌سازی پروژه‌های React شخصی و کاری را یاد بگیرید. این دوره یکی از بهترین دوره‌های آموزشی ری اکت جی اس در وب فارسی است.

React ری اکت برای برنامه نویسان وب به خصوص فعالان بخش فرانت‌اند از کتاب‌خانه‌های بسیار ضروری به‌حساب می‌آید و گذر از آن به معنی از دست دادن فرصت‌های شغلی زیادی است. همچنین اگر به فکر یادگیری جاوا اسکریپت هستید، می‌توانید از دوره‌های آموزش برنامه‌نویسی جاوا اسکریپت مکتب خونه به عنوان پیش‌نیاز یادگیری ری اکت استفاده کنید. این دوره‌ها گام‌به‌گام توسعه وب را به شما یاد می‌دهند.

poster
  
برگزار کننده:  مکتب‌خونه
  
زمان مورد نیاز برای گذارندن دوره:  26 ساعت
مجموع محتوای آموزشی:  9 ساعت ویدئو - 17 ساعت تمرین و پروژه
 (قابل دانلود می‌باشد)
مهلت دوره:  4 هفته
  
حد نصاب قبولی در دوره:  70 نمره
فارغ‌التحصیل شدن در این دوره نیاز به ارسال تمرین‌ها و پروژه‌های الزامی دارد. 
organization-pic  گواهینامه این دوره توسط مکتب‌خونه ارائه می‌شود.
course-feature   گواهی‌نامه مکتب‌خونه course-feature   خدمات منتورینگ course-feature   پروژه محور course-feature   تمرین و آزمون course-feature   تالار گفتگو course-feature   تسهیل استخدام