برنامه نویسی 470 بازدید

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

فهرست مقاله‌های آموزشی

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

مقالات نظری

در این مطلب مفاهیم اساسی جاوا اسکریپت مدرن برای استفاده از React معرفی شده‌اند که شامل معرفی متغیرها، تابع‌های Arrow، همچنین Rest و Spread، تخریب شیء و آرایه، الفاظ قالبی، کلاس‌ها، Callback-ها، Promise-ها، و ماژول‌های ES می‌شود.

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

در این بخش از سری مقالات آموزش ری‌اکت موضوعات جی‎اس‌ایکس (JSX)، کامپوننت‌ها، حالت یا State، مشخصه‌ها یا Props، کامپوننت‌های ارائه‌ای در برابر کانتینری، State در برابر Props، انواع Prop، فرگمان ری‌اکت، رویدادها و رویدادهای چرخه عمر صحبت کردیم. JSX یک فناوری معرفی شده از سوی React است. با این که React بدون استفاده از JSX نیز کاملاً به خوبی عمل می‌کند، اما JSX یک فناوری ایده‌آل برای کار با کامپوننت‌ها محسوب می‌شود و از این رو در ری‌اکت استفاده زیادی از آن می‌کنیم. شاید در ابتدا به نظر بیاید که JSX مانند ترکیب کردن HTML و جاوا اسکریپت است، اما این حرف صحیح نیست. چون وقتی از JSX استفاده می‌کنیم، در واقع از یک ساختار اعلانی برای نوشتن UI یک کامپوننت بهره می‌گیریم.

در بخش چهارم سری مقالات آموزش ری‌اکت در خصوص برخی از مفاهیم پیشرفته این فریمورک شامل فرم‌ها در ری‌اکت، ارجاع به یک عنصر DOM، رندرینگ سمت سرور، «API زمینه» (Context API)، «کامپوننت‌های درجه بالا» (Higher order components)، رندر Props، «قلاب‌ها» (Hooks) و «افراز کد» (Code splitting) صحبت کردیم. بدین ترتیب مباحث نظری فریمورک ری‌اکت به پایان می‌رسد و در بخش‌های بعدی بیشتر روی موضوعات عملی تمرکز کرده‌ایم.

مقالات عملی

در این بخش از سری مقالات آموزشی ری‌اکت با ارائه مثالی از یک اپلیکیشن ساده شمارنده به پیاده‌سازی موارد نظری آموزش داده شده پرداختیم. در این مثال خلاصه، یک اپلیکیشن بسیار ساده شمارنده در ری‌اکت ساختیم و بسیاری از مفاهیم و نظریه‌هایی که در بخش‌های قبلی معرفی کرده‌ایم را در آن به کار گرفتیم. همچنین مثالی از واکشی و نمایش اطلاعات کاربران گیت‌هاب از طریق API ارائه کردیم. در این مثال کاملاً ساده یک فرم را نمایش می‌دهیم که اقدام به پذیرش نام کاربری گیت‌هاب می‌کند و زمانی که رویداد submit را دریافت کرد، از API گیت‌هاب تقاضا می‌کند که اطلاعات کاربر را ارائه کرده و در ادامه آن را نمایش دهد.

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

در این بخش از سری مقالات آموزش React با Babel و Webpack که به بسته‌بندی و آماده‌سازی کد اپلیکیشن‌های ری‌اکت برای توزیع کمک می‎کنند آشنا خواهید شد. Babel ابزاری جذاب است که مدت‌ها از زمان معرفی آن می‌گذرد و امروزه تقریباً همه توسعه‌دهندگان جاوا اسکریپت از آن بهره می‌گیرند. این وضعیت در آینده نیز تداوم خواهد داشت، زیرا Babel اینک بخشی جدایی‌ناپذیر از جاوا اسکریپت محسوب می‌شود و مشکل بزرگی را برای افراد زیادی حل کرده است. Webpack نیز ابزاری است که امکان کامپایل کردن ماژول‌های جاوا اسکریپت را فراهم می‌کند و به نام module bundler نیز مشهور است. اگر تعداد بالایی از فایل‌ها داشته باشیم، Webpack می‌تواند یک فایل منفرد (یا چند فایل معدود) تولید کند که به اجرای اپلیکیشن شما می‌پردازند.

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

اکوسیستم شکل‌گرفته پیرامون ری‌اکت بسیار بزرگ است. در این مقاله که آخرین مقاله از سری مقالات نه‌گانه آموزش ری‌اکت محسوب می‌شود، 4 مورد از محبوب‌ترین پروژه‌ها بر مبنای React یعنی React Router ،Redux ،Next.js و Gatsby را معرفی می‌کنیم. در این نوشته به جمع‌بندی مباحث مطرح‌شده پرداخته‌ایم.

جمع‌بندی

ری‌اکت در سال 2011 از سوی یکی از مهندسان فیسبوک به نام «جردن ووک» (Jordan Walke) ایجاد شد. این کتابخانه نخستین بار در سال 2011 در نیوزفید فیسبوک و سپس در سال 2012 در اینستاگرام استفاده شد. کتابخانه مذکور در می 2013 به صورت متن باز عرضه شده است. React Native که امکان توسعه اپلیکیشن‌های اندروید و iOS را فراهم ساخته است در سال 2015 از سوی فیسبوک به صوت متن باز عرضه شد. در سال 2017 فیسبوک React Fiber را معرفی کرد که الگوریتم مرکزی جدید کتابخانه فریمورک ری‌اکت برای ساخت رابط‌های کاربری است. ری‌اکت فیبر به بنیادی برای هر گونه توسعه و بهبود آتی فریمورک ری‌اکت تبدیل خواهد شد. آخرین نسخه از فریمورک ری‌اکت با شماره 16.8.4 در 5 مارس 2019 عرضه شده است.

اگر این مطلب برای شما مفید بوده است، آموزش‌های زیر نیز به شما پیشنهاد می‌شوند:

==

telegram
twitter

میثم لطفی

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

بر اساس رای 2 نفر

آیا این مطلب برای شما مفید بود؟

نظر شما چیست؟

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *