Vue combines the best of React and Angular with a cohesive, active, and large community that can help solve development problems. The open source community is constantly coming up with new ways to solve problems. The number of tools and libraries is also increasing.

  • ** The framework is very small. ** is about 18-21KB;
  • Vue supports a component-based approach to building Web applications;
  • Detailed documentation. This is easy for beginners to learn;
  • ** is easy to understand. ** Due to its simple structure, you can easily add vue.js to your Own Web projects. It stores your data with a well-defined architecture. Lifecycle methods and custom methods are separate;
  • * Easy integration. ** You can easily add vue.js via CDN, independent of node.js and NPM. It’s a great alternative to jQuery;
  • Excellent tool. With the Vue CLI, you can start new projects using built-in routing, state storage, Lint, unit tests, CSS preprocessors, Typescript, PWA, and more. In addition, the Vue CLI provides a UI for managing projects.

Here is a summary of some of the most popular tools and libraries, as well as other libraries and plug-ins that are involved in the Vue ecosystem.

1.ViewUI

View UI, the original iView, is a set of open source UI component library based on vue.js, mainly serving the PC interface in the background products.

2.Vue.js Modal

Vue.js Modal box (Modal box) is an easy to use, highly customizable vue.js Modal box component library, support SSR.

3.Mint UI

Mint UI, launched by the front-end team of Ele. me, is a vue.js based mobile component library. Mint-ui contains rich CSS and JS components for everyday mobile development. Through it, you can quickly build a unified style of the page, improve the efficiency of development.

4.Vuetify

A very sophisticated UI framework, it provides a lot of common components, relying on the Design advantages of Material Design, let you do not need to write a line of CSS code can get very beautiful interface functions.

5.Buefy

Buefy is based on Bulma and vue.js lightweight UI components, which provide lightweight components out of the box.

Features:

  • Keep your current Bulma theme/variables simple
  • Support material design icon and FontAwesome
  • There are no internal dependencies other than Vue&Bulma
  • About 60KB min + GZIP (including Bulma)
  • Semantic code output
  • Follow Bulma Design and some Material Design UX
  • Focus on usability and performance, not over-animation

6.Vue Material

Vue Material is simple, lightweight, and built entirely according to Google Material Design specifications. Vue Material provides over 56 components to build different types of layouts. The Material Design Framework has truly complete documentation. The framework is lightweight and has all the components that fully comply with the Google Material Design guidelines. This design supports all modern browsers and fits all screens.

7.Nuxt.js

Nuxt is a simple and straightforward framework for building general-purpose applications, such as server-side rendered applications, single-page applications, progressive Web applications, or just static site generators. It’s also modular, so you only need to use the modules your program needs. Nuxt saves you the hassle of building and optimizing your application. Nuxt.js has a modular architecture with more than 50 modules to choose from.

Features:

  • Automatic translation and packaging (via WebPack and Babel);
  • Code hot loading;
  • You can choose server-side rendering, single-page application, or static generation;
  • It can be configured through the nuxt.config.js file.
  • Split the page code for each page;
  • Custom layouts with layouts/ directory
  • Load only critical CSS (page level).

Nuxt became an integral part of Vue development, with many contributors and a wide community.

8.Quasar

Quasar is a generic framework based on Vue that lets you write applications for different platforms using the same code base: SPA, PWA, SSR applications, hybrid mobile applications or multi-platform desktop applications. The Quasar contains up to 81 components.

There is a wealth of documentation and components that are designed with performance and responsiveness in mind. Quasar integrates best practices by default (HTML/CSS/JS minimization, cache cleaning, tree shaking, source mapping, code splitting with lazy loading, ES6 generation, code-splitting, accessibility, etc.), so you just need to put the experience into the functionality of the program. It also provides a CLI tool for easily building new projects.

9.Bootstrap Vue

Bootstrap Vue is a UI suite based on the Bootstrap library. It simply replaces the JavaScript in the regular Bootstrap component with Vue code. With Bootstrap Vue, you can build responsive, mobile-first, and ARIa-accessible projects on the Web using vue.js and Bootstrap V4, the world’s most popular front-end CSS library. It can also be easily integrated with nuxt.js.

Rich documentation and strong community support make it easy to get a project started.

10.Statusfy

Statusfy is a fully open source status page system. Statusfy is a Web application created based on Eleventy, Vue, Nuxt.js and Tailwind CSS.

It’s cool because:

  • Markdown support;
  • It’s a progressive Web application;
  • Multi-language support;
  • Easy to customize.

In terms of community management and support, the project has a community chat feature, lots of tutorials, tips, updates and blogs. It also has detailed documentation.

At the end

This issue is to share here, I am xiaobian South wind blowing, focus on sharing interesting, novel, practical open source projects and developer tools, learning resources! I hope to learn and communicate with you together. Welcome to follow my official account ** [Github navigation station] **.

Phase to recommend

3000 + people accessing an HTML file, how much broadband is enough to support

The programmer connects the private life necessary background frame, need not repeat to build the wheel, net friend: too easy to use!

Still working on the project from start to finish? Use these six SpringBoot projects well, get twice the result with half the effort!

Fierce, this programmer code completion tool, let your programming efficiency fly!

Middle-aged netizens can finally understand young people’s AWSL

Cool! This open source Android projection software will let you work and play both!