00:00 / 00:00
1.8x
1.4x
1.0x
0.7x
HD SD
HD
SD
ثبت‌نام رایگان
  • دسترسی به 13 جلسه نمونه از دوره
  • دسترسی به 13 جلسه نمونه از دوره
  • عضویت در تالار گفت‌وگوی دوره
  • اضافه شدن دوره به پروفایل
فقط محتوا
  • دسترسی کامل و نامحدود به محتوای دوره
  • تمام قابلیت‌‌های پلن رایگان
    +
  • دسترسی کامل و نامحدود به محتوای دوره
529,000 تومان
امکان پرداخت ارزی ‎
دوره کامل
  • دسترسی به تمام قابلیت‌های دوره
  • تمام قابلیت‌های پلن محتوا
    +
  • گواهی‌نامه مکتب‌خونه
  • پروژه محور
  • تمرین و آزمون
  • تالار گفتگو
  • تسهیل استخدام
649,000 تومان
امکان پرداخت ارزی ‎
00:00 / 00:00
1.8x
1.4x
1.0x
0.7x
HD SD
HD
SD
مکتب‌خونه مکتب‌خونه

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

دوره‌های مکتب‌پلاس
26 ساعت
90٪ (636 رای)
آنچه در این دوره می‌آموزیم:

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

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

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

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

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 مقدماتی یا در حین انجام پروژه‌ها سؤالات زیادی برایتان مطرح شود. در این صورت می‌توانید در تالار گفتگویی که برایتان ایجاد شده است با سایر دانشجویان این دوره و حتی استاد تبادل نظر کنید و راهنمایی بگیرید.

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

  • نسخه   1.0   - 1400/02/۲۱ انتشار اولیه
  • نسخه   1.1   - 1401/04/۲۵ فصل اول آپدیت شد و فصل دهم به دوره اضافه شد.

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

فصل اول: React چیست و معرفی ویژگی‌های آن
00:28 ساعت
00:25
Combined Shape Created with Sketch. 6 جلسه
بارم:
1%
نمایش جلسات فصل  

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

ابزار‌ها و محیط برنامه‌نویسی با React
"04:45
آشنایی با مفاهیم React و تفاوت آن با سایر کتابخانه‌ها
"06:48
JSX چیست و چطور از Babel استفاده کنیم
"04:59
کامپوننت چیست و اولین کامپوننت (React Component)
"05:07
کوییز - فصل اول
100.0%
     
"03:00
چطور دوره را بگذرانیم و از محتوای آموزشی React مقدماتی استفاده کنیم؟
"03:24
فصل دوم: معرفی Create React App و ویژگی‌هان آن
04:23 ساعت
01:20
Combined Shape Created with Sketch. 10 جلسه
بارم:
18%
نمایش جلسات فصل  
فصل سوم: نکات در مورد Life Cycle ها در React
00:32 ساعت
00:29
Combined Shape Created with Sketch. 4 جلسه
بارم:
1%
نمایش جلسات فصل  

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

نوشتن یک کامپوننت به روش قدیمی و به صورت Class
"09:48
مفهوم Life Cycle در React چیست؟‌
"10:58
data در کامپوننت و قرار دادن در State
"08:24
کوییز - فصل سوم
100.0%
     
"03:00
فصل چهارم: آموزش React Hookها
04:24 ساعت
01:21
Combined Shape Created with Sketch. 11 جلسه
بارم:
15%
نمایش جلسات فصل  
فصل پنجم: ویژگی‌های بیشتر برای Animation و Validation
03:36 ساعت
00:33
Combined Shape Created with Sketch. 7 جلسه
بارم:
16%
نمایش جلسات فصل  
فصل ششم: چگونگی Deploy کردن
00:12 ساعت
00:12
Combined Shape Created with Sketch. 3 جلسه
بارم:
0%
نمایش جلسات فصل  

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

آموزش React Devtool
"04:06
آماده‌سازی پروژه Create React App برای محیط Production
"04:04
چطور با Now JS پروژه‌ی خود را در Deploy کنیم
"04:49
فصل هفتم: نکات اضافی و سوالات متداول در React
04:29 ساعت
01:26
Combined Shape Created with Sketch. 12 جلسه
بارم:
15%
نمایش جلسات فصل  
فصل هشتم: برنامه‌نویسی تکلیف دوره و پروژه Todo
01:33 ساعت
01:33
Combined Shape Created with Sketch. 7 جلسه
بارم:
0%
نمایش جلسات فصل  

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

شروع پروژه، نصب پیش‌نیاز ها و ساختن ساختار پروژه
"08:14
برنامه‌نویسی استایل‌های اولیه و ساختار کامپوننت‌ها
"20:57
استایل دادن بیشتر و آماده‌سازی پروژه و آشنایی با BEM
"18:17
فانکشن‌های AddTask, DeleteTask
"17:19
Filtering و تغییر وضعیت تسک‌ها
"16:39
پیاده‌سازی localStorage و Persistence برای پروژه و Deploy کردن آن
"12:04
سورس کد پروژه Todo
فصل نهم: برنامه‌نویسی تکلیف دوره و پروژه وب‌سایت شخصی برای رزومه با Figma
06:23 ساعت
01:20
Combined Shape Created with Sketch. 10 جلسه
بارم:
31%
نمایش جلسات فصل  

پروژه فصل آخر دوره ری اکت مقدماتی به طراحی یک وب‌سایت شخصی برای رزومه با 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
سورس کد پروژه وب‌سایت شخصی
کوییز - فصل نهم
4.8%
     
"03:00
پروژه نهایی: ساخت یک App نظرسنجی

 (الزامی)

95.2%
     
"300:00
فصل دهم: ویژگی‌های جدید React JS 18
00:20 ساعت
00:20
Combined Shape Created with Sketch. 2 جلسه
بارم:
0%
نمایش جلسات فصل  

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

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

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

استاد دوره
احسان گازار احسان گازار

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

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

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

اطلاعات بیشتر
درباره گواهینامه
مکتب‌خونه مکتب‌خونه
حد نصاب قبولی در دوره:
70.0 نمره
فارغ‌التحصیل شدن در این دوره نیاز به ارسال تمرین‌ها و پروژه‌های الزامی دارد.

پیش‌نیاز‌های دوره آموزش React JS مقدماتی

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

  • آموزش HTML و CSS
  • آموزش جاوا اسکریپت
آموزش HTML و CSS
اطلاعات بیشتر
آموزش جاوا اسکریپت (JavaScript)
اطلاعات بیشتر

ویژگی‌های دوره آموزش React JS مقدماتی

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

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

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

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

پروژه محور

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

تمرین و آزمون

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

تالار گفتگو

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

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

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

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

نظرات  (8 نظر)

حسین
12:06 - 1402/01/17
دانشجوی دوره
سلام دوره ی بسیار خوب با نحوه بیان بسیار خوبی است و در ابندا باید سپاسگزار مجموعه مکتب خونه و استاد باشیم. ولی برخی نکات گفتنش خالی از لطف نیست : 1) دوره حالت مروری داره و بنظرم از صفر شروع نمیشه و شاید میشه گفت کسی که میخواد این دوره رو تهیه کنه باید پیش زمینه ای از ری اکت و JSX و ... داشته باشه. 2) خیلی زود بنظرم سر اصل مظلب رفتند که البته برای کسانی که میخوان مرور کنند خوبه. درنهایت با تشکر از همه عزیزان
شقایق
14:01 - 1401/03/01
دانشجوی دوره
کاشکی استاد با توجه به توانایی بالایی که در تدریس دارند ... دوره پروژه محوری که پیشرفته تر باشد هم برگزار کنند. بیشتر دوره های مکتب خونه در حد آشنایی و دید کلی از مبحث هست.
محمد رحیم
16:21 - 1400/12/29
دانشجوی دوره
این دوره برای کسانی که تجربه کار با فرانت رو ندارن خوبه، ساده و روان درس داده شده، دوستانی که میخوان این دوره رو تهیه کنن، من پیشنهاد می کنم قبلش یه مرور بر js داشته باشن
فاطمه
12:20 - 1400/10/09
دانشجوی دوره
به نظرم برای کسی که تو ری اکت صفره اصلا دوره ی مناسبی نیس، من برای مرور کردن ری اکت دارم میبینم و راضی ام
محمدرضا
22:44 - 1400/08/19
فارغ‌التحصیل دوره