Skip to content

Latest commit

 

History

History
1098 lines (750 loc) · 61.5 KB

README_CLEANED.md

File metadata and controls

1098 lines (750 loc) · 61.5 KB
Raw


awesome

Awesome Vue.js Awesome

A curated list of awesome things related to Vue.js

Resources

Official Resources

External Resources

Job Portal

Community

Podcasts

Official Examples

Tutorials

Examples

    • aspnetcore-Vue-starter A VueJS 2 starter template as part of an asp.net MVC dotnetcore project. This template includes the VueJS client app and a backend API controller.
    • vue-music-qq vue-laravel-example A qq-music project is based on vue-cli. The pages are simple and smooth

Books

Projects Using Vue.js

Open Source

  • PageKit - Modular and lightweight CMS built with Symfony components and Vue.js.
  • npmcharts.com - Compare npm packages and spot download trends.
  • Koel - A personal music streaming server that works.
  • RSS Reader - Simple RSS Reader made using atom electron and vue.js.
  • Gokotta - A simple music player built by electron and vue.
  • CoPilot - An admin portal based on AdminLTE with vue.js integration.
  • Retrospectify - A simple tool for doing collaborative retrospectives in agile teams.
  • jade-press - Cms based on mongodb, nodejs, koa, vue and more.
  • astralapp - Organize Your GitHub Stars With Ease.
  • EME - An Elegant Markdown Editor.
  • Github-explorer - A spa which can help you check your github in a better way.
  • Hotel - Start your dev servers from your browser and get local domains in seconds.
  • Surfbird - A Twitter client written with modern web technologies.
  • Approach0 - A math-aware search engine.
  • Flox - Self Hosted Movie, Series and Anime Watch List.
  • JavaScript Guessing Game - A game for identifying JavaScript tools and libraries.
  • vue-ghpages-blog - A blog based on GitHub pages by Vue.js 2 + Webpack 2.
  • Vuedo - Blog platform, built with Laravel and Vue.js.
  • vue-music163 - A Vue.js project for music.
  • Tomato5 - Real-time collaboration tool, it combines Pomodoro Technique with a team status share board.
  • Peek-a-tab - Tabs Manager for Google Chrome.
  • Web Learn - A service which provides simple access to thousands of video tutorials on web developing and programming.
  • ExcelJSON - A tool to convert CSV, TSV to/from JSON.
  • Materialize-blog - A material blog built with Laravel5.3 and Vue2.x.
  • VueCompomnentGenerator - Generate vue single file component on browser.
  • SDR News - News for web designers and developers aggregated from multiple sources (Reddit, Hacker News and Prominent Blogs).
  • PJ Blog - Open source blog built with Laravel and Vue.js.
  • Lulumi-browser - Lulumi-browser is a light weight browser coded with Vue.js 2 and Electron.

Commercial Products

  • Wijmo - A collection of UI controls with VueJS support.

Apps/Websites

Interactive Experiences

Enterprise Usage

Components & Libraries

UI Components

Table

Tables / data grids

Notification

Toaster / snackbar — Notify the user with a modeless temporary little popup

Loader

Loaders / spinners / progress bars — Let the user know that something is loading

Progress Bar

A slim progress bar at the top of the page

Tooltip

Tooltips / popovers

Parallax

  • vue-parallax - Scrolls a image slower than the window to create a neat optical effect.
  • vue-parallaxy - Vue.js component for parallax image scroll effects.

Icons

  • vue-icons - Webpack based - load only what you need - svg inline icons.
  • vue-awesome - Font Awesome component for Vue.js, using inline SVG.

Menu

Carousel

  • vue-easy-slider - Slider Component of Vue.js.
  • vue-l-carousel - A responsive carousel(namely slider or swiper) component for Vue.js v2.x+.
  • vue-awesome-swiper - Swiper(slide) component for Vue.js(1.x ~ 2.x).
  • vue-lory - Vue Slider Component based on lory.
  • vue-slick - Vue component for Slick-carousel.
  • vue-flickity - A Vue Component for Flickity.js.
  • vue-carousel-3d - Vue Carousel 3D - Beautiful, flexible and touch supported 3D Carousel for Vue.js.
  • vue-carousel - A flexible, responsive, touch-friendly carousel for Vue.js.

Charts

Time

Display time / date / age

Calendar

Display non-editable events in a Calendar

  • vue-fullcalendar - Vue calendar fullCalendar. No jQuery required. Schedule events management.
  • vue-event-calendar - A simple events calendar for Vue2, no dependencies except Vue2.

Map

Audio / Video

  • vue-aplayer - A Vue 2.x component of easy-to-config music players with controls.

Infinite Scroll

Markdown

  • vue-markdown - A Powerful and Highspeed Markdown Parser for Vue.

Tree

Display a tree data structure

JSON

Display JSON data

Social Sharing

  • vue-social-sharing - A Vue.js component for sharing links to social networks, work with Vue.js 1.X or 2.X.

QR Code

  • vue-qriously - A Vue.js 2 component to draw QR codes on an HTML Canvas using qrious.
  • vue-qart - The directive of vue 2.x for qart.js.

Miscellaneous

  • vue-avatar - An avatar component for vue.js.
  • vue-touch-ripple - Touch ripple component for Vue.js(1.x ~ 2.x).
  • vue-typer - Vue component that simulates a user typing, selecting, and erasing text.
  • vue-keyboard - Vue 2 virtual keyboard component.

Form

Let the user create & edit data

Date Picker

Date / datetime / time Picker

  • vue-datepicker - Calendar and datepicker component with material design for Vue.js.
  • vue2-timepicker - A dropdown time picker (hour|minute|second) for Vue 2.x, with flexible time format support.
  • vuejs-datepicker - A simple Vue.js datepicker component. Supports disabling of dates, inline mode, translations.
  • vue-flatpickr - Flatpickr for VueJS.

Select

  • vue-select - A native Vue.js component that provides similar functionality to Select2 without the overhead of jQuery.
  • vue-multiselect - Universal select/multiselect/tagging component for Vue.js.

Slider

Drag and Drop

  • vuedraggable - Vue component allowing drag-and-drop sorting in sync with View-Model. Based on Sortable.js.
  • vue-dragula - Drag and drop so simple it hurts.
  • awe-dnd - A sortable list directive with Vue.

Autocomplete

Autosuggest / autocomplete / typeahead

  • vue-instant - Vue instant allows you to easily create custom search controls with auto suggestions for your vue 2 applications.

Type Select

Let the user select a tag / something while typing

Color Picker

  • vue-color - Vue Color Pickers for Sketch, Photoshop, Chrome & more.

Switch

Switch / on/off toggle / checkbox

  • vue-switches - An on/off switch component for Vue.js with theme support.

Masked Input

Rich Text Editing

Image Manipulation

Edit images

File Upload

  • vue-clip - Simple and hackable file uploader for VueJs. Supports Vue >= 2.1.
  • vue-simple-upload - Simple File upload component for Vue.js.

Context Menu

Miscellaneous

  • vue-gmaps - Search places and address using Google Maps API.
  • vuep - A component for rendering Vue components with live editor and preview.
  • vue-places - Places component is based on places.js for Vue 2.x. Turn any input into an address autocomplete.
  • vue-password-strength-meter - Password strength meter based on zxcvbn in vue.js.
  • vue-float-label - Float label pattern for Vue.js.

UI Layout

Layout for the overall / main view

Frameworks

Responsive

Set of components + responsive layout system

Mobile

UI frameworks for mobile

  • framework7-vue - Full featured HTML framework for building iOS & Android apps.
  • vux - [Chinese] Vue UI Components based on WeUI.
  • vue-onsenui - Mobile app development framework and SDK using HTML5 and JavaScript. Create beautiful and performant cross-platform mobile apps. Based on Web Components, and provides bindings for Angular 1, 2, React and Vue.js.

Component Collections

Set of components without layout system

  • vue-mdl - Reusable Material Design Lite components for Vue.js.
  • keen-ui - A lightweight collection of essential UI components written with Vue and inspired by Material Design.
  • vue-admin - Vue Admin Panel Framework, Powered by Vue 2.0 and Bulma 0.3.
  • vuikit - UIkit with all the power of Vue.
  • element-ui - A Vue.js 2.0 UI Toolkit for Web.
  • bootstrap-vue - Twitter Bootstrap 4 Components For Vue.js 2.
Mobile

Set of components for mobile

  • mint-ui - Mobile UI elements for Vue.js.

Other

  • nuxt - Framework for server-rendered Vue.js applications.
  • app-framework - IOS and Android Apps with HTML & JavaScript - develop, build and deploy - free and open source.

UI Utilities

Event Handling

Handling of user events (scroll, click, key strike, ...)

  • vue-shortkey - Vue-ShortKey - plugin for Vue.js.
  • vue-throttle-event - Throttle events based on requestAnimationFrame.
  • vue-waypoint - Waypoint component for Vue, this is the easiest way to trigger a function when you scroll.
  • vue-clickaway - Reusable clickaway directive for reusable Vue.js components.
  • vue-scrollfire - Fires an event on a specific scroll position.
  • vue-resize-directive - Vue directive to detect resize events with deboucing and throttling capacity.

Responsive Design

  • vue-viewports - Define your custom viewports and use them in your components.

Form

  • vue-formly - JavaScript powered forms for Vue.js.
  • vue-focus - A reusable focus directive for reusable Vue.js components.

Validation

  • vue-validator - Validator component for Vue.js.
  • vee-validate - Simple Vue.js input validation plugin.
  • vue-rawmodel - RawModel.js plugin for Vue.js v2. Form validation has never been easier.
  • vuelidate - Simple, lightweight model-based validation for Vue.js.
  • simple-vue-validator - A simple yet flexible validator library for vue.js.
  • vue-vform - Vue.js 2 form component that integrates jQuery Validation and Axios.
  • vue-form - Comprehensive form validation for Vue.js.

Scroll

Set window scroll position

  • vue-chat-scroll - Automatic scroll-to-bottom directive for Vue.js 2.0.
  • vue-scrollto - Adds a directive that listens for click events and scrolls to elements.

Routing

Lazy Load

Pagination

Animation

  • vue2-animate - A Vue.js 2.0 port of Animate.css. For use with Vue's built-in transitions.

Meta Tags

Manage meta information in the document head

  • vue-head - Manage the meta information of the head tag, a simple and easy way.
  • vue-meta - Manage page meta info in Vue 2.0 components. SSR + Streaming supported.

Portal

Move a DOM node to a target DOM node

  • vue-dom-portal - An escape hatch for DOM Elements in Vue.js components.

Filters

  • vue2-filters - A collection of standard filters Vue 1.* adapted for use in Vue 2.*.

SVG

  • vue-svgicon - A tool to create svg icon components. (vue 2.x).

Miscellaneous

Utilities

Utilities not directly related to the UI

Typescript

HTTP Requests

Retrieve data over HTTP

i18n

Internationalization / L10n / localization / translation

Custom Events

Persistence

LocalStorage etc.

  • vue-localstorage - Vue.js localStorage plugin with types support.
  • vue-ls - Vue plugin for work with LocalStorage from Vue context.

State Management

  • vuex - Centralized State Management for Vue.js.
  • vue-sync - Synchronize Vue State with the Browser URL, Server Backend, and other endpoints.

Redux

  • revue - Redux binding for Vue.
  • vuedeux - Binding Solutions for Vue & Redux.

Vuex Utilities

Sync Between Tabs

Code Style

Improve readability of code

CSS

  • vue-bem-cn - Vue-bem-cn - Simple BEM class name generator for Vue.JS.

Asset Management

Utilities for building / compiling / bundling / loading assets

  • vue-script2 - Standardized, designer-friendly script tag behavior for your Single Page App.
  • vue-loader - Webpack loader for Vue.js components.
  • vueify - Browserify transform for single-file Vue components.
  • vue-compiler - A simple cli wrapper around the vue-component-compiler.
  • vue-brunch - Adds support to Brunch for pre-compiling single file Vue components.
  • vbuild - Fast prototype and distribute modern web apps like a pro.

Miscellaneous

  • vue-container - A simple dependency injection library for Vue 2.

Integrations

Integrate with services or other frameworks

  • vue-disqus - Vue component to integrate Disqus comments in your application, with support for SPA.
  • vue-youtube-embed - Vue.js and YouTube.
  • vue-add-to-calendar - A Vue.js component that provides "Add to Calendar" functionality, works with Vue 2.X.
  • Vue + Meteor - Vue first-class integration in Meteor.
  • vue-apollo - Apollo/GraphQL integration for VueJS.
  • av-ts - A modern, type-safe, idiomatic Vue binding library.
  • Neutronium - Build .NET desktop applications using HTML, CSS and javascript.
  • vue-threejs - Vue bindings for Three.js.
  • vue-typescript-jest - Jest preprocessor.js for Vue.js components (supporting html, pug, and babel) and TypeScript.
  • vue-jest-utils - Utilities for testing Vue.js components using Jest.
  • vue-custom-element - Vue Custom Element - Custom Elements for Vue.js.
  • vue-socket.io - Socket.io implemantation for vuejs.
  • vue-cordova - Vue.js plugin for Cordova.
  • vue-websocket - Simple websocket (socket.io) plugin for Vue.js.
  • vue-wamp - AutobahnJS wrapper library fo Vue.js.
  • express-vue - Vue rendering engine for Express.js. Use .Vue files as templates using res.render().
Google Analytics
  • vue-ua - Google Universal Analytics support in Vue.js.
  • vue-analytics - Vue plugin for Google Analytics.

Dev Tools

  • vue-dev-server - A small development server for building vue components.

Inspect

Inspecting & debugging

  • Vue.js devtools - Chrome devtools extension for debugging Vue.js applications.
  • DejaVue - Visualization and debugging tool built for Vue.js.

Docs

Create documentation

Test

  • avoriaz - A Vue.js testing utility library.
  • vue-container - A simple dependency injection library for Vue 2.
Browser-less require

Load Vue components without browser

  • vuegister - Vuegister (an acronym for vue-register) is a require hook for loading of the Vue.js single-file components (or .vue files).
  • vue-node - Load vue components in node.

Source Code Editing

Text editor plugins

Atom

Sublime Text

Vim

  • Vim Vue - Syntax Highligth for Vue.js components.

Visual Studio Code

  • Vetur - Vue tooling for VSCode.

Visual Studio

  • VuePack - Contains HTML Intellisense and code snippets for the Vue.js JavaScript library.

Brackets

Intellij

  • Vue.js Plugin - Vue.js features for the Intellij Platform (WebStorm, RubyMine, Intellij, etc).

Emacs

  • Vue Mode - Emacs major mode for vue.js.

Kate

  • Kate Syntax Files - Syntax files (modified or original) for katepart (kate, kwrite, kdevelop).

Scaffold

Scaffold / boilerplate / seed / starter kits / stack ensemble / Yeoman generator

  • vue-cli - Simple CLI for scaffolding Vue.js projects.

Client

Render Vue application in the browser

  • Vue Plugin Boilerplate - Boilerplate for Vue.js plugin.
  • Bourgeon - Bourgeon is an opinionated-featured VueJS 2.0 setup for Webpack.
  • VuePack - A modern starter which uses Vue 2, Vuex, Vue-router and Webpack 2 (and even Electron).
  • Vue Settler - An opinionated Vue 2.0 SPA Starter.
  • vue-build - Ultra Simple, Development, Testing and Production Build Cli.
  • Vue Element Starter - Robust Vue 2 starter with Element-UI.

Universal

Render Vue application both to HTML on the server and to DOM in the browser

  • SPA Starter Kit - A highly opinionated starter kit for building Single Page Applications with Laravel and Vue.js.
  • SSR Boilerplate - Vue.js Server Side Rendering Boilerplate without Polluting Vuex.

Server

Includes a backend boilerplate

  • Vuetober - Single page apps with Laravel, Vue.js, and October CMS.

Electron

  • Electron Vue - An Electron & Vue.js quick start boilerplate with vue-cli scaffolding, common Vue plugins, electron-packager/electron-builder, unit/e2e testing, vue-devtools, and webpack.
  • VuePack - A modern starter which uses Vue 2, Vuex, Vue-router and Webpack 2 (and even Electron).

Parts

Sacaffold parts of the app

  • vue-generator - A CLI generator for Vue components, views and store modules.



CC0