ثبت نام در دوره
ثبت نام در دوره

آموزش جامع و پروژه محور ری اکت (React)

.

قیمت: 890,000 تومان

قیمت ارزی (تتر):

X
ثبت نام در دوره
36 : 11 : 04
162 جلسه
9 فصل
2 سال پشتیبانی

آموزش جامع و پروژه محور ری اکت (React)

یکی از کاربردی‌ترین ابرارهایی که برای اپلیکیشن‌های تک صفحه‌ای به منظور مدیریت لایه‌ها استفاده می‌شود، ری‌ اکت می‌باشد.  در این بخش در ارتباط با React مطالبی به شما ارائه خواهم داد. با من همراه باشید.

 

ری اکت چیست؟

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

 

ری اکت در کنار دو رقیب

React برای اولین بار در سال ۲۰۱۱ توسط فیس بوک استفاده شد. بعد از آن روز به روز به محدودیت ری‌اکت افزوده شد. فیس بوک شرکت کوچکی نبود و استفاده‌ی فیس‌بوک از ری‌اکت نشان دهنده‌ی این است که  قابلیت بالایی دارد. اگر سری به گوگل ترنس بزنیم و این نوع کتابخانه را در کنار دو رقیبش angular و vue قرار دهیم، می‌بینیم با توجه به قدرتی که این دو رقیب دارند باز هم React پیشتاز است. React برخلاف angular و vue که فریم ورک‌های جاوا اسکریپتی هستند یک کتابخانه است و همین کتابخانه بودنش باعث شده است که اولا خیلی سبک باشد، استفاده از آن آسان و از همه مهم‌تر یادگیری‌اش بسیار راحت است.

 

چرا یادگیری React ساده است؟

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

 

React-native

 

بازار کار React

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

 

فریم ورک ری‌اکت نسبت به سایر فریم ورک‌های جاوا چه مزیتی دارد؟

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

 

DOM مجازی را سریع‌تر نمایش می‌دهد:

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

 

 ایجاد اپلیکیشن‌های مرورگر متحرک آسان‌تر

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

 

  JSX یک افزونه‌ی خاص ری اکت

JavaScript Extention  افزونه‌ای مختص به ری‌اکت می‌باشد. این ویژگی به شما کمک می‌کند کدها را مانند کد HTML  بنویسید. این ویژگی را می‌توان از بهترین خصوصیات  فریم ورک ری‌اکت دانست. چرا که کار نوشتن بلوک‌ها را برای توسعه دهندگان خیلی راحت‌تر می‌کند.

 

به کمک ری اکت از داشتن یک کد پایدار مطمئن باشید.

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

 

توسعه‌ی اپلیکیشن‌ها به کمک React Native:

کار توسعه‌ی برنامه‌های موبایل با فریم ورک React بسیار راحت‌تر شده است. ری‌اکت نیتیو یک فریم‌ ورک UI متن باز برای طراحی اپلیکیشن موبایل می‌باشد. به نوعی  این نسخه از   react  شرایط استفاده از کدهای وب این فریم ورک را  برای نسخه‌های اندروید و ios را فراهم خواهد کرد.

 

React

 

یادگیری آسان ری اکت

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

 

اتصال داده یک طرفه:

به این معناست که یک Software developer برای ایجاد تغییر یک کامپوننت باید از Callback استفاده کند و نمی‌تواند مستقیما آن را ویرایش کند.

 

ری اکت دارای پلتفرم قابل توسعه

برای توسعه‌ی این فریم ورک نیازمند دو ابزار هستیم:

react developer

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

Redux

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

 

رابط کاربری اعلانی (Declarative UI)

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

 

معماری عالی React:

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

 

سئو سایت خود را با ری اکت جی اس ارتقا دهید.

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

 

برای یادگیری ری اکت چه پیش‌نیازهایی لازم است؟

1. مبانی جاوا اسکریپت

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

  • Scoping
  • let و const و
  • map  , filter  و
  • JSON
  • JSX
  • DOM

 

2. برنامه‌نویسی شیء گرا

در این روش برنامه‌نویس بدنه‌ی اصلی توسط اشیا ساخته می‌شوند. به بیان دیگر اطلاعات و توابع در قالب شیء در کنار هم قرار می‌گیرند و یک واحد اصلی را تشکیل خواهند داد. برای درک بهتر  React و React-native  باید با این سبک برنامه‌نویس آشنا باشید.

 

3. آشنایی با الگوریتم‌ها

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

 

ری اکت

 

4. آشنایی با Flex

فلکس يك فريم ورك متن باز قوي است كه امكان ساخت برنامه هاي سنتي براي مرورگر، موبايل و دسكتاپ را با استفاده از همان مدل برنامه‌نويسي، ابزار و كد فراهم مي سازد. چیدمان صفحات در React-native به کمک Flex صورت می‌گیرد. بنابراین باید در این زمینه به تسلط کافی برسید.

 

5. آشنایی با API

رابط برنامه‌نویسی نرم‌افزار یا API یکی دیگر از ملزومات React و React-native می‌باشد.

 

در پایان

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

 

 

سرفصل های دوره

مقدمات و پیش نیازها

  • نصب پیش نیاز ها و ایجاد اولین پروژه react

    رایگان 00:17:11

  • افزودن react به وبسایت (به عنوان کتابخانه جانبی) - آشنایی با JSX

    رایگان 00:23:26

  • گیت و گیت هاب

    رایگان 00:17:13

  • ES6 (مفهوم کلاس در جاوااسکریپت)

    رایگان 00:13:06

  • ES6 (معرفی let - const - arrow functions)

    رایگان 00:10:07

  • ES6 (ماژول نویسی)

    منتشرشده 00:13:16
    • آشنایی اولیه با React

  • آشنایی با ساخت پروژه ری اکت (ساخت تایمر با react)

    منتشرشده 00:12:51

  • ساخت کامپوننت در react

    منتشرشده 00:14:43

  • استایل دهی در ریکت - state ها در ری اکت

    منتشرشده 00:13:39

  • کامپوننت ها در ریکت

    منتشرشده 00:08:31

  • چرخه حیاط react

    منتشرشده 00:11:49

  • مفهوم props در react و event handling در ری اکت

    منتشرشده 00:12:43

  • ساخت مینی پروژه stopwatch با ری اکت

    منتشرشده 00:16:10
    • مفاهیم اصلی React

  • ری اکت هوک - react hooks

    منتشرشده 00:15:30

  • هوک useState در React

    منتشرشده 00:13:28

  • مفهوم children در ری اکت و مفهوم key در react

    منتشرشده 00:10:18

  • تکمیل بخش ثبت زمان - spread operator در ES6

    منتشرشده 00:06:46

  • آشنایی با context در react

    منتشرشده 00:17:32

  • حل تمرین جلسه18 - نکات مهم در ری اکت - Spread Operator در ES6

    منتشرشده 00:15:53

  • فراخوانی پروژه از GitHub- بهترین راه تماشای آموزش آنلاین

    رایگان 00:18:20

  • شروع مینی پروژه اپلیکیشن TODO - کامپوننت Fragment

    منتشرشده 00:08:42

  • ادامه مینی پروژه اپلیکیشن TODO - و Object destructuring در ES6

    منتشرشده 00:12:51

  • ادامه اپلیکیشن TODO - و Conditional Rendering و form

    منتشرشده 00:12:02

  • حل تمرین و تکمیل مینی پروژه TODO

    منتشرشده 00:11:35

  • pure component در react

    منتشرشده 00:11:46

  • مینی پروژه حدث کلمه - ref در ری اکت

    منتشرشده 00:17:32

  • useRef و forwardRef در ری اکت

    منتشرشده 00:10:35

  • معرفی قالب پروژه نهایی

    رایگان 00:06:00

  • شروع مینی پروژه جدید - استفاده از CSS Modules در react

    منتشرشده 00:16:25
    • آشنایی با React Router

  • react-router | بخش 1

    منتشرشده 00:11:22

  • react-router | بخش 2 - کامپوننت Navigate

    منتشرشده 00:07:57

  • react-router | بخش 3

    منتشرشده 00:11:29

  • react-router | بخش 4 (useNavigate و NavLink در ری اکت)

    منتشرشده 00:12:57

  • react-router | بخش آخر (useLocation و sweetalert در ری اکت)

    منتشرشده 00:10:29
    • ارتباط با سمت سرور

  • معرفی RESTful API

    منتشرشده 00:08:23

  • معرفی و کار با Axios

    منتشرشده 00:12:27

  • مفهوم promise و async - await

    منتشرشده 00:22:12

  • حذف کاربر با متود DELETE با Axios

    منتشرشده 00:09:19

  • افزودن کاربر با متود Post در Axios

    منتشرشده 00:14:19

  • ویرایش کاربر - پیاده سازی سرچ کاربر

    منتشرشده 00:16:11

  • نکات پیشرفته استفاده از Axios

    منتشرشده 00:11:38
    • مفاهیم اصلی React (پیشرفته)

  • react-portals

    منتشرشده 00:08:21

  • کامپوننت مرتبه بالا - HOC - آشنایی اولیه

    منتشرشده 00:10:37

  • کامپوننت مرتبه بالا - HOC - مثال عملی

    منتشرشده 00:16:12

  • render-props

    منتشرشده 00:13:51

  • نکات مهم هوک ها - previous state در react

    منتشرشده 00:12:58

  • نکات مهم هوک ها - useEffect

    منتشرشده 00:09:35

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

    منتشرشده 00:10:58

  • آشنایی با هوک useReducer - بخش دوم

    منتشرشده 00:07:41

  • آشنایی با هوک useReducer - مثال عملی - fetching data

    منتشرشده 00:22:39

  • آشنایی با هوک useCallback

    منتشرشده 00:12:33

  • آشنایی با هوک useMemo

    منتشرشده 00:12:33

  • آشنایی با custom hooks - ساخت هوک شخصی

    منتشرشده 00:12:53
    • React-Redux

  • آشنایی با redux

    منتشرشده 00:10:00

  • ساخت اولین پروژه ریداکسی - store, dispatch, subscribe

    منتشرشده 00:12:20

  • redux-multi reducer

    منتشرشده 00:08:05

  • آشنایی با react-redux - ساخت اولین پروژه ریداکسی در react

    منتشرشده 00:16:09

  • استفاده از هوک ها در react-redux و multi-reducer در react-redux

    منتشرشده 00:07:08

  • اکستنشن redux devTools به عنوان middleware

    منتشرشده 00:07:59

  • Action payload

    منتشرشده 00:10:27

  • Async action و redux-thunk

    منتشرشده 00:18:19

  • شروع مینی پروژه اپلیکیشن آب و هوا - مدیریت تاریخ شمسی با moment

    منتشرشده 00:12:33

  • تکمیل مینی پروژه اپ آب و هوا با ریداکس

    منتشرشده 00:14:34

  • پیشنیاز redux-saga - آشنایی ES6-generators

    منتشرشده 00:12:06

  • آشنایی کامل و پیاده سازی Redux-Saga

    منتشرشده 00:10:53

  • multiple_watcher و takeLatest_action

    منتشرشده 00:07:54
    • مدیریت فرم ها با Formik

  • آشنایی اولیه و ساخت اولین پروژه Formik

    منتشرشده 00:13:08

  • اعتبارسنجی با formik و آشنایی با regex

    منتشرشده 00:12:10

  • اعتبار سنجی با Yup

    منتشرشده 00:11:37

  • استفاده از کامپوننت های Formik

    منتشرشده 00:09:49

  • شخصی سازی کامپوننت های formik

    منتشرشده 00:11:44

  • مدیریت آبجکت ها و آرایه ها در formik

    منتشرشده 00:19:33

  • اعتبارسنجی کامپوننت های formik

    منتشرشده 00:12:19

  • غیرفعال سازی دکمه سابمیت فرم

    منتشرشده 00:10:18

  • اشتفاده از دیتای ذخیره شده در فرم

    منتشرشده 00:11:40

  • ساخت کامپوننت با قابلیت استفاده مجدد

    منتشرشده 00:08:28

  • ساخت کامپوننت های select و radioButton و checkbox

    منتشرشده 00:12:30

  • ساخت فرم ورود شخصی

    منتشرشده 00:15:26

  • ساخت فرم ثبت نام شخصی

    منتشرشده 00:13:40

  • استفاده و ساخت datepicker

    منتشرشده 00:15:10

  • آپلود فایل در formik و اعتبار سنجی فایل با Yup

    منتشرشده 00:11:07

  • معرفی و تست api ثبت نام و لاگین کاربر

    منتشرشده 00:13:49

  • ساخت فرم ثبت نام و ایجاد کاربر جدید

    منتشرشده 00:08:47
    • پروژه پنل مدیریت فروشگاه

  • ایجاد پروژه اولیه - آشنایی با React 18

    منتشرشده 00:09:08

  • انتقال لایوت پنل ادمین

    منتشرشده 00:14:41

  • ایجاد Context برای پروژه و حل مشکل کدهای جاوااسکریپت قالب html

    منتشرشده 00:17:31

  • تکمیل کامپوننت ها سایدبار منو

    منتشرشده 00:10:20

  • تکمیل کامپوننت های صفحه داشبورد

    منتشرشده 00:12:18

  • تکمیل UI صفحه مدیریت دسته بندی

    منتشرشده 00:08:54

  • تکمیل UI صفحه محصولات - حل مشکل modal ها با react-portal

    منتشرشده 00:11:00

  • ساخت کامپوننت مدال - کامپوننت جداول

    منتشرشده 00:18:43

  • تکمیل بخش pagination در کامپوننت table

    منتشرشده 00:14:58

  • ساخت کامپوننت سرچ برای پروژه

    منتشرشده 00:14:54

  • افزودن react-router به پروژه

    منتشرشده 00:08:29

  • انتقال صفحات مدیریت رنگها و گارانتی و برندها

    منتشرشده 00:13:07

  • تکمیل انتقال قالب به پروژه react

    منتشرشده 00:13:20

  • آشنایی با Swagger

    منتشرشده 00:10:55

  • استفاده از بک اند پروژه روی سیستم لوکال

    منتشرشده 00:12:16

  • افزودن صفحه لاگین به پروژه

    منتشرشده 00:12:06

  • تکمیل صفحه ورود و اعتبار سنجی جهت ورود به پنل ادمین

    منتشرشده 00:12:30

  • خروج از کاربری

    منتشرشده 00:11:01

  • کانفیگ کلی برای سرویس ها

    منتشرشده 00:14:05

  • دریافت دسته بندی و نمایش در صفحه مدیریت

    منتشرشده 00:22:39

  • ساخت صفحه زیرگروه دسته بندی ها

    منتشرشده 00:12:56

  • صفحه مدیریت محصول - تاریخ شمسی - outlet

    منتشرشده 00:09:07

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

    منتشرشده 00:18:09

  • حذف کدهای اضافی بعد از دریافت response از سمت سرور با axios.interceptors

    منتشرشده 00:09:22

  • افزودن دسته بندی جدید

    منتشرشده 00:10:55

  • کامپوننت لودر برای استفاده هنگام ریکویست

    منتشرشده 00:10:35

  • انتخاب اتوماتیک دسته والد در صفحه ایجاد دسته بندی جدید

    منتشرشده 00:06:47

  • ویرایش دسته بندی ها

    منتشرشده 00:21:52

  • حذف دسته بندی

    منتشرشده 00:08:28

  • مدیریت ویژگی ها در دسته بندی - نمایش جدول ویژگی ها

    منتشرشده 00:19:58

  • افزودن ویژیگی برای دسته بندی ها

    منتشرشده 00:11:30

  • ویرایش ویژگی های دسته بندی

    منتشرشده 00:18:25

  • حذف ویژگی دسته بندی ها - تکمیل بخش دسته بندی ها

    منتشرشده 00:11:16

  • صفحه مدیریت برندها

    منتشرشده 00:21:52

  • ویرایش و حذف برند ها

    منتشرشده 00:15:02

  • تکمیل صفحه مدیریت گارانتی ها

    منتشرشده 00:12:37

  • تکمیل صفحه مدیریت رنگ ها - مدیریت color picker با فرمیک

    منتشرشده 00:14:31

  • صفحه محصولات با کامپوننت جدول دارای صفحه بندی جدید

    منتشرشده 00:22:11

  • افزودن قابلیت جدید به صفحه بندی کامپوننت جداول - حذف محصول

    منتشرشده 00:11:29

  • افزودن محصول جدید - انتخاب دسته بندی

    منتشرشده 00:22:53

  • صفحه محصولات - لیست کردن کتگوری های انتخاب شده

    منتشرشده 00:13:12

  • ساخت کامپوننت های سلکت باکس چند انتخابی و قابل جستجو

    منتشرشده 00:25:16

  • نهایی سازی افزودن محصول

    منتشرشده 00:19:58

  • حل مشکل چارت داشبورد هنگام ریرندر

    منتشرشده 00:05:11

  • ویرایش محصول

    منتشرشده 00:16:55

  • ساخت ویرایشگر متن CKEditor

    منتشرشده 00:21:49

  • ایجاد فیلدهای ویژگی های محصول

    منتشرشده 00:16:14

  • افزودن مقادیر ویژگی برای محصول

    منتشرشده 00:21:09

  • دریافت و ویرایش ویژگی های ثبت شده برای محصول

    منتشرشده 00:09:48

  • گالری تصاویر محصولات

    منتشرشده 00:00:00

  • حذف تصویر محصول و همچنین تنظیم به عنوان تصویر اصلی

    منتشرشده 00:11:00

  • صفحه مدیریت تخفیف ها

    منتشرشده 00:21:00

  • ایجاد صفحه افزودن تخفیف

    منتشرشده 00:14:46

  • افزودن کد تخفیف - ارسال پراپ با Outlet

    منتشرشده 00:11:28

  • ویرایش و حذف کدهای تخفیف

    منتشرشده 00:15:12

  • شروع بحث مجوز دسترسی مدیران - دریافت لیست مجوز ها

    منتشرشده 00:14:21

  • صفحه مدیریت نقش ها

    منتشرشده 00:08:02

  • افزودن نقش جدید

    منتشرشده 00:09:32

  • ویرایش نقش ها

    منتشرشده 00:17:53

  • ورود به صفحه کاربران + حذف نقش

    منتشرشده 00:16:18

  • ورود به صفحه افزودن کاربر

    منتشرشده 00:13:46

  • افزودن کاربر جدید

    منتشرشده 00:21:49

  • ویرایش و حذف کاربر

    منتشرشده 00:06:01

  • استفاده از ریداکس برای ذخیره اطلاعات کاربر در استیت گلوبال

    منتشرشده 00:24:30

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

    منتشرشده 00:16:08

  • تعریف Rout ها با توجه به سطح دسترسی کاربر

    منتشرشده 00:10:19

  • ساخت هوک شخصی برای مدیریت دسترسی ها

    منتشرشده 00:10:46

  • مدیریت آیتم های منو با مجوزهای دسترسی

    منتشرشده 00:15:18

  • مدیریت آیکون عملیات با توجه به مجوز دسترسی

    منتشرشده 00:15:57

  • پابلیش پروژه های ری اکتی

    منتشرشده 00:09:21

  • صفحه مدیریت نحوه ارسال

    منتشرشده 00:10:18

  • نمایش و حذف سبد خرید

    منتشرشده 00:10:51

  • افزودن سبد خرید - نصب و استفاده از پکیج react-select-search

    منتشرشده 00:23:04

  • ویرایش سبد خرید

    منتشرشده 00:21:14

  • ساخت صفحه سفارشات

    منتشرشده 00:09:52

  • افزودن سفارش

    منتشرشده 00:23:49

  • صفحه داشبورد (محصولات رو به اتمام)

    منتشرشده 00:12:41

  • صفحه داشبورد (کارد های آمار فروش)

    منتشرشده 00:10:21

  • صفحه داشبورد (نمودار وضعیت فروش یک ساله)

    منتشرشده 00:13:49

    • پیشنیاز های دوره چه چیزهایی هستند؟

    • آموزش جاوا اسکریپت آکادمی کدیاد
    • آموزش HTML و CSS آکادمی کدیاد
    • آموزش الگوریتم و فلوچارت آکادمی کدیاد

    نظرات دانشجویان

    محمدرضا صنعتی

    محمدرضا صنعتی | دانشجوی دوره آموزش جامع و پروژه محور ری اکت (React)

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

    وحید سعید

    وحید سعید | دانشجوی دوره آموزش جامع و پروژه محور ری اکت (React)

    خوب دوس دارم نظرم رو راجب دوره برای کسانی که میخوان تهیه کنن بنویسم من تا اینجا 130 قسمت از دوره رو دیدم می تونم بگم جامع ترین و کامل ترین دوره ری اکتی هست که من تونستم پیدا کنم بر خلاف دوره های زیادی که فقط یه سری مطالب کلی میگن راجب ری اکت این دوره ریز جزئیات رو به صورت عملی حتی کوچک ترین ارور هارو پوشش میده و شما اگر به تمام مطالب مسلط باشید واقعا ری اکت کارید اما به هیچ وجه اسون نیست و کلا برنامه نویسی سخته و البته ری اکت ، از شروع دوره اگر وقت دارید عجله ندارید هر قسمت رو چندین بار ببینید و کد بزنید تا بهترین استفاده رو داشته باشید با تشکر از استاد دانا و مسلط دوره جناب بساکی عزیز

    ایلیا طاهر

    ایلیا طاهر | دانشجوی دوره آموزش جامع و پروژه محور ری اکت (React)

    سلام استاد اموزش ها فوق العاده عالی هستش🌹🌹❤

    میلاد رئوف

    میلاد رئوف | دانشجوی دوره آموزش جامع و پروژه محور ری اکت (React)

    سلام جناب بساکی خسته نباشید ، تشکر بابت دوره ی خوبتون من تازه دوره رو شروع کردم و این آدرس اولین پروژه ی دوره ، داخل گیت هابه https://github.com/MiladRaouf/timer-miniproject-react

    Alaeddin Bahrami

    Alaeddin Bahrami | دانشجوی دوره آموزش جامع و پروژه محور ری اکت (React)

    سلام استاد خسته نباشید ممنون بابت دوره خوبتون من تازه ریکت رو شروع کردم و اینم لینک ریپوزیتوری تمرین جلسه 11 https://github.com/yusefbahrami/react-Chronometer

    محمد میراث احمدی

    محمد میراث احمدی | دانشجوی دوره آموزش جامع و پروژه محور ری اکت (React)

    سلام تا این جای پروژه عالی بود خیلی ممنون فقط یک موردی میخواستم بگم که اگه امکانش هست به پروژه اضافه بشه اونم deploy کردن پروژه روی سرور ویندوز iis

    نادر راستگو

    نادر راستگو | دانشجوی دوره آموزش جامع و پروژه محور ری اکت (React)

    خیلی متشکرم از زحمات شما تا به اینجا خیلی جالب و قابل درک است

    AliTitan 0508

    AliTitan 0508 | دانشجوی دوره آموزش جامع و پروژه محور ری اکت (React)

    تشکر میکنم از شما بخاطر زمان و انرژی که برا ما میزارین ♡ واقعا قیمت واقعی این دوره میتونه حتی بالای یک میلیون باشه ! و سال جدید رو به شما و خانواده محترمتون تبریک میگم و سال خوبی رو برای شما ارزومندم

    مدرس دوره

    قاسم بساکی


    عاشق برنامه نویسی

    عاشق یادگیری

    عاشق تدریس و انتقال علم

    رزومه

    سوالات متداول

    ری اکت چیست؟

    React یک کتابخانه‌ی جاوا اسکریپتی است که برای ساخت یوزر اینترفیس یا همان رابط کاربری مورد استفاده قرار می‌گیرد

    چرا یادگیری ری اکت ساده است ؟

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

    برای یادگیری ری اکت چه پیش‌نیازهایی لازم است؟

    مبانی جاوا اسکریپت, برنامه‌نویسی شیء گرا, آشنایی با الگوریتم‌ها, آشنایی با Flex