Топ 20: Лучшие открытые исходные коды Vue.js UI Frameworks

Чтобы начать работать с Vue, вам нужны только знания JavaScript и HTML. С этими базовыми навыками вы можете начать создавать простые приложения через пару часов после официального руководства. Каждый разработчик, начинающий с нового проекта, знает, насколько трудоемким может быть процесс разработки собственных элементов пользовательского интерфейса. Как и у каждого фреймворка, существуют дополнительные библиотеки для ускорения разработки, такие как UI Kits. Vue.js не является исключением, поскольку существует множество наборов пользовательского интерфейса, которые вы можете начать использовать с нуля в своем проекте, выполнив пару команд в своем терминале, чтобы включить их в свой проект.

В этом топе мы собрали 20 наиболее впечатляющих наборов пользовательского интерфейса с открытым исходным кодом, которые вы можете начать использовать в своем новом проекте, чтобы обеспечить потрясающий пользовательский опыт и, как следствие, увеличить время разработки вашего проекта. Наслаждайся ими !

20. Офисный интерфейс Fabric Vue

Github

Офисный интерфейс Vue.js

Этот каркас представляет собой реализацию Office UI Fabric для Vue.js, созданную с офис-щ-ткань-JS, набор JavaScript-компонентов для создания приложений для Office и Office 365.

19. Vuestrap

Github

Vuestrap

Базовые компоненты Vuestrap расширяют Bootstrap 4. Построен с использованием vuestrap, простого Vue.js и Webpack.

18. Семантический интерфейс

Github

Семантический интерфейс

Semantic UI Vue — это интеграция Vue для Semantic UI. Он очень вдохновлен на Semantic UI React. Если вы уже использовали его, вы обнаружите, что API Semantic UI Vue почти такой же. Семантический интерфейс Vue все еще находится в стадии разработки. Пожалуйста, не стесняйтесь вносить свой вклад.

17. VueBoot

Github

VueBoot

VueBoot — это проект, разработанный для облегчения использования Bootstrap в приложениях VueJS. Принимает тот подход, что команда Bootstrap проделала большую тяжелую работу, и воспроизведение этой работы выходит за рамки этого проекта. Поэтому мы решили использовать официальный JavaScript-код Bootstrap и просто обернуть API в тонкую оболочку VueJS.

16. Framevuerk

Github

Framevuerk

Framevuerk, является гибкой, многоязычной, с поддержкой как направления, так и настраиваемой инфраструктуры пользовательского интерфейса, основанной на Vue.js с удивительным именем.

15. Вью-материал

Github

Vue Материал

Материал Vue — это полезный UI Kit для проектирования и создания красивых приложений с помощью Material Design и Vue.js. Он хорошо спроектирован, поэтому вы можете создавать приложения, которые могут поместиться на каждом экране с поддержкой всех современных веб-браузеров.

14. N3-Компоненты

Github

N3 Компоненты

Библиотека компонентов N3 построена с использованием Vue.js. Это мощная библиотека для веб-интерфейса или инженеров полного стека, позволяющая быстро создавать веб-страницы. Компоненты N3 применяются для создания большого экологического круга разработчиков, использующих Vue.js. Поддержка следующим образом:

13. Пользовательский интерфейс Fish

Github

Fish UI Vue.js

Fish UI — это набор инструментов для веб-интерфейса Vue.js 2.0. Эта структура использует:

  • Vue.js, Момент, Vue-Router, ES6 Бабель 6
  • Круто с Webpack 2.0 Vue Loader
  • Семантические CSS-компоненты
  • Таблицы стилей в Меньше

12. VUI

Github

VUI Vue.js UI Framework

Каркас пользовательского интерфейса для мобильных устройств, созданный с помощью Vue. VUI предоставляет компоненты, которые выглядят как родной пользовательский интерфейс в iOS, Android и Windows. Однако VUI не будет создавать эти анимации, как в Material design.

11. Vuikit

Github

Vuikit Vue.js UI Framework

Хотя при сборке компонентов Vue можно использовать UIkit самостоятельно, вы можете полагаться на слишком много зависимостей и создавать оболочку, чтобы заполнить недостающий логический пробел. Vuikit решает все эти проблемы, предоставляя собственные, непроизведенные компоненты, выводящие макет UIkit.

10. Muse UI

Github

Muse UI Vue.js UI Framework

Пользовательский интерфейс Muse в основном реализует каждый компонент, описанный в руководстве по проектированию материалов, а также многие другие функциональные компоненты для Vue.js. Пользовательский интерфейс Muse использует меньше файлов, все цвета управляются переменными. Пользовательские темы могут быть завершены путем записи меньшего количества файлов, компоненты также предоставляют параметры для изменения их эффектов. Пользовательский интерфейс Muse разработан на основе Vue2.0. В настоящее время Vue2.0 является одной из самых быстрых интерфейсных сред, компактным и удобным API, который можно использовать для разработки сложных одностраничных приложений.

9. IVIEW

Github

iView UI Vue.js

iView — это расширенный инструментарий пользовательского интерфейса для Vue.js. Это предлагает:

  • Десятки полезных и красивых компонентов.
  • Дружественный API. Это сделано для людей с любым уровнем квалификации.
  • Обширная документация и демонстрации.
  • Это довольно красиво.
  • Поддерживает как Vue.js 2, так и Vue.js 1.

8. Vuetify

Github

Vuetify UI Framework

Vuetify является структурой компонентов материала для Vue.js. Vuetify готов к работе с 8 готовыми шаблонами Vue-Cli. От простого html до полномасштабного SSR вы готовы к работе за считанные минуты. Будьте готовы к армаде специализированных компонентов в вашем распоряжении. В общей сложности более 80 предлагает решение для любого применения.

7. UIV (Bootstrap 3)

Github

UIV Vue.js UI Framework

uiv — это библиотека компонентов Bootstrap 3, реализованная для Vue.js 2. Особенности фреймворка:

  • облегченный
    • Все компоненты ~ 20KB Являющийся файл.
    • Только зависимости Вью Bootstrap CSS.
    • Никаких дополнительных CSS.
    • Индивидуальный импорт поддерживается.
  • IE 9+ поддерживаются современные браузеры.
  • SSR (рендеринг на стороне сервера) поддерживается.
  • Все env поддерживается:
    • UMD build uiv.min.js[/ NOEDIT] можно использовать во всех средах (включая браузер)
    • Сборка модуля ES uiv.esm.js[/ NOEDIT] для современных упаковщиков, таких как вебпак 2 или же свернуть
    • CommonJS build uiv.common.js[/ NOEDIT] для более старых пакетов, таких как browserify или же веб-пакет 1.

6. Bootstrap Vue

Github

Bootstrap Vue.js

Bootstrap-Vue предоставляет одну из наиболее полных реализаций компонентов и системы сетки Bootstrap V4, доступных для Vue.js 2.4+, в комплекте с обширной и автоматической разметкой доступности WAI-ARIA.

5. AT UI

Github

AT UI

AT UI — это легкая и модульная библиотека интерфейса пользователя для Vue.js. Особенности этой структуры:

  • На основе Vue
  • Рабочий процесс разработки NPM + Webpack + Babel Front-End
  • Служба поддержки ES2015
  • Независимо от стиля CSS, создайте согласованные пользовательские интерфейсы Стиль AT-UI)
  • Дружественный API

4. Onsen UI Vue

Github

Onsen UI Vue.js

Привязки Vue для пользовательского интерфейса Onsen (VueOnsen) предоставляют компоненты и директивы Vue 2, которые обертывают основные веб-компоненты и предоставляют API-интерфейс типа Vue для взаимодействия с ними.

3. Buefy

Github

Buefy UI Framework

Buefy — это легкая библиотека отзывчивых компонентов пользовательского интерфейса для Vue.js, основанная на структуре и дизайне Bulma. Особенности этой структуры:

  • Сохраняйте текущую тему / переменные Bulma легко
  • Поддерживает оба Значки дизайна материалов а также FontAwesome
  • Очень легкий без внутренних зависимостей, кроме Vue Бульма
  • Около 60KB мин + gzip (с булмой в комплекте)
  • Вывод семантического кода
  • Следует Булме дизайн и некоторые из Материал Дизайн UX
  • Сосредоточьтесь на удобстве использования и производительности без чрезмерной анимации

Он предлагает поддержку последних версий Firefox, Chrome, Edge, Opera и Safari. IE10 + поддерживается только частично.

2. Острый пользовательский интерфейс

Github

Keen UI Vue.js Framework

Keen UI — это облегченная библиотека Vue.js с простым API. Дизайн вдохновлен Материальным дизайном Google. Тем не менее, Keen UI не является полной реализацией спецификации Material Design. Keen UI не является фреймворком CSS. Как таковой, он не включает в себя систему сетки, стили оформления и т. Д. Вместо этого, акцент делается на интерактивные компоненты, которые требуют Javascript.

1. Элемент

Github

Элемент Vue.js UI Framework

Element — это библиотека компонентов на основе Vue 2.0 для разработчиков, дизайнеров и менеджеров по продуктам. Эта платформа обеспечивает поддержку современных браузеров и Internet Explorer 10+, а также предлагает версии React и Angular. Документация по фреймворку доступна на испанском, английском и китайском языках. С Element вы сможете упростить процесс работы и четко изложить свои намерения, чтобы пользователи могли быстро понимать и принимать решения.

Если вы знаете еще одну замечательную среду с открытым исходным кодом для Vue.js, не стесняйтесь и поделитесь ею с сообществом в поле для комментариев.

Ссылка на основную публикацию
Adblock
detector