Home>Article>Web Front-end> 21 open source projects worth paying attention to in Vue (recommended)

21 open source projects worth paying attention to in Vue (recommended)

青灯夜游
青灯夜游 Original
2020-10-12 17:31:06 3097browse

21 open source projects worth paying attention to in Vue (recommended)

One of the advantages of Vue over React is that it is easy to understand and learn, and it accounts for the majority in China. We can create any web application with the help of Vue. Therefore, it is also important to keep abreast of some new and easy-to-use Vue open source projects. On the one hand, it can help us develop more efficiently, and on the other hand, we can also learn its essence as a model.

Next, let’s take a look at some useful new open source projects.

uiGradients

Website:http://uigradients.com/

GitHub:https://github.com /ghosh/uiGradients

GitHub Stars:4.6k

21 open source projects worth paying attention to in Vue (recommended)

## Colorful arrays and great UX make it A highlight of this project, gradients are still a growing trend in web design. We can choose the color we want, get all possible gradients, and get the corresponding CSS code. Collect it now.

CSSFX

A collection of CSS transition effects

Website:https://cssfx.dev

GitHub:https://github.com/jolaleye/cssfx

GitHub Stars:3.5k

21 open source projects worth paying attention to in Vue (recommended)

CSSFX There are many CSS filtering effects in it. We can select specific animations according to our needs. Click on the corresponding effect to see the generated CSS code. Let's get started.

Sing App Vue Dashboard

A management template

Website:https://flatlogic.com/templat...

GitHub:https://github.com/flatlogic/sing-app-vue-dashboard

GitHub Stars:254

Example:https://flatlogic.com/templates/sing-app-vue-dashboard/demo

Documentation:https://demo .flatlogic.com/sing-app/documentation/

21 open source projects worth paying attention to in Vue (recommended)

This is a free and open source management template based on the latest Vue and Bootstrap. In fact, it is similar to our domestic vue-admin-template almost. We don’t have to use it, but we can study and study the source code. I believe we can learn a lot of practical skills, come on young man.

Vue Storefront

Website:https://www.vuestorefront.io

GitHub:https://github .com/DivanteLtd/vue-storefront

GitHub Stars:5.8k

21 open source projects worth paying attention to in Vue (recommended)

This is a PWA , can connect to any backend (or almost any backend). The main advantage of this project is the use of headless architecture. It is a comprehensive solution that offers us many possibilities (huge support from a steadily growing community, server-side rendering that will improve web SEO, a mobile-first approach and an offline mode.

Faviator

Icon generated library

Website:https://www.faviator.xyz

GitHub:https:// www.faviator.xyz/playground

GitHub Stars:94

21 open source projects worth paying attention to in Vue (recommended)

If you need to create an icon add Experience. You can use any Google font and any color. Just pass the preferred configuration and choose PNG, SVG or JPG format.

iView

Vue UI Component Library

Website:https://iviewui.com/

GitHub:https://github.com/iview/iview

GitHub Stars:22.8k

21 open source projects worth paying attention to in Vue (recommended)

Continuous iterative updates make this set of UI components a great addition to developers of any skill level Select.

To use iView, a solid understanding of single file components is required, and the project has a friendly API and extensive documentation.

Postwoman

API Request Builder

Website:https://postwoman.io/

GitHub:https://github.com/liyasthomas/postwoman

GitHub Stars:10.5k

21 open source projects worth paying attention to in Vue (recommended)

This one is similar to Postman. It is free, has many contributors, and Has multi-platform and multi-device support. This tool is really fast and has tons of updates. The creators of this tool claim that there will be more features in the near future.

Vue Virtual Scroller

Quick Scroll

URL:https://akryum.github.io/vue-virtual-scroller/#/

GitHub:https://github.com/Akryum/vue-virtual-scroller

GitHub Stars:3.4k

21 open source projects worth paying attention to in Vue (recommended)

##Vue Virtual Scrollerhas four main components.RecycleScrollerCan render visible items in the list. If we don't know the specific amount of data, it's best to useDynamicScroller.DynamicScrollerItemWraps everything inDynamicScroller(to handle size changes).IdStateSimplifies local state management (insideRecycleScroller).

Mint UI

Mobile UI library

Website:http://mint-ui.github.io/#!/en

GitHub:https://github.com/ElemeFE/mint-ui

GitHub Stars:15.2k

21 open source projects worth paying attention to in Vue (recommended)

Build mobile apps faster using ready-made CSS and JS components. With this tool, we don't have to risk the file size being too large since it can be loaded on demand. Animation is handled by CSS3 to improve performance.

V Calendar

Dependency-free plugin for building calendars

Website:https://vcalendar.io

GitHub:https://github.com/nathanreyes/v-calendar

GitHub Stars:1.6k

21 open source projects worth paying attention to in Vue (recommended)

You can choose different visual indicators to decorate your calendar.

V Calendaralso provides us with three date selection modes:

    Single selection
  • Multiple selection
  • Date range
Vue Design System

A set of UI tools

Website:https://vueds.com/

GitHub :https://github.com/viljamis/vue-design-system

GitHub Stars:1.7k

121 open source projects worth paying attention to in Vue (recommended)

This is a well-organized tool with easy-to-understand naming for any web development team. One of the big advantages is the use of a prettier code formatter that automatically arranges the code before committing to Git.

Proppy

Function prop combination of UI components

Website:https://proppyjs.com

GitHub :https://github.com/fahad19/proppy

GitHub Stars:856

21 open source projects worth paying attention to in Vue (recommended)

ProppyJS is a tiny library for combining props, and it comes with various integration packages that give you the freedom to use its popular rendering library.

The idea is to first express the Component's behavior as props, and then use Proppy's same API to connect it to your Component (which can be React, Vue.js, or Preact).

The API also allows you to access other application-wide dependencies (such as stores using Redux) for convenience anywhere in the component tree.

Light Blue Vue Admin

vue background display template

Website:https://flatlogic.com/templates/light-blue-vue- lite

GitHub:https://github.com/flatlogic/light-blue-vue-admin

GitHub Stars:79

121 open source projects worth paying attention to in Vue (recommended)

##Example:

https://demo.flatlogic.com/light-blue-vue-admin/#/app/dashboard

Documentation:

https://demo.flatlogic.com/light-blue/documentation/The template is created using

Vue CLI

andBootstrap 4Built. As you can see from the demo, this template has a very basic set of pages: typography, maps, charts, chat interface, etc. If we need an extended template, you can take a look at Light Blue Vue Full, which has more than 60 components, no jquery, and two color themes.Vue API Query

Building requests for the REST API

GitHub:

https://github.com/robsontenorio/vue-api-query

GitHub Stars:

1.1k

121 open source projects worth paying attention to in Vue (recommended)There’s not much to say about this project. It does exactly what is written in the description line: it helps us construct requests to the REST API.

Vue Grid Layout

Vue’s grid layout

Website:

https://jbaysolutions.github.io/vue-grid-layout/ examples/01-basic.html

GitHub:

https://github.com/jbaysolutions/vue-grid-layout

GitHub Stars:

3.1k

Simple solution to all grid related problems. It has static, resizable and draggable widgets. Or can responses and layouts be restored and serialized. If you need to add one more widget, you don't have to rebuild the entire grid.

Vue Content Loader

Create a placeholder loader

Website:http://danilowoz.com/create-vue-content-loader

GitHub:https://github.com/egoist/vue-content-loader

GitHub Stars:2k

121 open source projects worth paying attention to in Vue (recommended)

When we develop a website or APP, when there is too much content and the loading speed is slow, it will cause a large number of blank pages when the user opens the page.vue-content-loaderis correct It is a component that solves this problem. It generates adomtemplate before loading content to improve user experience.

Echarts with Vue2.0

Data Visualization

Website:https://simonzhangiter.github.io/DataVisualization/#/dashboard

GitHub:https://github.com/SimonZhangITer/DataVisualization

GitHub Stars:1.3k

121 open source projects worth paying attention to in Vue (recommended)

In the picture, we can see a very beautiful chart. This project makes any data more readable and easier to understand and interpret. It allows us to easily detect trends and patterns in any data set.

Vue.js Modal

Highly customizable modal box

Website:http://vue-js-modal.yev.io /

GitHub:https://github.com/euvl/vue-js-modal

GitHub Stars:2.9k

121 open source projects worth paying attention to in Vue (recommended)

All different types of modals can be viewed on this website. There are 15 buttons, press any button and see a modal example.

Vuesax

Framework Component

Website:https://lusaxweb.github.io/vuesax/

GitHub:https://github.com/lusaxweb/vuesax

GitHub Stars:3.7k

121 open source projects worth paying attention to in Vue (recommended)

This project Very popular in the community. It allows us to design different styles for each component. The creators ofVuesaxemphasize that every web developer should have freedom of choice when it comes to web design.

Vue2 Animate

vue2.0—Build the project and create components usinganimate.css

Website:https://the-allstars.com/vue2-animate/

GitHub:https://github.com/asika32764/vue2-animate

GitHub Stars:1.1k

21 open source projects worth paying attention to in Vue (recommended)

This library is cross-browser, we can choose from 5 types of animations:rotate,slide,fade,bounceandzoom. There is a demo on the website. The default duration of the animation is 1 second, but we can customize this parameter.

Vuetensils

Vue.js toolset

Website:https://vuetensils.stegosource.com/

GitHub:https://github.com/stegosource/vuetensils

GitHub Stars:111

221 open source projects worth paying attention to in Vue (recommended)

This UI library has a standard functionality, but the cool thing is that it has no additional styles. You can make the design as personal as possible and apply it to all your needs. Just write the styles you need, add them to your project, and include as many components as you need.


Original address:

https://flatlogic.com/blog/new-and-noteworthy-vue-js-open-source-projects-part-1 /

https://flatlogic.com/blog/new-and-noteworthy-vue-js-open-source-projects-part-2/

Related Recommendation:

2020 Summary of front-end vue interview questions (with answers)

vue tutorial recommendation: The latest 5 vue.js in 2020 Video tutorial selection

For more programming-related knowledge, please visit:Introduction to Programming! !

The above is the detailed content of 21 open source projects worth paying attention to in Vue (recommended). For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn