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

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

دوره‌های مکتب‌پلاس
26 ساعت

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

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

این فریم‌ورک تنها روی رابط‌های کاربری در اپلیکیشن‌ها کار می‌کند و می‌تواند با ترکیبی از دیگر کتابخانه‌ها یا فریم‌ورک‌های جاوا اسکریپت مانند Angular JS در MVC استفاده شود.

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

 

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

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

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

 

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

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

 

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

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

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

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

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

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

ابزار‌ها و محیط برنامه‌نویسی با React
"04:45
آشنایی با مفاهیم React و تفاوت آن با سایر کتابخانه‌ها
"06:48
JSX چیست و چطور از Babel استفاده کنیم
"04:59
کامپوننت چیست و اولین کامپوننت (React Component)
"05:07
کوییز - فصل اول
100.0%
     
"03:00
فصل دوم: معرفی 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%
     
'05:00

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

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

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

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

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

اطلاعات بیشتر

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

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

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

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

Combined Shape1 Created with Sketch. گواهی‌نامه مکتب‌خونه

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

 

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

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

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

پروژه محور

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

تمرین و آزمون

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

تالار گفتگو

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

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

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

 

مشاهده اطلاعات بیشتر

نظرات  (1 نظر)

مونا
10:50 - 1400/03/01
دانشجوی دوره
این دوره با اختلاف زیاد بالاتر، بهتر و باکیفیت تر از تمام دوره های فارسی ریکت هست. ممنون از استاد عالی و کاربلد

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

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

اطلاعات بیشتر

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

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

 

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

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

ممکن است در طول دوره یا در حین انجام پروژه‌ها سؤالات زیادی برایتان مطرح شود. در این صورت می‌توانید در تالار گفتگویی که برایتان ایجاد شده‌است با سایر دانشجویان این دوره و حتی استاد تبادل نظر کنید و راهنمایی بگیرید.

×

ثبت نظر

به این دوره از ۱ تا ۵ چه امتیازی می‌دهید؟

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

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

ابزار‌ها و محیط برنامه‌نویسی با React
"04:45
آشنایی با مفاهیم React و تفاوت آن با سایر کتابخانه‌ها
"06:48
JSX چیست و چطور از Babel استفاده کنیم
"04:59
کامپوننت چیست و اولین کامپوننت (React Component)
"05:07
کوییز - فصل اول
100.0%
     
"03:00
فصل دوم: معرفی 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%
نمایش جلسات فصل  

به صورت کلی 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