Повысьте свою производительность с помощью 14 библиотек компонентов React
1 февраля 2024 г.Если вы создали несколько веб-приложений, скорее всего, вы создаете одни и те же компоненты снова и снова. Такие компоненты, как кнопки, элементы навигации, ползунки, модальные окна, всплывающие подсказки, оповещения, значки и т. д., часто повторно используются в большинстве современных веб-приложений.
Так зачем же каждый раз изобретать велосипед? Это повторяется и отнимает у вас много времени. А как насчет решения, в котором шаблон макета для компонентов уже существовал, и вы могли просто передать необходимые данные?
Другие разработчики тоже сталкивались с этой проблемой, поэтому многие библиотеки компонентов были созданы как решение, которое вы можете использовать и значительно улучшить рабочий процесс разработчика.
В этой статье я попытался составить полезный список некоторых из самых популярных библиотек компонентов React. С ними легко начать работу, и у них есть отличная документация.
1. chakra-ui
<блок-цитата>⭐ Звезды GitHub: 35 тысяч+
https://github.com/chakra-ui/chakra-ui
Простой, модульный и усилитель; Доступные компоненты пользовательского интерфейса для ваших приложений React.
2. material-ui
<блок-цитата>⭐ Звезды GitHub: более 90 тысяч
MUI – это простая и настраиваемая библиотека компонентов для создания более быстрых, красивых и доступных приложений React.
3. ant-design
<блок-цитата>⭐ Звезды GitHub: 89 тыс.+
https://github.com/ant-design/ant-design
Язык проектирования пользовательского интерфейса корпоративного класса и библиотека React UI. Написан на TypeScript с использованием предсказуемых статических типов. Мощная настройка темы во всех деталях.
4. semantic-ui-react
<блок-цитата>⭐ Звезды GitHub: 13 тыс.+
https://github.com/Semantic-Org/Semantic-UI-React
Semantic UI React — это официальная интеграция React для Semantic UI. Декларативный API, расширение, сокращенные реквизиты, подкомпоненты, автоматическое управление состоянием.
5. theme-ui
<блок-цитата>⭐ Звезды GitHub: 5 тыс.+
https://github.com/system-ui/theme-ui
Пользовательский интерфейс темы – это библиотека для создания пользовательских интерфейсов с возможностью оформления тем на основе принципов проектирования на основе ограничений.
6. react-bootstrap
<блок-цитата>⭐ Звезды GitHub: 22 тыс.+
https://github.com/react-bootstrap/react-bootstrap
Самый популярный интерфейсный фреймворк, переработанный для React. Каждый компонент был создан с нуля как настоящий компонент React без ненужных зависимостей, таких как jQuery.
7. fluent-ui
<блок-цитата>⭐ Звезды GitHub: 17 тысяч+
https://github.com/microsoft/fluentui
Веб-интерфейс Fluent UI представляет собой набор утилит, компонентов React и веб-компонентов для создания веб-приложений. Разработано Microsoft.
8. чертеж
<блок-цитата>⭐ Звезды GitHub: более 20 тысяч
https://github.com/palantir/blueprint
Blueprint — это набор инструментов пользовательского интерфейса на основе React для Интернета. Он оптимизирован для создания сложных веб-интерфейсов с большим объемом данных для настольных приложений, которые работают в современных браузерах и IE11. Это не набор инструментов для пользовательского интерфейса, ориентированный на мобильные устройства.
9. вечнозеленый
<блок-цитата>⭐ Звезды GitHub: 12 тысяч+
https://github.com/segmentio/evergreen
Evergreen содержит набор доработанных компонентов React, которые работают «из коробки» и построены на основе примитива пользовательского интерфейса React, обеспечивающего бесконечные возможности компоновки.
10. reactstrap
<блок-цитата>⭐ Звезды GitHub: более 10 тыс.
https://github.com/reactstrap/reactstrap
Reactstrap не встраивает свои собственные стили и вместо этого зависит от CSS-фреймворка Bootstrap в отношении своих стилей и темы. Это позволяет вам использовать единообразные стили для компонентов на основе React и статических частей вашего сайта.
11. eui
<блок-цитата>⭐ Звезды GitHub: 6 тыс.+
https://github.com/elastic/eui
Elastic UI Framework — это набор компонентов пользовательского интерфейса React для быстрого создания пользовательских интерфейсов в Elastic.
12. втулка
<блок-цитата>⭐ Звезды GitHub: 8 тыс.+
https://github.com/grommet/grommet
Платформа на основе React, обеспечивающая доступность, модульность, оперативность и темы в аккуратном пакете.
13. ребасинг
<блок-цитата>⭐ Звезды GitHub: 7 тыс.+
https://github.com/rebassjs/rebass
Примитивные компоненты пользовательского интерфейса React, созданные с помощью styled-system.
14. мантин
<блок-цитата>⭐ Звезды GitHub: 23 тыс.+
https://github.com/mantinedev/mantine
Создавайте полнофункциональные и доступные веб-приложения быстрее, чем когда-либо. Эта библиотека включает в себя более 120 настраиваемых компонентов и хуков, которые помогут вам в любой ситуации.
Вам понравились ресурсы? Вот еще 👇
За предыдущие месяцы я собрал The Ultimate Bundle со всеми необходимыми вам ресурсами: от начала обучения программированию до получения должности технического специалиста своей мечты!
Включает в себя более 900 ресурсов, разделенных на 99 категорий для упрощения навигации и доступа! Сэкономьте тысячи часов и сосредоточьтесь на том, что важно!
В настоящее время я предлагаю скидку 50% только для моих читателей! Не пропустите это!
⭐ Купите его здесь: Полный комплект ресурсов для получения работы в сфере технологий ! ⭐
В этот пакет входит:
- Более 150 учебных ресурсов для обучения программированию: обширная коллекция ресурсов, включая учебные пособия, статьи и руководства, которые помогут вам освоить программирование и языки программирования.
- Более 220 курсов для разработчиков от ведущих компаний и университетов. Огромный список курсов, предлагаемых авторитетными компаниями и университетами, охватывающих широкий спектр тем разработки для улучшения ваших навыков и знаний.
- 140+ сертификатов по программированию для улучшения вашего резюме. Получите ценные сертификаты по кодированию и программированию, которые могут значительно улучшить ваше резюме и продемонстрировать ваш опыт потенциальным работодателям.
- Более 110 технических стажировок для получения опыта: изучите широкий список технологических стажировок, которые предлагают реальный опыт, что позволит вам начать свою карьеру и заложить прочный фундамент в технологической отрасли. ли>
- 160+ основных принципов собеседования для соискателей работы в сфере технологий: подробное руководство, содержащее важные советы, стратегии и ресурсы, которые помогут вам подготовиться и успешно пройти собеседование в сфере технологий.
- Более 120 досок объявлений о вакансиях в сфере технологий: вы найдете работу своей мечты. Откройте для себя широкий спектр досок вакансий и платформ, специально предназначенных для технических специалистов, что упрощает поиск идеальной вакансии в технологической отрасли.< /ли>
⭐ Купите его здесь: Полный набор ресурсов для получения Работа в сфере технологий! ⭐
Писательское дело всегда было моей страстью, и мне доставляет удовольствие помогать людям и вдохновлять их. Если у вас есть вопросы, обращайтесь!
Подписавшись на мою рассылку!
Также свяжитесь со мной в Twitter, LinkedIn и GitHub!< /п>
Также опубликовано здесь.
Оригинал