متخصص React (ری اکت دولوپر)

متخصص React

محبوب‌ترین کتابخانه جاوااسکریپت
پشتیبانی در جامعه برنامه‌نویسی
مجتبی سوری
مدرس: مجتبی سوری مدیر تیم فنی در اسنپ فود
متخصص React (ری اکت دولوپر) متخصص React به جامعه متخصصین سون‌لرن بپیوندید...

آشنایی با دوره متخصص React (ری اکت دولوپر)


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

این دوره شما را به خوبی با کتابخانه React آشنا می‌کند و اگر به فکر افزایش سطح مهارت خود هستید، می‌توانید روی این دوره حساب کنید.

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

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

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

آموزش برنامه نویسی ری اکت به شما این امکان را می‌دهد که ظرف مدت کوتاهی بتوانید بهترین UX و UI را برای کابرانتان طراحی و اجرا کنید.

آیا دوره ری اکت مناسب برنامه نویسان فول استک است؟

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

نمایش بیشتر
سرفصل‌های دوره
ورود به دنیای React ۱۹ جلسه
  • جلسه اول React چیست؟ ۱۸ دقیقه
  • جلسه دوم ساخت UI با استفاده از JS ۳۱ دقیقه
  • جلسه سوم Hello World With React ۱۳ دقیقه
  • جلسه چهارم Hello World With React (React 18) ۴ دقیقه
  • جلسه پنجم JSX و ویژگی‌های آن ۲۰ دقیقه
  • جلسه ششم Component چست؟ ۱۱ دقیقه
  • جلسه هفتم نحوه ساخت functinal component ۱۶ دقیقه
  • جلسه هشتم ایجاد Component با استفاده از Class ۱۴ دقیقه
  • جلسه نهم React Component Props ۱۶ دقیقه
  • جلسه دهم آشنایی با Create React App ۱۹ دقیقه
  • جلسه یازدهم List rendering ۲۴ دقیقه
  • جلسه دوازدهم state چست؟ ۲۱ دقیقه
  • جلسه سیزدهم Event handeling ۲۶ دقیقه
  • جلسه چهاردهم Event Handling (part 2) ۱۲ دقیقه
  • جلسه پانزدهم ایجاد ارتباط بین کامپوننت ها ۳۰ دقیقه
  • جلسه شانزدهم ایجاد ارتباط بین کامپوننت‌ها (جلسه دوم) ۱۶ دقیقه
  • جلسه هفدهم Conditional Rendering ۲۱ دقیقه
  • جلسه هجدهم تبدیل template ساده چت به React ۳۴ دقیقه
  • جلسه نوزدهم json server ۱۵ دقیقه
React Class Components ۱۷ جلسه
  • جلسه اول Lifecycle Methods ۱۱ دقیقه
  • جلسه دوم componentDidMount ۵ دقیقه
  • جلسه سوم مینی پروژه دریافت اطلاعات بر اساس IP کاربر ۲۸ دقیقه
  • جلسه چهارم componentDidUpdate ۶ دقیقه
  • جلسه پنجم مینی پروژه نمایش پست‌ها به همراه سایدبار ۲۷ دقیقه
  • جلسه ششم مینی پروژه نمایش پست‌ها به همراه سایدبار (پارت دوم) ۱۴ دقیقه
  • جلسه هفتم componentWillUnmount ۳ دقیقه
  • جلسه هشتم مثال استفاده از componentWillUnmount ۹ دقیقه
  • جلسه نهم getDerivedStateFromProps ۱۲ دقیقه
  • جلسه دهم مثال استفاده از getDerivedStateFromProps (پارت اول) ۲۲ دقیقه
  • جلسه یازدهم مثال استفاده از getDerivedStateFromProps (پارت دوم) ۱۱ دقیقه
  • جلسه دوازدهم shouldComponentUpdate ۱۵ دقیقه
  • جلسه سیزدهم نحوه اضافه کردن shouldComponentUpdate ۱۲ دقیقه
  • جلسه چهاردهم createRef ۹ دقیقه
  • جلسه پانزدهم مثال استفاده از createRef ۶ دقیقه
  • جلسه شانزدهم getSnapshotBeforeUpdate ۷ دقیقه
  • جلسه هفدهم مثال استفاده از getSnapshotBeforeUpdate ۲۲ دقیقه
React Functional Component And Hooks ۲۹ جلسه
  • جلسه اول مشکلات class components و دلایل اضافه شدن React Hooks ۸ دقیقه
  • جلسه دوم آشنایی اولیه با useState ۷ دقیقه
  • جلسه سوم آشنایی اولیه با useEffect ۵ دقیقه
  • جلسه چهارم ساده‌ترین مثال استفاده از Hooks ۶ دقیقه
  • جلسه پنجم Closure functions ۱۵ دقیقه
  • جلسه ششم Stale Closure ۱۴ دقیقه
  • جلسه هفتم مثال slider (part 1) ۱۳ دقیقه
  • جلسه هشتم مثال slider (part 2) ۲۵ دقیقه
  • جلسه نهم مهمترین تفاوت بنیادی functional و class کامپوننت‌ها (part 1) ۱۴ دقیقه
  • جلسه دهم مهمترین تفاوت بنیادی functional و class کامپوننت‌ها (part 2) ۵ دقیقه
  • جلسه یازدهم useState Functional updates ۱۱ دقیقه
  • جلسه دوازدهم useEffect dependency array ۱۶ دقیقه
  • جلسه سیزدهم useEffect cleanup function ۱۴ دقیقه
  • جلسه چهاردهم useRef ۱۲ دقیقه
  • جلسه پانزدهم useRef vs createRef ۵ دقیقه
  • جلسه شانزدهم نحوه استفاده از loading و toast ۲۳ دقیقه
  • جلسه هفدهم user actions ۱۷ دقیقه
  • جلسه هجدهم useReducer (جلسه اول) ۱۷ دقیقه
  • جلسه نوزدهم useReducer (جلسه دوم) ۱۲ دقیقه
  • جلسه بیستم useMemo ۱۱ دقیقه
  • جلسه بیست و یکم useMemo and useCallback ۸ دقیقه
  • جلسه بیست و دوم custom hooks ۱۱ دقیقه
  • جلسه بیست و سوم useDebugValue ۳ دقیقه
  • جلسه بیست و چهارم useLayoutEffect ۵ دقیقه
  • جلسه بیست و پنجم دریافت اطلاعات از wikipedia (ایجاد نقشه جهان با قابلیت کلیک بر روی کشورها) ۱۹ دقیقه
  • جلسه بیست و ششم دریافت اطلاعات از wikipedia (ایجاد componentها و تعریف event مورد نیاز نقشه) ۱۲ دقیقه
  • جلسه بیست و هفتم دریافت اطلاعات از wikipedia (دریافت اولین پاراگراف صفحه به عنوان summary از ویکی پدیا) ۱۱ دقیقه
  • جلسه بیست و هشتم دریافت اطلاعات از wikipedia (دریافت info از ویکی پدیا) ۸ دقیقه
  • جلسه بیست و نهم دریافت اطلاعات از wikipedia (دریافت لینک تصویر و راهنمایی برای دریافت اطلاعات به زبان فارسی) ۱۳ دقیقه
قابلیت‌های پیشرفته React و React Best Practices ۲۶ جلسه
  • جلسه اول آشنایی با virtual DOM جلسه اول ۱۴ دقیقه
  • جلسه دوم آشنایی با virtual DOM جلسه دوم ۲۳ دقیقه
  • جلسه سوم استفاده درست از key و عواقب استفاده اشتباه!! ۱۸ دقیقه
  • جلسه چهارم آشنایی با Higher-Order Components ۲۴ دقیقه
  • جلسه پنجم آشنایی با context ۱۲ دقیقه
  • جلسه ششم استفاده از context در functional components ۱۳ دقیقه
  • جلسه هفتم استفاده از context در class components ۴ دقیقه
  • جلسه هشتم مثال پیاده سازی فرآیند ورود کاربر (بخش اول) ۱۷ دقیقه
  • جلسه نهم مثال پیاده سازی فرآیند ورود کاربر (بخش دوم) ۱۱ دقیقه
  • جلسه دهم مثال پیاده سازی فرآیند ورود کاربر (بخش سوم) ۲۸ دقیقه
  • جلسه یازدهم مثال پیاده سازی فرآیند ورود کاربر (بخش چهارم) ۱۷ دقیقه
  • جلسه دوازدهم استفاده مجدد از کامپوننت به چه معناست و در چه سطحی باید در پروژه انجام شود؟ ۱۲ دقیقه
  • جلسه سیزدهم آشنایی با الگوی Container-Presenter و شفاف سازی در خصوص استفاده یا عدم استفاده از آن ۱۴ دقیقه
  • جلسه چهاردهم آشنایی با انواع ساختاربندی پوشه‌ها و فایل‌های پروژه در React ۲۵ دقیقه
  • جلسه پانزدهم نحوه استفاده از متغییرهای محیطی در React ۱۳ دقیقه
  • جلسه شانزدهم پیاده سازی یک نمونه سرویس (axios) در React ۲۵ دقیقه
  • جلسه هفدهم page layout ۲۳ دقیقه
  • جلسه هجدهم پیاده سازی routing ساده ۱۰ دقیقه
  • جلسه نوزدهم نحوه کنترل UI یک کامپوننت با استفاده از Props ۲۴ دقیقه
  • جلسه بیستم جابه جایی بین صفحات برنامه ۲۷ دقیقه
  • جلسه بیست و یکم سیاست‌های ارائه نسخه‌های جدید در React ۳ دقیقه
  • جلسه بیست و دوم JSX Transform جدید چیست و چگونه از آن استفاده نماییم ۱۰ دقیقه
  • جلسه بیست و سوم تغییرات Event Delegation در React 17 ۱۵ دقیقه
  • جلسه بیست و چهارم حذف Event Pooling در React 17 ۲ دقیقه
  • جلسه بیست و پنجم تغییرات Effect Cleanup در React 17 ۱۱ دقیقه
  • جلسه بیست و ششم پرسش و پاسخ دانشجویان در پایان وبینار React 17 ۱۲ دقیقه
اضافه کردن routing به پروژه React ۲۶ جلسه
  • جلسه اول معرفی مفهوم routing ۱۰ دقیقه
  • جلسه دوم آشنایی با location api در مرورگر ۱ دقیقه
  • جلسه سوم آشنایی با history api در مرورگر ۱۱ دقیقه
  • جلسه چهارم ایجاد یک کامپوننت ساده برای رندر کردن کامپوننت متناسب با آدرس وارد شده ۸ دقیقه
  • جلسه پنجم پیاده سازی یک کامپوننت link برای اضافه کردن لینک‌ها به برنامه ۷ دقیقه
  • جلسه ششم پیاده سازی forceUpdate برای کامپوننت route ۱۳ دقیقه
  • جلسه هفتم رندر مجدد route‌ها با تغییر آدرس ۵ دقیقه
  • جلسه هشتم تفاوت hash routing و history ۴ دقیقه
  • جلسه نهم معرفی کامپوننت‌های اصلی پکیج React router (شروع آموزش پکیج React router) ۴ دقیقه
  • جلسه دهم آشنایی با نحوه اضافه کردن react router به پروژه ۱۱ دقیقه
  • جلسه یازدهم آشنایی با route render methods در React router ۱۶ دقیقه
  • جلسه دوازدهم تفاوت Static Routing و Dynamic Routing ۳ دقیقه
  • جلسه سیزدهم نحوه پیاده سازی nesting routing در React router ۳ دقیقه
  • جلسه چهاردهم نحوه دسترسی به params در کامپوننت‌ها با استفاده از match و useParams ۷ دقیقه
  • جلسه پانزدهم دسترسی به history با استفاده از useHistory ۳ دقیقه
  • جلسه شانزدهم آشنایی با useRouteMatch در React router ۶ دقیقه
  • جلسه هفدهم آشنایی با آبجکت location و استفاده از useLocation ۴ دقیقه
  • جلسه هجدهم پیاده سازی مثال ورود کاربر با استفاده از React Router (بخش اول) ۶ دقیقه
  • جلسه نوزدهم پیاده سازی مثال ورود کاربر با استفاده از React Router (بخش دوم) ۱۳ دقیقه
  • جلسه بیستم پیاده سازی مثال ورود کاربر با استفاده از React Router (بخش سوم) ۱۶ دقیقه
  • جلسه بیست و یکم روش انطباق آدرس وارد شده در React router (بخش اول) ۹ دقیقه
  • جلسه بیست و دوم روش انطباق آدرس وارد شده در React router (بخش دوم) ۸ دقیقه
  • جلسه بیست و سوم بررسی propsهای BrowserRouter و نمایش پیغام به کاربر با Prompt ۱۴ دقیقه
  • جلسه بیست و چهارم تغییر استایل لینک فعال با استفاده از NavLink ۶ دقیقه
  • جلسه بیست و پنجم بررسی نکات مثال Modal Gallery ۱۰ دقیقه
  • جلسه بیست و ششم بررسی نکات مثال‌های مطرح شده در سایت React router ۱۳ دقیقه
مدیریت state با استفاده از Redux ۵۸ جلسه
  • جلسه اول معرفی پکیج Redux ۷ دقیقه
  • جلسه دوم آشنایی با ساختار ذخیره سازی State ۵ دقیقه
  • جلسه سوم آشنایی با action و کاربرد آن ۴ دقیقه
  • جلسه چهارم تعریف ساده از توابع pure ۲ دقیقه
  • جلسه پنجم آشنایی با Reducer و کاربرد آن ۵ دقیقه
  • جلسه ششم آشنایی و پیاده سازی Store ۱۰ دقیقه
  • جلسه هفتم اضافه کردن قابلیت subscribe به Store ۵ دقیقه
  • جلسه هشتم نحوه اضافه کردن Redux به پروژه ۲ دقیقه
  • جلسه نهم اولین مثال ساده استفاده از Redux در React ۶ دقیقه
  • جلسه دهم استفاده مستقیم از Store و حل مثال todo list ساده ۱۸ دقیقه
  • جلسه یازدهم پیاده سازی برقراری ارتباط بین react و redux ۲۰ دقیقه
  • جلسه دوازدهم ترکیب کردن Reducer ها ۱۵ دقیقه
  • جلسه سیزدهم نحوه پیاده سازی combineReducers و استفاده از آن ۶ دقیقه
  • جلسه چهاردهم چرخه جریان اطلاعات (Data flow) در Redux ۴ دقیقه
  • جلسه پانزدهم آشنایی با ۳ قانون اصلی Redux ۵ دقیقه
  • جلسه شانزدهم پیاده سازی مثال todos (شناسایی state و actions) بخش اول ۱۶ دقیقه
  • جلسه هفدهم پیاده سازی مثال todos (پیاده سازی todosSlice) بخش دوم ۲۹ دقیقه
  • جلسه هجدهم پیاده سازی مثال todos (پیاده سازی todosSlice) بخش سوم ۱۶ دقیقه
  • جلسه نوزدهم پیاده سازی مثال todos (جلوگیری از رندر مجدد همه todoها) بخش چهارم ۱۰ دقیقه
  • جلسه بیستم معرفی Redux dev tools ۸ دقیقه
  • جلسه بیست و یکم معرفی و نحوه استفاده از پکیج immer ۱۵ دقیقه
  • جلسه بیست و دوم پیاده سازی مثال todos (اضافه کردن immer به پروژه) بخش پنجم ۵ دقیقه
  • جلسه بیست و سوم پیاده سازی مثال todos (اضافه کردن filtersSlice) بخش ششم ۲۹ دقیقه
  • جلسه بیست و چهارم پیاده سازی مثال todos (پیاده سازی فیلتر todoها) بخش هفتم ۱۳ دقیقه
  • جلسه بیست و پنجم معرفی و نحوه استفاده از پکیج reselect ۱۲ دقیقه
  • جلسه بیست و ششم پیاده سازی مثال todos (پیاده سازی تغییرات رنگ و اکشن‌های پاک کردن و کامل کردن todoها) بخش هشتم ۲۰ دقیقه
  • جلسه بیست و هفتم آشنایی با مفهوم و کاربرد enhancer و پیاده سازی آنها ۱۵ دقیقه
  • جلسه بیست و هشتم آشنایی با مفهوم و کاربرد middleware و پیاده سازی آنها ۱۴ دقیقه
  • جلسه بیست و نهم پیاده سازی async function middleware (مشابه thunk) و یاد گیری اصول کار کردن با thunk ۲۰ دقیقه
  • جلسه سی‌ام اضافه کردن redux thunk به پروژه و تبادل اطلاعات با سرور ۱۴ دقیقه
  • جلسه سی و یکم مدیریت کردن و نمایش وضعیت درخواست‌های async در redux thunk (بخش اول) ۱۹ دقیقه
  • جلسه سی و دوم مدیریت کردن و نمایش وضعیت درخواست‌های async در redux thunk (بخش دوم) ۱۰ دقیقه
  • جلسه سی و سوم Redux Toolkit چیست و به چه دردی میخورد؟ ۶ دقیقه
  • جلسه سی و چهارم کانفیگ راحتر store با استفاده از configureStore ۱۴ دقیقه
  • جلسه سی و پنجم ایجاد راحت‌تر action با استفاده از createAction ۱۳ دقیقه
  • جلسه سی و ششم ایجاد راحت‌تر reducer با استفاده از createReducer ۱۲ دقیقه
  • جلسه سی و هفتم ایجاد همزمان reducer و action creator با استفاده از createSlice ۱۶ دقیقه
  • جلسه سی و هشتم مدیریت چرخه عملیات‌های async با استفاده از createAsyncThunk (بخش اول) ۲۵ دقیقه
  • جلسه سی و نهم مدیریت چرخه عملیات‌های async با استفاده از createAsyncThunk (بخش دوم) ۱۰ دقیقه
  • جلسه چهلم متوقف کردن اجرای عملیات‌های async در redux thunk ۷ دقیقه
  • جلسه چهل و یکم Normalizing State چیست و چه کاربردی دارد؟ ۱۱ دقیقه
  • جلسه چهل و دوم مثال استفاده از Normalizing State (بخش اول) ۱۷ دقیقه
  • جلسه چهل و سوم مثال استفاده از Normalizing State (بخش دوم) ۲۷ دقیقه
  • جلسه چهل و چهارم مثال استفاده از Normalizing State (بخش سوم) ۱۸ دقیقه
  • جلسه چهل و پنجم مثال استفاده از Normalizing State (بخش چهارم) ۱۴ دقیقه
  • جلسه چهل و ششم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش اول) ۵ دقیقه
  • جلسه چهل و هفتم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش دوم) ۱۷ دقیقه
  • جلسه چهل و هشتم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش سوم) ۱۱ دقیقه
  • جلسه چهل و نهم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش چهارم) ۶ دقیقه
  • جلسه پنجاهم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش پنجم) ۲۲ دقیقه
  • جلسه پنجاه و یکم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش ششم) ۱۱ دقیقه
  • جلسه پنجاه و دوم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش هفتم) ۲۸ دقیقه
  • جلسه پنجاه و سوم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش هشتم) ۳ دقیقه
  • جلسه پنجاه و چهارم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش نهم) ۸ دقیقه
  • جلسه پنجاه و پنجم مثال پیاده سازی بلاگ ساده با استفاده از redux (بخش دهم) ۱۸ دقیقه
  • جلسه پنجاه و ششم وبینار - آیا ریداکس مرده و منسوخ شده است؟ ۲۳ دقیقه
  • جلسه پنجاه و هفتم وبینار - پرسش و پاسخ (بخش اول) ۲۱ دقیقه
  • جلسه پنجاه و هشتم وبینار - پرسش و پاسخ (بخش دوم) ۲۸ دقیقه
فریمورک NextJS و آموزش SSR و SSG ۲۸ جلسه
  • جلسه اول Next.js چیست و چه مشکلاتی را برطرف می‌کند؟ ۹ دقیقه
  • جلسه دوم آشنایی با Pre-rendering و کاربرد آن ۱۲ دقیقه
  • جلسه سوم نحوه setup کردن Next.js ۵ دقیقه
  • جلسه چهارم تعریف page در Next.js ۱۲ دقیقه
  • جلسه پنجم تفاوت static generation با data و بدون data چیست؟ ۹ دقیقه
  • جلسه ششم نحوه اجرای تابع getStaticProps در حالت‌های مختلف ۱۱ دقیقه
  • جلسه هفتم آشنایی با dynamic routing در Next.JS ۱۰ دقیقه
  • جلسه هشتم آشنایی با تابع getStaticPaths و کاربرد آن در Next.JS ۲۴ دقیقه
  • جلسه نهم بررسی خروجی تولید شده با استفاده از script build در حالت static site generation (ssg) ۴ دقیقه
  • جلسه دهم بررسی انواع حالت‌های fallback در تابع getStaticPaths (بخش اول) ۱۸ دقیقه
  • جلسه یازدهم بررسی انواع حالت‌های fallback در تابع getStaticPaths (بخش دوم) ۷ دقیقه
  • جلسه دوازدهم Incremental Static Regeneration در حالت SSG ۱۳ دقیقه
  • جلسه سیزدهم Server Side Rendering (SSR) ۳ دقیقه
  • جلسه چهاردهم کاربرد و نحوه استفاده از کامپوننت Link ۵ دقیقه
  • جلسه پانزدهم کاربرد و نحوه استفاده از کامپوننت Head ۱ دقیقه
  • جلسه شانزدهم کاربرد و نحوه استفاده از کامپوننت Image ۱۳ دقیقه
  • جلسه هفدهم نحوه مدیریت کردن style در Next.js ۱۵ دقیقه
  • جلسه هجدهم Absolute Imports and Module path aliases ۶ دقیقه
  • جلسه نوزدهم ایجاد یک custom document ۶ دقیقه
  • جلسه بیستم suppressHydrationWarning ۳ دقیقه
  • جلسه بیست و یکم تفاوت استفاده کردن از useEffect و useLayoutEffect ۱۱ دقیقه
  • جلسه بیست و دوم نحوه دریافت page props در سمت کلاینت (بخش اول) ۱۱ دقیقه
  • جلسه بیست و سوم نحوه دریافت page props در سمت کلاینت (بخش دوم) ۸ دقیقه
  • جلسه بیست و چهارم کانفیگ Redux در NextJS (بخش اول) ۱۷ دقیقه
  • جلسه بیست و پنجم کانفیگ Redux در NextJS (بخش دوم) ۵ دقیقه
  • جلسه بیست و ششم کانفیگ Redux در NextJS (بخش سوم) ۶ دقیقه
  • جلسه بیست و هفتم کانفیگ Redux در NextJS (بخش چهارم) ۱۵ دقیقه
  • جلسه بیست و هشتم کانفیگ Redux در NextJS (بخش پنجم) ۷ دقیقه
آشنایی با تست نویسی در React ۲۳ جلسه
  • جلسه اول معرفی ۱ دقیقه
  • جلسه دوم نوشتن یک نمونه تست ساده بدون هیچ ابزاری ۳ دقیقه
  • جلسه سوم معرفی و استفاده از jest ۶ دقیقه
  • جلسه چهارم معرفی و استفاده از jest جلسه دوم ۴ دقیقه
  • جلسه پنجم اجرای تست‌ها در react ۴ دقیقه
  • جلسه ششم نوشتن اولین تست react ۹ دقیقه
  • جلسه هفتم معرفی و استفاده از تابع act ۴ دقیقه
  • جلسه هشتم استفاده از setup و teardown در jest ۲ دقیقه
  • جلسه نهم تست خروجی کامپوننت با تغییرات props ۵ دقیقه
  • جلسه دهم روش تست گرفتن eventها بدون استفاده از پکیج اضافه ۱۳ دقیقه
  • جلسه یازدهم تست کردن timing ۵ دقیقه
  • جلسه دوازدهم رندر کردن کامپوننت‌ها با استفاده از متد render (شروع کار با پیکج testing library) ۴ دقیقه
  • جلسه سیزدهم معرفی انواع query در testing library ۱۱ دقیقه
  • جلسه چهاردهم انتخاب بهینه المنت‌ها با استفاده از testing playground ۶ دقیقه
  • جلسه پانزدهم تفاوت get query find ۵ دقیقه
  • جلسه شانزدهم استفاده از jest dom custom matchers ۳ دقیقه
  • جلسه هفدهم مثال استفاده از queries ۹ دقیقه
  • جلسه هجدهم مثال تست عملیات async ۱۹ دقیقه
  • جلسه نوزدهم ماک کردن درخواست‌های api با استفاده از msw ۱۰ دقیقه
  • جلسه بیستم تست ارسال درخواست api و استفاده از fireEvent ۱۳ دقیقه
  • جلسه بیست و یکم تست خطا در درخواست از api ۱۵ دقیقه
  • جلسه بیست و دوم شبیه سازی اکشن‌های کاربر با استفاده از userEvent ۱۲ دقیقه
  • جلسه بیست و سوم تست توابع دریافتی از طریق props ۵ دقیقه
نمایش بیشتر
با خیال راحت آموزش ببینید
ضمانت بازگشت وجه
ضمانت بازگشت وجه خرید و ثبت نام شما در دوره‌های بلندمدت سون لرن بدون ریسک مالی خواهد بود
آموزش مهارت محور
آموزش مهارت محور از مدرسین متخصص و با تجربه در بهترین شرکت‌های ایران مهارت مورد نیاز بازار کار را یاد می‌گیرید
رفع اشکالات و پشتیبانی فنی
جامعه برنامه نویسی فعال پشتیبانی و پاسخ به سوالات خود را در جامعه برنامه نویسی فعال سون لرن دریافت می‌کنید
ارزیابی فنی و رتبه بندی
ارزیابی فنی و امتیازدهی برای فعالیت‌ها و آزمون‌های خود، امتیازات مختلفی برای ارزیابی مهارت دریافت می‌کنید (از آذر 1402)
معرفی برترین‌ها به بازار کار
معرفی برترین‌ها به بازار کار دانشجویان فعالی که مستمر و منظم محتوای دوره‌ها را دنبال می‌کنند، در اولویت معرفی به بازار کار هستند
دسترسی دائمی و بدون محدودیت
دسترسی راحت و همیشگی شما بعد از تهیه دوره به محتوای دوره و آپدیت‌های محتوایی دسترسی خواهید داشت
نتایج دوره‌های متخصص

در ۱۷ سال اخیر بیش از ۳۵ هزار نفر در سون لرن به صورت تخصصی آموزش برنامه نویسی دیده اند و هزاران نفر از این عزیزان در شرکت‌های مختلف استخدام شده اند.

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

اسنپ دیجی کالا علی بابا تخفیفان کافه بازار ژاکت
+ ده‌ها شرکت مطرح دیگر
مدرس و منتورهای دوره
مجتبی سوری مجتبی سوری مدیر تیم فنی در اسنپ فود رزومه و نمونه تدریس
  • مدیر تیم فنی در اسنپ فود
  • برنامه‌نویس ارشد سون‌لرن
  • فول استک دولوپر برنامه‌ی همکار
  • فریلنسر: توسعه‌ی زیرساخت فروشگاهی، شرکتی، اتوماسیون و ...
منتورهای دوره دوستان زیر منتور متخصص React هستند و در طول دوره به سوالات شما پاسخ میدن و همراهتون هستند.
مریم علی شاهی
مریم علی شاهی
محمد جواد جباری
محمد جواد جباری
ویدیو‌های نمونه تدریس دوره

ثبت‌نام در متخصص React

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

سوالات متداول متخصص React (ری اکت دولوپر)

پیش‌نیاز یادگیری React (ری‌اکت) چیست؟

مهمترین پیش نیاز یادگیری React جاوا اسکریپت است. هر چه تسلط شما بر جاوااسکریپت بیشتر باشد. در ادامه‌ی کار راحت‌تر می‌توانید کد نویسی کنید. اما برای شروع نیاز نیست که شما تسلط ۱۰۰٪ بر تمامی فیچرهای جاوااسکریپت داشته باشید. در حد معمولی که بتوانید کارهای عادی را با جاوااسکریپت بدون استفاده از هیچ پکیجی انجام دهید کافی است و می‌توانید یادگیری React را شروع کنید بعدا در صورت نیاز می‌توانید دانش جاوااسکریپت خود را افزایش دهید.

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

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

بقیه موارد مثل نصب کردن پکیج‌ها در جلسه‌های آموزشی چندین بار انجام می‌شود و یاد می‌گیرید.


بازارکار برنامه نویسی React (ری اکت) چگونه است؟

در حال حاضر مهارت برنامه نویسی React (ری اکت) بازار کار خوبی دارد. و شرکت‌های ایرانی و خارجی زیادی هستند که از React استفاده می‌کنند پس متناسب با آن تقاضا برای استخدام React developer هم خیلی زیاد است. و این تقاضا روز به روز رو به افزایش است.

و یک نکته مهم اینکه شما با افزایش مهارت خودتان به راحتی می‌توانید با شرکت‌های خارج از ایران همکاری کنید و درآمد دلاری داشته باشید و خیلی راحت مهاجرت کنید.

مزایای React (ری اکت) چیست؟

از جمله مزایای React (ری اکت) می‌توان به موارد زیر اشاره کرد:

  • استفاده از React (ری اکت) باعث افزایش سرعت توسعه نرم افزار می‌شود.
  • با ابزارها و معماری که دارد، رفع عیب و خطایابی نرم افزار راحت‌تر است.
  • یادگیری React راحت است. پیچیدگی زیادی ندارد. قابلیت توسعه خوبی هم دارد.
  • community بزرگی دارد افرادی زیادی از آن استفاده می‌کنند. به همین دلیل پکیج‌ها و کدهای آماده زیادی برای ما وجود دارد. و اکثر چالش‌هایی که ما با آنها روبرو می‌شویم توسط برنامه نویس‌های دیگر قبلا حل شده و به اشتراک گذاشته شده است.

ری اکت مزیت‌های فنی زیادی هم دارد که به آنها در طول دوره اشاره شده است.


کاربرد React (ری اکت) چیست؟

یک کتابخانه جاوااسکریپت است. که کاربردهای زیادی دارد از جمله:

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

تمرکز اصلی ما در دوره آموزش React این است که شما بتوانید user interface تحت وب را پیاد سازی کنید.


تفاوت React (ری اکت) با انگولار و vue چیست؟

در سطح اینترنت مقالات زیادی در مورد تفاوت React (ری اکت) با AngularJS و Vue.js وجود دارد که اگر همه آنها را بررسی کنید به این نتیجه می‌رسید که همه چیز بستگی به شرایط پروژه دارد. پس به صورت مطلق نمی‌توان گفت که از کدام یک از این ابزارها می‌توان استفاده کرد. عوامل زیادی در انتخاب یک ابزار وجود دارد که خیلی از آنها فنی نیست مثلا نیروی انسانی در دسترس و زبانی که می‌خواهیم توسعه دهیم و ... در انتخاب تاثیر دارد.

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

در مورد سرعت و performance تفاوت آنچنان زیادی ندارند. چون همه این ابزارها از نظر performance مشکلی ندارند و میزان تسلط برنامه نویس است که بر performance خروجی تاثیر دارد.

یک تفاوت دیگر این است که React (ری اکت) و AngularJS توسط شرکت فیس بوک و گوگل پشتیبانی می‌شود. اما Vue.js اپن سورس است. اما به این معنی نیست که React و AngularJS قوی‌تر است.

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

هر سه فریم ورک community بزرگی دارند و ابزارهای خوبی هم دارند. معمولا در سازمان‌ها و پروژه‌های بزرگ از AngularJS استفاده می‌شود. در پروژه‌هایی که سرعت توسعه مهم‌تر است از Vue.js استفاده می‌شود. React هم در عین سادگی و سرعت، قدرت توسعه خیلی خوبی دارد و در پروژه‌های بزرگ و کوچک می‌توان از آن استفاده کرد.

نکته دیگر اینکه برای استفاده از AngularJS باید حتما از تایپ اسکریپت استفاده کنید. ولی برای Vue.js و React اختیاری است.

معمولا کسانی که React را یاد می‌گیرند خیلی راحت با Vue.js هم می‌توانند کار کنند. در نهایت توصیه می‌کنم یکی از ابزارها را یاد بگیرید در ادامه می‌توانید بقیه ابزارها را یاد بگیرید و استفاده کنید


بهترین روش یادگیری برنامه نویسی React چیست؟

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

همیشه قبل از شروع یادگیری برنامه نویسی این دو سوال مطرح می‌شود:

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

پس اگر با یک مدرس با تجربه و معتبر و تمرین و چالش‌پذیری یادگیری را شروع کنید مطمئن باشید بهترین نتیجه را می‌گیرید.