توضیحات

ری اکت (React.js) یک کتابخانه جاوااسکریپتی برای ساخت رابط کاربری(user interfaces) برای اپلیکیشن های تک صفحه ای (single page applications) هست که در سال ۲۰۱۳ توسط تیم توسعه فیسبوک ساخته شده است. بخش اصلی در React کامپوننت‌ها هستند. یک کامپوننت ترکیبی از HTML و javascript است و تمام منطق مورد نیاز برای نمایش قسمت کوچکی از یک رابط کاربری بزرگ‌ تر را در خود دارد. هر کدام از این کامپوننت‌ها می‌توانند به بخش‌های پیچیده‌تر یک اپلیکیشن اضافه شوند. همچنین React این امکان رو در اختیار ما قرار میدهد که کامپوننت‌های قابل استفاده مجدد (reusable UI components) رابط کاربری ایجاد کنیم. توی این دوره به آموزش پروژه محور react ورژن 17 و 18 (در ورژن 18 چیزی تغییر نکرده و شما این دوره را میتوانید با ورژن 18 ری اکت مشاهده کنید همچنین در بخش انتهای دوره درمورد ورژن 18 صحبت کردیم) به همراه hook ها، react router و redux میپردازیم.که 3 پروژه توی این دوره ایجاد میشه شامل پروژه spa(single page application) ، پروژه مدیریت Todo با useRducer و useContext و همچنین پروژه سبد خرید با redux

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

همچنین دوره ای نکست جی اس (next.js) هم توی وبسایت قرار گرفت که پیشنهاد میکنم حتما بعد از این دوره مشاهده کنید.

مباحثی که در این دوره گفته میشود شامل :
آشنایی با react.js

  • react چیست
  • ایجاد پروژه react
  • توضیح ساختار پروژه react
  • توضیح و ایجاد کامپوننت 

آشنایی با JSX

  • معرفی jsx
  • قوانین jsx
  • جاوااسکریپت در jsx

style در react

  • افزودن فایل css
  • افزودن فایل sass
  • inline style
  • افزودن فریمورک bootstrap
  • افزودن react-bootstrap

Event & Prop

  • توضیح event در react
  • توضیح prop در react

کار با form

  • input & textarea
  • selectbox
  • checkbox & radio

آشنایی با هوک useState 

  • آشنایی با useState
  • object و array در useState

آشنایی با هوک useEffect 

  • آشنایی با useEffect
  • اجرای useEffect بصورت شرطی و همچنین یکبار
  • cleanup
  • دریافت دیتا از api با useEffect

آشنایی با هوک useContext

  • context چیست
  • آشنایی با useContext

آشنایی با هوک useReducer

  • آشنایی با useReducer
  • useReducer + useContext

آشنایی با useCallback & useMemo & React.memo و custom hook

آشنایی با react-router

  • توضیح spa (single page application)
  • Link & NavLink
  • useParams
  • useLocation
  • useHistory
  • nested routing
  • useRouteMatch

ایجاد پروژه spa (single page application) 

ایجاد پروژه مدیریت Todo با useReducer و useContext

آشنایی با redux

  • action & reducer & store
  • combineReducer
  • redux thunk

آشنایی با react-redux

  • action & reducer & storer
  • connect
  • useSelector & useDispatch
  • redux devtools
  • redux thunk

ایجاد پروژه سبد خرید با redux

ری اکت ورژن 18

  • آشنایی با ویژگی های ورژن 18
  • suspense در ری اکت
  • concurrent در ری اکت

دوره های پیشنهادی، بعد از گذراندن این دوره :

پیش نیاز این دوره :


javascript جاوااسکریپت react ری اکت

مدرس دوره علی شیخ
مدت دوره 16:08:35
تعداد ویدیو 106

وضعیت دوره : کامل شده
قیمت دوره : 399,000 379,000 تومان
% 5 تخفیف

نظرات ارزشمند شما:

برای ارسال نظر ابتدا باید وارد سایت شوید

  • علی جان من بسیار لذت بردم از دوره ی nextjs چرا که مطابق آخرین مستندات این فریم ورک دوره مرحله به مرحله ضبط شده، آیا دوره ی ری اکت هم مطابق مستندات ری اکت مرحله به مرحله ضبط شده؟

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

  • سلام آیا در دوره در خصوص React Server Components که در ری اکت 18 معرفی شده هم توضیح داده شده؟! چون من از نکست جی اس استفاده میکنم نکست 13 و 14 از React Server Components همونطور که میدونید استفاده میکنه، برای همین من میخوام بدونم اگر React Server Components آموزش داده شده، این آموزش رو تهیه کنم.

    لطفا اگر در این خصوص در این دوره مطلبی هست بگید در کدوم بخش آموزش داده شده ممنون

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

  • سلام خیلی ممنون از آموزش های خوبتون، یک سوالی داشتم چطور می تونم از ریکت و وردپرس برای طراحی سایت استفاده کنم؟ آیا آموزشی در این زمینه است؟ و مشکلی در زمینه سئو برای سایت نداره؟

  • سلام آقای شیخ
    من ری اکت بلدم اما میخواستم از آموزش ریداکس شما استفاده کنم
    امکانش هست فقط هزینه ی بخش های ریداکس رو بپردازم و فقط اون قسمتها در دسترسم باشه؟

    • سلام وقت بخیر.
      خیلی عذر خواهی میکنم، متاسفانه امکان خرید بصورت بخشی از دوره نیست

  • سلام استاد من دارم می خوام یک سایت با لاراول و ریکت بسازم می خواستم بدونم که برای اینکه این سایت به صورت spa باشه باید حتما از روتر های ریکت استفاده کنم یا از روتر های لاراول هم میشه استفاده کرد؟

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

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

  • درود به شما استاد.
    نقدی تا اینجا که دنبالتون میکنم به شما وارد نیست و همش عالی بودید . خسته نباشید.

    سوالی که دارم اینه:
    آینده ریکت و ویو رو چطور میبینید و کدوم رو در آینده دور موفق تر میدونید.

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

  • من یه سوال دارم. اونم اینکه. من نتونستم دوره Asynchronous رو پیش ببرم. چون اکستن شن live server کار نکرد. الان میتونم این دوره رو ببینم ؟ و آیا اگه این دوره رو ببینم. مثلا میتونم یه سایت بزنم ؟ منظورم یه سایته فروشگاهی. ممنون میشم جواب بدین و واقعا خسته نباشین. همه دوره هاتون حرف نداشتن. موفق باشین

    • سلام وقت بخیر.
      ممنون از شما و حمایتتون?
      خداروشکر دوره ها براتون مفید بوده
      اکستنشن که نباید مشکلی باشه و آخرین ورژن vscode را نصب و تست کنید، شاید پورتی که استفاده میکنه روی سیستم شما بسته هست.
      اما با دیدن دوره و درکش میتونید وارد این دوره بشید و در خصوص ساخت پروژه پیشنهاد من اینکه بعد از دوره react با فریمورکش یعنی next.js آشنا بشید که دوره اش توی سایت هست و یک فروشگاه اینترنتی کامل هم توی دوره ساخت فروشگاه اینترنتی با next.js ایجاد کردیم که اونم دوره اش توی سایت هست.

    • سلام وقت بخیر.
      ممنون از ارسال نظرتون?
      توی ویدیو معرفی و توضیحات دوره گفته شده که چه مواردی توی دوره درموردش صحبت میشه

  • سلام وقت بخیر استاد من چندتا دوره از html تا react.js تو سایت شما دنبال کردم خیلی عالی بود خسته نباشید
    حقیقتش من تصمیم گرفتم با چیزای که یاد گرفتم یه نمونه سایت درست کنم که در مرحله اخر تو گیت هاپ بزارم ، رزومه باشه
    شما میتونید لطف کنید با وجود آموزشای خودتون یه راهنمایی به من بکنید؟؟؟

    • سلام وقت بخیر.
      همین پروژه های انتهای دوره ها را میتوانید قرار بدید و همچنین بهشون شاخ و برگ بدید برای تمرین بیشتر یا سایتی که مدنظرتون هست را پیاده سازی کنید.

  • سلام استاد شیخ خسته نباشید سوالی داشتم در مورد React که چگونه می شود فرانت اند را با react بنویسیم و بک اند را با php و زمانی که بخواهیم تگ های نوشته شده در ریکت با php ترکیب کنیم و نشان دهیم چگونه می شود چون کل فایل ها جاوااسکریپت هستند ما در ریکت فقط می توانیم به وسیله ی api و تک های فرم با php ارتباط برقرار کنیم ممنون میشوم راهنمایی ام کنید

    • سلام وقت بخیر.
      فریمورک های مانند react مناسب برنامه های spa هست. اگه اصرار به استفاده از کد js توی فایل php دارید یا باید از خوده js و یا jquery و یا بهتر از همه از فریمورک alpine.js استفاده کنید که دوره اش توی سایت هم هست.

  • سلام استاد. نقشه ای که گذاشته بودید خیلی دقیق و عالی بود. من منتظرم آخر ماه بشه یکم بودجه بیاد تا اینا رو بخرم. خواهشمندیم تخفیفات رو بیشتر کنید. فقط یک سوال چرا تو نقشه بعد از جاوا اسکریپت و jquery اسمی از کتابخونه های خوبی مثل react یا vue js نبردید؟

    • سلام وقت بخیر.
      ممنون از شما، انشاا... در آینده تغییرات اعمال میشه
      اما در کل مسیر اصلی هست و بعد شاخه ها جدا میشه

  • سلام وقت بخیر آیا در این دوره فایل های پروژه هایی که میزنید هم در اختیار ما قرار میدهید یا باید مثل دوره جاوا اسکریپت خودمون خط به خط ایجاد کنیم ؟

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

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

  • سلام و عرض ادب استاد
    خداقوت
    جسارتا یه سوال تقریبا خارج از بحث این پست داشتم
    بنده روی یه سیستمی که امکان آپدیت ویندوز نداره میخوام node رو نصب کنم اما متاسفانه نسخه جدید Node رو اجازه نصب نمیده ویندوز (ویندوز 7 هستش)
    بعد از سرچ های مختلف نسخه قابل نصب رو پیدا کردم که 13.6 هستش و نصب رو انجام دادم. اما حالا که میخوام یه پروژه ریکتی رو بالا بیارم، با ارور جدیدی روبرو شدم با مضمون زیر:
    create-react-app need node v14 or higher
    خواستم بدونم راه حلی رو میتونید پیشنهاد بدید لطفا؟
    هم خیلی نیاز دارم به انجامش؛ هم اینکه امکان بروزرسانی ویندوز نیستش متاسفانه!

    • سلام وقت بخیر.
      شما باید نسخه ای از create-react-app را نصب و استفاده کنید که با ورژن node شما اوکی باشه

    • سلام وقت بخیر.
      ممنون که پرسیدید?
      اما دوره به ازای هر شخص هست و اگه توان مالیش ندارید، میتوانید با هم ببینید و بعدا تهییه کنید.

  • سلام استاد خسته نباشید من در create-react-app مشکل پیدا کردم . هر کاری میکنم هر کدی میزنم درست نمیشه از npx هم استاده کردم . npm start میزنم هم درست نمیشه.لطفا کمک کنید.

    • سلام وقت بخیر.
      ارور چی دریافت میکنید؟
      لطف کنید دوره ها را از سایت تهیه کنید، میدونم باورش سخته ولی واقعا زحمت کشیده شده برای دوره ها و ما راضی نیستیم.

  • سلام وقتتون بخیر
    تشکر بابت همه دوره های مفید و عالی که در سایت قرار میگیره.
    لطفا دوره reactNative را هم اموزشش رو در سایت بزارین .
    ممنون.

    • سلام وقت بخیر.
      ممنون از شما، با توجه به اینکه فلاتر هست، خیلی کمتر شده استفاده از react native

  • سلام
    خداقوت
    استاد من واقعا اندکی راهم رو گم کردم متاسفانه! :(
    بنده دوره های html,css,javascript,asynchronous,OOP رو دیدم و آماده یادگیری ریکت هستم
    منتها مسئله ای که ذهنم رو درگیر کرده کاربرد ریکت هستش که آیا فقط برای استفاده از api ریکت رو پیاده سازی میکنیم؟!
    ینی در واقع مثلا بخوایم اطلاعات رو در صفحات مختلف سایتمون نمایش بدیم باید حتما از api اطلاعات رو دریافت کنیم و نمیشه بصورت لوکال از سیستم شخصی بعنوان مثال دیتاهایی رو در صفحات سایت قرار داد؟ (امیدوارم تونسته باشم منظور سوالم رو برسونم -_-)
    آیا اصلا سایتی با ریکت و بدون استفاده از api کدنویسی میشه؟!
    این سوالات رو یه مقدار من رو برای تصمیم گیری متاسفانه گمراه کرده که میخوام قبل شروع دوره راهم رو پیدا کنم :/

    • سلام وقت بخیر.
      ببینید react برای پروژه های spa مناسب هست، ویدیو معرفی و قسمت های رایگان ابتدای دوره را ببینید توضیح دادیم. یا همون صفحاتی که از api استفاده میکنند و شما میفرمایید مناسب هست، در غیر اینصورت شما اگه توی پروژه برای بعضی از صفحات نیاز به js دارید میتوانید از فریمورک alpine که دوره اش توی سایت هست و یا js خام استفاده کنید.