آموزش React Hooks - Master React Hooks Development

React Hooks Tutorial - Master React Hooks Development

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
توضیحات دوره: Master React Hooks را به روش درست انجام می دهد. بیاموزید که آنها چه هستند، چگونه زیر سرپوش کار می کنند، و چرا اینقدر انقلابی هستند! به روز شده برای 2022-2023: نحوه کدنویسی با React JS و React Hooks را از یک مهندس با بیش از 5 سال تجربه در صنعت بیاموزید. نحوه کدنویسی با قلاب های React: useState، useEffect، useReducer، useContext و موارد دیگر. درک دلیل معرفی قلاب های React. آگاهی از نحوه عملکرد قلاب های React در زیر هود در موتور React و لایه زمان اجرا. درک اینکه چگونه React hooks با مدل ذهنی React بهتر از الگوهای دیگر مطابقت دارد. نحوه تنظیم واکشی داده با الگوی React hooks. نحوه ساخت برنامه های کامل React با استفاده از هوک. پیش نیازها: تجربه کمی با React کمک خواهد کرد. این دوره بلافاصله به قلاب های React می پردازد و ممکن است برای تازه واردان React سریع باشد. آشنایی با جاوا اسکریپت. تجربه خط فرمان

اگر می‌خواهید در مورد React Hooks به روشی کارآمد و کامل بیاموزید، باید این دوره را بگذرانید.


React Hooks چیست؟

قلاب‌های React بزرگترین به‌روزرسانی React از زمان شروع آن هستند.

قلاب ها راهی برای اجزای تابع برای "قلاب کردن" به عملکرد React هستند. قبلاً، وقتی می‌خواستید اجزای React حالت یا عوارض جانبی داشته باشند، باید کلاس React Component پایه را گسترش دهید. اکنون، اجزای تابع برای به دست آوردن این قابلیت فقط باید یک قلاب اعمال کنند.


آیا باید به قلاب ها اهمیت بدهم؟

به‌عنوان یک توسعه‌دهنده وب و React و مهندس نرم‌افزار، قطعاً باید به قلاب‌های React اهمیت دهید. این ویژگی آینده React است. از آنجایی که این ویژگی هنوز بسیار جدید است، یادگیری React hooks شما را به عنوان یک توسعه دهنده و مهندس وب متمایز می کند.


*****

وقتی برای اولین بار کاوش هوک ها را شروع کردم، از سادگی API شگفت زده شدم. انتظار داشتم به یک تغییر ذهنی عظیم نیاز داشته باشم. اما همانطور که به ایجاد اجزای جدید با قلاب ادامه دادم، شروع به دیدن قدرت پارادایم جدید کردم. در هر صورت، من React را حتی زیباتر از قبل می دانم!


*****

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

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

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

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

  • نحوه عملکرد قلاب ها در زیر کاپوت را بیاموزید. برای کدنویسی با هوک، نیازی به فرو رفتن عمیق در موتور React نیست. اما بررسی نحوه عملکرد React در زیر لایه سطحی بسیار مفید است. بنابراین، این دوره عمیق‌تر می‌شود و این موضوع را از دیدگاه React with hooks به شما ارائه می‌دهد.

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

  • به تصویر بزرگ نگاه کنید و به این سوال پاسخ دهید که چرا. چرا قلاب ها به React معرفی شدند - یک چارچوب از قبل به خوبی تثبیت شده؟ در طول دوره، در ویدیوهای مختلف پاسخ را به صورت جزئی دریافت خواهید کرد. علاوه بر این، بخشی به طور کامل به پاسخ دادن به این موضوع اختصاص داده خواهد شد.

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


*****

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

آنجا شما را می بینم!


*****

موسیقی تبلیغاتی ارائه شده توسط Ben Sound.


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

معرفی Introduction

  • آنچه از این دوره دریافت خواهید کرد What You’ll Get From this Course

  • بررسی مفاهیم اصلی React React Core Concepts Review

  • بررسی مفاهیم اصلی React React Core Concepts Review

  • مورد نیاز: نصب نرم افزار و دوره آموزشی Required: Software Installations and Course Repo

  • مورد نیاز: نصب نرم افزار و دوره آموزشی Required: Software Installations and Course Repo

  • اختیاری برای ویندوز: زیرسیستم ویندوز را برای لینوکس و VSCode نصب کنید Optional For Windows: Install Windows Subsystem for Linux and VSCode

معرفی Introduction

  • آنچه از این دوره دریافت خواهید کرد What You’ll Get From this Course

  • اختیاری برای ویندوز: زیرسیستم ویندوز را برای لینوکس و VSCode نصب کنید Optional For Windows: Install Windows Subsystem for Linux and VSCode

پروژه یک - شیرجه رفتن به توسعه قلاب Project One - Dive into Hooks Development

  • پیش نمایش پروژه یک Project One Preview

  • راه اندازی پروژه یک | تجدید نظر شده است Set Up Project One | Revised

  • اولین هوک: UseState | تجدید نظر شده است First Hook: UseState | Revised

  • اولین هوک: UseState | تجدید نظر شده است First Hook: UseState | Revised

  • UseEffect UseEffect

  • UseEffect UseEffect

  • چالش و کد: کامپوننت داستان ها با UseEffect | تجدید نظر شده است Challenge and Code: Stories Component with UseEffect | Revised

  • چالش و کد: کامپوننت داستان ها با UseEffect | تجدید نظر شده است Challenge and Code: Stories Component with UseEffect | Revised

  • ساخت یک قلاب سفارشی: useFetch Build a Custom Hook: useFetch

  • [اختیاری] کلمه کلیدی تابع در مقابل توابع پیکان [Optional] Function Keyword vs Arrow Functions

  • خلاصه بخش و کد بخش Section Summary and Section Code

پروژه یک - شیرجه رفتن به توسعه قلاب Project One - Dive into Hooks Development

  • پیش نمایش پروژه یک Project One Preview

  • راه اندازی پروژه یک | تجدید نظر شده است Set Up Project One | Revised

  • ساخت یک قلاب سفارشی: useFetch Build a Custom Hook: useFetch

  • [اختیاری] کلمه کلیدی تابع در مقابل توابع پیکان [Optional] Function Keyword vs Arrow Functions

قلاب زیر کاپوت Hooks Under the Hood

  • پیش نمایش بخش - قلاب های زیر سرپوش Section Preview - Hooks Under the Hood

  • پیش نمایش بخش - قلاب های زیر سرپوش Section Preview - Hooks Under the Hood

  • React Runtime و How React Applies Hooks The React Runtime and How React Applies Hooks

  • UseState Under the Hood UseState Under the Hood

  • UseState Under the Hood UseState Under the Hood

  • مولفه وظایف بخش 1: قلاب های حالت چند منظوره Tasks Component Part 1: Multiple useState hooks

  • مولفه وظایف بخش 1: قلاب های حالت چند منظوره Tasks Component Part 1: Multiple useState hooks

  • بخش وظایف بخش 2 Tasks Component Part 2

  • بخش وظایف بخش 2 Tasks Component Part 2

  • ترتیب استفاده از وضعیت The Order of UseState

  • فضای ذخیره‌سازی محلی برای Tasks Local Storage for Tasks

  • فضای ذخیره‌سازی محلی برای Tasks Local Storage for Tasks

  • خلاصه بخش و کد بخش Section Summary and Section Code

قلاب زیر کاپوت Hooks Under the Hood

  • React Runtime و How React Applies Hooks The React Runtime and How React Applies Hooks

  • ترتیب استفاده از وضعیت The Order of UseState

  • خلاصه بخش و کد بخش Section Summary and Section Code

Project One ادامه دارد - React Hooks را بیشتر بیاموزید Project One Continued - Learn More React Hooks

  • قلاب با فاصله Hooks with an Interval

  • جلوه ها با پاکسازی Effects with Cleanup

  • تاخیر و افزایش دینامیک Dynamic Delay and Increment

  • تاخیر و افزایش دینامیک Dynamic Delay and Increment

  • چالش و کد: جزء ماتریس Challenge and Code: Matrix Component

  • ساخت یک قلاب سفارشی: useDynamicTransition Build a Custom Hook: useDynamicTransition

  • خلاصه بخش و کد بخش Section Summary and Section Code

Project One ادامه دارد - React Hooks را بیشتر بیاموزید Project One Continued - Learn More React Hooks

  • قلاب با فاصله Hooks with an Interval

  • جلوه ها با پاکسازی Effects with Cleanup

  • چالش و کد: جزء ماتریس Challenge and Code: Matrix Component

  • ساخت یک قلاب سفارشی: useDynamicTransition Build a Custom Hook: useDynamicTransition

  • خلاصه بخش و کد بخش Section Summary and Section Code

انعکاس در هوک - چرا Reflection on Hooks - the Why

  • چرا قلاب The Why of Hooks

انعکاس در هوک - چرا Reflection on Hooks - the Why

  • چرا قلاب The Why of Hooks

پروژه دوم - توسعه استاد قلاب Project Two - Master Hooks Development

  • پیش نمایش پروژه دو Project Two Preview

  • نمای کلی الگوی کاهش دهنده The Reducer Pattern Overview

  • راه اندازی برنامه واکنش Set Up Reaction App

  • راه اندازی برنامه واکنش Set Up Reaction App

  • حالت کاهش دهنده واکنش ها Reactions Reducer State

  • حالت کاهش دهنده واکنش ها Reactions Reducer State

  • UseReducer for Tasks | قسمت 1 UseReducer for Tasks | Part 1

  • UseReducer for Tasks | قسمت 2 UseReducer for Tasks | Part 2

  • کامپوننت PublishMessage PublishMessage Component

  • چالش و کد: کامپوننت MessageBoard Challenge and Code: MessageBoard Component

  • UseContext و یک قلاب زمینه سفارشی UseContext and a Custom Context Hook

  • معماری PubSub و Reducer The PubSub and Reducer Architecture

  • PubNub را کاوش کنید Explore PubNub

  • عملکرد PubSub و اتصال Reducer PubSub Function and Reducer Connection

  • عملکرد PubSub و اتصال Reducer PubSub Function and Reducer Connection

  • نام کاربری را تنظیم کنید Set Username

  • کامپوننت CreateReaction CreateReaction Component

  • کامپوننت CreateReaction CreateReaction Component

  • جریان کاهش دهنده واکنش ها Reactions Reducer flow

  • جریان کاهش دهنده واکنش ها Reactions Reducer flow

  • واکنش ها را منتشر کنید Publish Reactions

  • واکنش ها را منتشر کنید Publish Reactions

  • کامپوننت MessageReactions MessageReactions Component

  • خلاصه بخش و کد بخش Section Summary and Section Code

  • خلاصه بخش و کد بخش Section Summary and Section Code

پروژه دوم - توسعه استاد قلاب Project Two - Master Hooks Development

  • پیش نمایش پروژه دو Project Two Preview

  • نمای کلی الگوی کاهش دهنده The Reducer Pattern Overview

  • UseReducer for Tasks | قسمت 1 UseReducer for Tasks | Part 1

  • UseReducer for Tasks | قسمت 2 UseReducer for Tasks | Part 2

  • کامپوننت PublishMessage PublishMessage Component

  • چالش و کد: کامپوننت MessageBoard Challenge and Code: MessageBoard Component

  • UseContext و یک قلاب زمینه سفارشی UseContext and a Custom Context Hook

  • معماری PubSub و Reducer The PubSub and Reducer Architecture

  • PubNub را کاوش کنید Explore PubNub

  • نام کاربری را تنظیم کنید Set Username

  • کامپوننت MessageReactions MessageReactions Component

  • خلاصه بخش و کد بخش Section Summary and Section Code

محتوای مرجع اختیاری: مرور کلی مگا جاوا اسکریپت Optional Reference Content: Mega JavaScript Overview

  • قسمت 1 مروری بر مگا جاوا اسکریپت اختیاری Optional Mega JavaScript Overview Part 1

  • قسمت 2 مروری بر مگا جاوا اسکریپت اختیاری Optional Mega JavaScript Overview Part 2

محتوای مرجع اختیاری: مرور کلی مگا جاوا اسکریپت Optional Reference Content: Mega JavaScript Overview

  • قسمت 1 مروری بر مگا جاوا اسکریپت اختیاری Optional Mega JavaScript Overview Part 1

  • قسمت 2 مروری بر مگا جاوا اسکریپت اختیاری Optional Mega JavaScript Overview Part 2

نتیجه Conclusion

  • تبریک و اظهارات پایانی Congratulations and Final Remarks

  • محتوای پاداش! Bonus Content!

  • محتوای پاداش! Bonus Content!

نتیجه Conclusion

  • تبریک و اظهارات پایانی Congratulations and Final Remarks

نمایش نظرات

نظری ارسال نشده است.

آموزش React Hooks - Master React Hooks Development
خرید اشتراک و دانلود خرید تکی و دانلود | 160,000 تومان (5 روز مهلت دانلود) زمان تقریبی آماده سازی لینک دانلود این دوره آموزشی حدود 5 تا 24 ساعت می باشد.
جزییات دوره
5.5 hours
49
Udemy (یودمی) udemy-small
03 آبان 1401 (آخرین آپدیت رو دریافت می‌کنید، حتی اگر این تاریخ بروز نباشد.)
3,652
4.7 از 5
دارد
دارد
دارد

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

David Joseph Katz David Joseph Katz

مهندس نرم افزار

Udemy (یودمی)

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

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