Адаптированный перевод статьи Джонатана Саринга «9 Bootstrap UI Component Libraries for 2018».
Bootstrap это самый популярный в мире фронтенд-фреймворк. Он содержит шаблоны типографики, форм, кнопок и других компонентов пользовательского интерфейса на основе HTML и CSS.
Чтобы помочь вам начать, мы собрали некоторые из лучших UI-наборов. Конечно, беспристрастным наш выбор назвать нельзя: он базируется на мнении членов сообщества.
С помощью Bit (GitHub) вы можете с легкостью сделать любую библиотеку разделяемой коллекцией индивидуальных компонентов, которые можно будет использовать и разрабатывать где угодно.
1. React Bootstrap
React Bootstrap это, пожалуй, самая популярная реализация Bootstrap компонентов, созданная с помощью React (14 тысяч звезд на GitHub, 300 тыс. скачиваний в неделю). Каждый компонент построен с нуля в качестве React-компонента. Для работы с существующими темами Bootstrap эти компоненты опираются только на таблицы стилей Bootstrap.
2. Reactstrap
Reactstrap это библиотека «React Bootstrap 4 компонентов без запоминания состояния», получившая на GitHub больше 6 тысяч звезд. Она не зависит от jQuery или Bootstrap Javascript, однако на них полагается Poppers.js, нужный для более продвинутого позиционирования контента.
3. Material Design React Bootstrap
Эта библиотека – набор компонентов React Bootstrap для Material Design. Компоненты предоставляют кросс-браузерную совместимость. Они прекрасно работают с Chrome, Firefox, Safari, Opera и Microsoft Edge. Чтобы помочь с проблемами выравнивания, включена поддержка системы Flexbox. Документация обширна и полезна. Познакомиться с проектом можно с помощью этого видео.
4. BootstrapVue
BootstrapVue это понятная и довольно популярная (6,5 тысяч звезд на GitHub) реализация компонентов Bootstrap 4 и grid-системы для Vue.js. Имеет обширную и автоматизированную разметку доступности WAI-ARIA. Библиотека создана для построения адаптивных, mobile-first веб-проектов с использованием Vue.js и Bootstrap 4. Она предоставляет два полезных vue-cli шаблона: webpack-simple и webpack.
5. UIV
Набор UI-компонентов Bootstrap 3, реализованный в Vue 2. Он довольно легковесный: все компоненты в Gzip весят примерно 20KB. Зависит только от Vue и Bootstrap CSS. Компненты можно импортировать по отдельности. Есть поддержка всех современных браузеров (IE 9+). SSR тоже поддерживается.
6. NG Bootstrap
Angular 6 и Bootstrap 4 это интересная комбинация для адаптивных макетов, создаваемых с помощью компонентов Angular. NG Bootstrap это библиотека UI-компонентов, написанная на TypeScript, со 100% покрытием тестами. Она буквально создана для успешной работы. Зависит она только от Angular и Bootstrap 4 CSS. Активно поддерживается.
7. AngularJS Bootstrap
Эта библиотека заработала 15 тысяч звезд на GitHub. Она представляет собой набор собственных директив AngularJS для Bootstrap с маленьким объемом (20kB в gzip) и без JS-зависимостей (jQuery, bootstrap JS). Скачать можно здесь, а посмотреть директивы – здесь.
8. NGX Bootstrap
NGX Bootstrap реализует виджеты Bootstrap 3 и 4 с помощью Angular. Этот проект получил на GitHub 4,5 тысячи звезд. Содержит все основные (и не только) Bootstrap-компоненты с использованием разметки и CSS, предоставляемых bootstrap, так что у вас не будет необходимости включать оригинальные JS-компоненты. Вы можете реализовывать собственные шаблоны и стили. Все компоненты созданы расширяемыми и адаптивными, со стандартной производительностью как для мобильных, так и для десктопных проектов. Испытать компоненты можно здесь.
[customscript]techrocks_custom_after_post_html[/customscript]
[customscript]techrocks_custom_script[/customscript]