کتاب Designing React Hooks the Right Way

کتاب Designing React Hooks the Right Way یا طراحی هوک‌های ری‌اکت با روشی صحیح، برای افراد حرفه‌ای و یا حتی تازه‌کار که به تازگی به برنامه‌نویسی وب و به خصوص چارچوب React روی آورده‌اند مناسب می‌باشد. این کتاب در 10 فصل به بیان نکات مهم و کاربردی React و هوک‌های آن خواهد پرداخت.

مروری کوتاه بر کتاب Designing React Hooks the Right Way:

با React Hooks آشنا شوید و Hook سفارشی خود را برای مدیریت وضعیت های برنامه برای تصمیم گیری بهتر در معماری سایت طراحی کنید.

ویژگی‌های کلیدی کتاب Designing React Hooks the Right Way

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

توضیحات کتاب Designing React Hooks the Right Way:

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

کتاب Designing React Hooks the Right Way با یک راه‌حل سفارشی شروع می‌شود تا نشان دهد که چرا هوک در وهله اول مورد نیاز است. با موتور React آشنا خواهید شد و خواهید فهمید که چگونه هر هوک داخلی می‌تواند یک مقدار ثابت را با اتصال به آن مدیریت کند. شما طراحی و پیاده‌سازی هر هوک را با کد دنبال خواهید کرد تا درک کاملی به دست آورید. در نهایت، شما با مشکلات هر هوک مقابله خواهید کرد و خواهید فهمید که چگونه می‌توانید به طور مؤثر بر آن‌ها غلبه کنید.

در پایان این کتاب React، اعتماد به نفس ایجاد و نوشتن Hooks برای توسعه برنامه‌های کاربردی وب کارآمد و کاربردی در مقیاس را به دست خواهید آورد.

بیشتر بخوانید: معرفی قالب های رایگان React

آنچه در کتاب Designing React Hooks the Right Way خواهید آموخت:

• قلاب‌های خود را متناسب با مدیریت نیاز حالت (State) خود ایجاد کنید
• اندازه پنجره فعلی وب‌سایت خود را با استفاده از useEffect تشخیص دهید
• با استفاده از useMemo اقدامی را برای بهبود عملکرد رابط کاربری (UI) انجام دهید
• با استفاده از useContext یک پیکربندی جهانی سایت ایجاد کنید
• با استفاده از useRef از نشت حافظه برنامه که به سختی پیدا می‌شود جلوگیری کنید
• یک لایه داده API ساده و مؤثر با استفاده از Hooks سفارشی طراحی کنید

در ادامه مقدمه‌ای از کتاب Designing React Hooks the Right Way را از زبان نویسنده شرح خواهیم داد.

مقدمه‌ای بر کتاب Designing React Hooks the Right Way:

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

وقتی صحبت از رابط کاربری (UI) می‌شود، موضوع دیگری وجود دارد که می‌تواند به روشی مشابه برای شما مفید باشد. این حالت است. از jQuery و Angular گرفته تا React، از وب تا سایر پلتفرم‌های غیر دسکتاپ (مانند Electron یا React Native)، مهم نیست کجا می‌روید، یک سوال فنی وجود دارد که اکنون باید به آن پاسخ دهید – صفحه نمایش از کجا می‌داند که تغییری وجود دارد. بکار گرفتن؟ وقتی به دانشگاه برگشتم، هرگز این نوع سوال را نپرسیدم. من عموماً تصور می‌کردم که رایانه به همین شکل کار می‌کند.

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

در کتاب Designing React Hooks the Right Way، با استفاده از React به‌عنوان فناوری زیربنایی، تلاش خواهم کرد تا نحوه معرفی و پیاده‌سازی حالت‌ها را بررسی و بیاموزم. امیدوارم با انجام این کار، در پایان تصویر بهتری برای پاسخ به این سوال داشته باشیم که چگونه یک موتور رندر توسط States رانده می‌شود؟

کتاب Designing React Hooks the Right Way برای چه کسی است؟

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

اگر تجربه ای با React یا حتی Hooks دارید، خوب است. کتاب Designing React Hooks the Right Way به شما نشان می دهد که چگونه هوک‌ها در مولفه تابع پیاده سازی می شوند. علاوه بر این، یک نسخه حذف شده از کد منبع React مربوط به هر Hook نیز در هر فصل گنجانده شده است، بنابراین اگر یک برنامه نویس با تجربه React باشید، درک عمیق تری خواهید داشت.

آنچه کتاب Designing React Hooks the Right Way پوشش می‌دهد:

فصل 1، معرفی مؤلفه تابع، توضیح می‌دهد که یک مؤلفه تابع چیست با توضیحی در مورد لوازم آن و رابطه اصلی والد/فرزند. سپس نکاتی در مورد نحوه نوشتن یک جزء تابع دریافت خواهید کرد. در پایان فصل، یک مثال کاربردی برای تابع Nav را خواهید دید.

فصل 2 کتاب Designing React Hooks the Right Way، ایجاد حالت‌ها در توابع، نحوه ایجاد یک متغیر ویژه به نام حالت در اجزای تابع را نشان می‌دهد. خواهیم دید که یک ایالت چه مزایایی می‌تواند ارائه دهد، از جمله درخواست به روز رسانی جدید و گوش دادن به تغییر ارزش. همچنین نمونه‌ای از اعمال یک حالت در یک برنامه تک صفحه‌ای (SPA) را خواهیم دید. همچنین نگاهی دقیق به نقش States در رابط کاربری خواهیم داشت.

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

فصل 4 کتاب Designing React Hooks the Right Way، استفاده از حالت برای پرش کامپوننت‌ها، قلاب‌های داخلی را پوشش می‌دهد، که با استفاده از هوک استفاده می‌شود. ابتدا نحوه استفاده از حالت در React را توضیح خواهیم داد و سپس ساختار داده و کد منبع پشت useState را مرور خواهیم کرد و همچنین کاربردهای رایج حالت‌های ارسال را شرح خواهیم داد. ما یک درایو آزمایشی به useState می‌دهیم و دو مثال عملی از اعمال useState در اجزای Avatar و Tooltip ارائه می‌دهیم.

فصل 5، استفاده از افکت برای کنترل عوارض جانبی، عوارض جانبی را معرفی می‌کند، ساختار داده و کد منبع پشت useEffect را مرور می‌کند، و سناریوهای مختلفی را ارائه می‌کند که در آن‌ها افکت‌ها را فراخوانی می‌کنید. ما همچنین چند تله استفاده از useEffect و راه های اجتناب از آن‌ها را نشان خواهیم داد. و ما از useEffect در دو مثال عملی، اندازه پنجره و Fetch API استفاده خواهیم کرد.

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

فصل 7 کتاب Designing React Hooks the Right Way، استفاده از زمینه برای پوشش یک منطقه، به‌روزرسانی‌های یک ناحیه و نحوه استفاده از زمینه‌های React برای اشتراک‌گذاری یک مقدار در یک منطقه را معرفی می‌کند. سپس، ساختار داده و کد منبع پشت useContext را برای مصرف مقدار مشترک مرور می‌کنیم. در پایان فصل هفتم از کتاب Designing React Hooks the Right Way، دو مثال عملی از کاربرد زمینه‌ها در یک تم و یک جدول ارائه می‌کنیم.

فصل 8، استفاده از Ref برای مخفی کردن مطالب، نحوه دسترسی به عنصر DOM از طریق یک ref را توضیح می‌دهد، و ما در طراحی و کد منبع پشت قلاب useRef توضیح خواهیم داد. همچنین نحوه کار با یک مقدار ثابت بدون ارسال به‌روزرسانی را شرح خواهیم داد. در نهایت، ما برای چند مشکل عملی، مانند کلیک کردن در خارج از منو، جلوگیری از نشت حافظه، راه‌اندازی یک Mule، و مکان‌یابی مقدار فعلی، رجعت‌ها را اعمال می‌کنیم.

فصل 9، استفاده از قلاب‌های سفارشی برای استفاده مجدد از منطق، تمام قلاب‌هایی را که تاکنون در مورد آن‌ها آموخته‌ایم جمع‌آوری می‌کند و توضیح می‌دهد که چگونه یک هوک سفارشی برای نیازهای خود ایجاد کنیم. ما Hook های سفارشی را معرفی می کنیم و سپس چند قلاب سفارشی را مرحله به مرحله می نویسیم، از جمله useToggle، useWindow، useAsync، useDebounced، useClickOutside، useCurrent و useProxy.

در فصل 10، ساخت یک وب سایت با React، React به طور کلی، به ویژه نقش React در توسعه وب، مورد بحث قرار می‌گیرد. ما از سه منظر به این موضوع می‌پردازیم تا ببینیم چگونه React منابع را برای ساخت یک سایت، از جمله ویژگی های JavaScript ES6، رویکردهای CSS-in-JS، و تبدیل از خطوط HTML-مانند به عبارات جاوا اسکریپت، کنار هم قرار می‌دهد.

بیشتر بخوانید: کتاب React: Up & Running

سرفصل‌های کتاب Designing React Hooks the Right Way:

• Foreword
• Contributors
• About the author
• About the reviewers
• Preface
• Chapter 1: Introducing the Function Component
• Chapter 2: Crafting States in Functions
• Chapter 3: Hooking into React
• Chapter 4: Use State to Jumpstart Components
• Chapter 5: Use Effect to Handle Side Effects
• Chapter 6: Use Memo to Boost Performance
• Chapter 7: Use Context to Cover an Area
• Chapter 8: Use Ref to Hide Stuff
• Chapter 9: Use Custom Hooks to Reuse Logic
• Chapter 10: Building a Website with React
• Index

فایل کتاب Designing React Hooks the Right Way را می‌توانید پس از پرداخت، دریافت کنید.