مقاله

عناصر مفید React (کتابخانه ها و ابزارها)

در این مقاله به معرفی تعدادی از کتابخانه ها و ابزار های مفید React می پردازیم.

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

۱ . UI-Router for React

عناصر مفید React (کتابخانه ها و ابزارها) 2

UI-Router برای React مسیریابی مبتنی بر حالت را برای برنامه ها فراهم می کند. به عنوان نمونه، به جای ساخت یک وب سایت سنتی، این جزء باعث می شود که از راه حالت های مختلف یک برنامه React با هر پیج ای که دارای محتوای ویژه خود است، حرکت کند. همینطور که کاربر در حال حرکت است، برنامه آدرس اینترنتی براوزر را ویرایش می دهد و به یوزر ها اجازه می دهد تا پیجها ویژه ای را نمایش دهند. UI-Router یک برنامه ی ساده و کاربردی است فوق العاده فوری است.

۲ . React-Bootstrap

عناصر مفید React (کتابخانه ها و ابزارها) 3

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

۳ . Material-UI

عناصر مفید React (کتابخانه ها و ابزارها) 4

به دنبال استفاده از طراحی مواد Google در ارتباط با React هستید؟ Material-UI مجموعه ای از اجزای React است که این کار را انجام می دهد. شما می توانید یک مجموعه ی گسترده ای از اجزای مفید مانند برنامه های کاربردی، مدالها، دکمه ها، کارت ها، جعبه های گفتگو، آیکون ها، منوها، لغزنده ها و موارد دیگر که در React را که به وسیله از اصول طراحی مواد نوشته شده اند پیدا کنید.

۴ . Gatsby.js

عناصر مفید React (کتابخانه ها و ابزارها) 5

با LWith Gatsby.js شما میتوانید وب‌سایت های استاتیک را به وسیله از React ساخت کنید. کتابخانه اجازه می دهد تا شما داده ها را از منابع مختلف مانند CMS گزینه علاقه خود، API، دیتابیس و یا حتی یک سامانه فایل بکشید. سایت ها می توانند از راه خط فرمان یا دیگر مسدود های “starter” برای کمک به سرعت بخشیدن در روند کارتان ایجاد شوند.

۵ . styled-components

عناصر مفید React (کتابخانه ها و ابزارها) 6

کامپوننت های سبک به شما در سبک سازی واکنش کامپوننت ها به وسیله از کد CSS کمک می کنند. کد. همچنین نقشه‌برداری بین اجزا و سبک‌ها را پاک می‌کند، کهکل فرآیند را ساده‌تر می‌کند.

۶ . React Sketch.app

عناصر مفید React (کتابخانه ها و ابزارها) 7

React Sketch.app، ساخت اسناد قابل استفاده مجدد که از اجزای React در Sketch استفاده می کنند را قادر می سازد. این به وسیله Airbnb ساخته شده تا به مدیریت سامانه طراحی خود کمک کند و برای استفاده از اجزای واقعی React در طرح های شما اجازه می دهد. این یک ابزار واقعا قوی است که به شما کمک می کند تا مثال های بهتر را ایجاد کنید.

۷ . React Virtualized

عناصر مفید React (کتابخانه ها و ابزارها) 8

React Virtualized کمک می کند فهرست ها و جداول اسکرول طولانی را در حالت جذاب و بسیار قابل ست آپ برای یوزر ها به ارمغان می آورد. ارتفاع ردیف ثابت یا پویا را ست آپ می کند، به یوزر ها اجازه می دهد تا به ردیف های ویژه ای رفته و متغیرهایی را نشان دهند که پیمایش در آن ها انجام می شود.

۸ . Blueprint

Blueprint یک جعبه رابط کاربری است که شامل مجموعه‌ای از اجزای React است.
این مجموعه شامل عناصر اساسی است که هر برنامه نیاز دارد مانند دکمه ها، آیکون ها و سامانه های ناوبری مختلف. ظاهر آن با Sass طراحی شده، بنابراین شما می توانید عناصر را به دلخواه سفارشی کنید.

۹ . Recharts

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

۱۰ . React DnD

با React DnD می توانید رابط های کشیدن و رها سازی پیچیده را به وسیله از اجزای React ساخت کنید. داده ها را می توان بر اساس رویداد های کشیدن و رها کردن انتقال داده و اجزای آنها می توانند بر اساس وضعیت آنها ویرایش کنند.

بیشتر بخوانید  راهکارهایی برای بهینه سازی WordPress

منبع

برچسب ها
نمایش بیشتر

نوشته های مشابه

پاسخی بگذارید

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