Awesome Vue.js

A curated list of awesome things related to Vue.js

• Resources
  • Official Resources
  • External Resources
  • Job Portal
  • Community
  • Podcasts
  • Official Examples
  • Tutorials
  • Examples
  • Books
• Projects Using Vue.js
  • Open Source
  • Commercial Products
  • Apps/Websites
  • Interactive Experiences
  • Enterprise Usage
• Components & Libraries
  • UI Components
  • Table
  • Notification
  • Loader
    • Progress Bar
  • Tooltip
  • Overlay
  • Parallax
  • Icons
  • Menu
  • Carousel
  • Charts
  • Time
  • Calendar
  • Map
  • Audio / Video
  • Infinite Scroll
  • Pull-to-refresh
  • Markdown
  • PDF
  • Tree
  • Social Sharing
  • QR Code
  • Search
  • Miscellaneous
  • Form
    • Picker
    • Date Picker
    • Select
    • Slider
    • Drag and Drop
    • Autocomplete
    • Type Select
    • Color Picker
    • Switch
    • Masked Input
    • Rich Text Editing
    • Image Manipulation
    • File Upload
    • Context Menu
    • Miscellaneous
  • UI Layout
  • Frameworks
  • Responsive
  • Mobile
  • Component Collections
  • Other
  • UI Utilities
  • Event Handling
  • Responsive Design
  • Form
    • Validation
  • Scroll
  • Routing
  • Lazy Load
  • Pagination
  • Animation
  • Meta Tags
  • Portal
  • Filters
  • SVG
  • Miscellaneous
  • WebGL
  • Utilities
  • Typescript
  • HTTP Requests
  • i18n
  • Custom Events
  • Persistence
  • State Management
    • Redux
    • Vuex Utilities
  • Concurrency Management
  • Code Style
  • CSS
  • Asset Management
  • Page Navigation
  • Miscellaneous
  • Web Workers
  • JSX
  • Migration
  • Web Sockets
  • Integrations
  • Dev Tools
  • Inspect
  • Docs
  • Test
  • Source Code Editing
    • Atom
    • Sublime Text
    • Vim
    • Visual Studio
    • Brackets
    • Intellij
    • Emacs
    • Kate
  • Scaffold
  • Client
  • Universal
  • Server
  • Electron
  • Parts
  • Runtime
  • Command Line / Terminal

Resources

Official Resources

• Official Guide
• API Reference
• GitHub Repo
• Release Notes

External Resources

• Vue.js資料まとめ(for japanese) by @hashrock
• Vue.js Newsletter - Weekly dose of handpicked Vue.js news
• Vue.js Tips - Tips to become a better Vue.js developer
• Vue.js Wikipedia

Job Portal

• Vue.js Jobs - VueJobs - A Vue.js job portal to hire or get hired for all your Vue.js jobs.

Community

• Twitter
• Official Forum
• vue-requests - Request a Vue.js module you wish existed or get ideas for modules
• VueJS Brasil - Telegram Group [Portuguese]
• VueJS Iran - Telegram Channel & group (group link available in channel bio)
• vueslack - 1300+ registered users worldwide
• Vue Land - Discord chat server
• VueJS Russia - Telegram Group [Russian]
• VueJS Viet Nam - Facebook group
• VueJS Spanish - Slack Group

Podcasts

• Full Stack Radio #30 (11-23-2015)
• JavaScript Jabber #187 (11-25-2015)
• Changelog #184 (11-27-2015)
• Software Engineering Daily (12-29-2015)
• Javascript Air 016 (03-30-2016)
• Codecasts #2 - Falando Sobre Vuejs e Web Components (2016-08-19) [pt-BR]
• Full Stack Radio #50 (09-21-2016)
• 和 Vue.js 框架的作者聊聊前端框架开发背后的故事 [zh-CN]
• MW S04E08 - Vue.js with Evan You and Sarah Drasner (04-27-2017)
• Request For Commits #12 - Crowdfunding Open Source (Vue.js) (06-15-2017)

Official Examples

• Basic Examples
• Vue.js TodoMVC
  • CoffeeScript Version
• Vue.js HackerNews Clone

Tutorials

• Vue.js screencasts on Laracasts
• What's New in Vue.js 1.0 on Sitepoint
• Build an App with Vue.js: From Authentication to Calling an API on Auth0 blog
• Create a GitHub File Explorer Using Vue.js on Scotch.io
• Vue.js Tutorial on Vegibit
• Vue.js build set-up from scratch with webpack, vue-loader and hot reload
• Vuex basics: Tutorial and explanation
• Vuex introduction video - James Browne from London Vue.js Meetup #1
• Vue.js 中文系列视频教程 on Laravist
• Vue.js: The Basics on Coligo.io
• VueJs: Components on Coligo.io
• Dynamic Components in Vue.js on Coligo.io
• Develop a Reactive Invoice App using Vue.js on craigmckenna.com
• Understanding Filters in Vue.js on Coligo.io
• Hybrid App Example with Laravel and Vue.js in portuguese by @vedovelli
• Creating a Markdown Editor with VueJs and GitHub's API on Coligo.io
• Building a Real-Time Web Analytics Dashboard with NodeJs, Socket.io, and VueJs on Coligo.io
• Vue.js Introduction Turkish Language on oguzhan.in
• Vue.js VideoTutoral Series in Spanish (3-8-2016) on YouTube by Juan Andrés Núñez
• Building a Bookmarking App with Electron, VueJs, and Firebase on Coligo.io
• Learn Vuex by Building a Notes App on Coligo.io
• Vue.js Screencast Series in Spanish on Styde.net
• 讲解Vue.js 官网 中文-含代码、百度云、youtube on bhnddowinf
• Exploring Real Time Apps with VueJS, ES2015 and Webpack on Pusher
• Vue.js in Bahasa Indonesia on sekolahkoding.com
• Building a Mobile App with Cordova and Vue.js on Coligo.io
• Vue.js from Scratch Series in Russian on YouTube by .dev
• Створення сервісу для зберігання файлів з Flask, RethinkDB та Vue.js, ч. 1 Ukraine
• VueJS 2 French tutorial Français par Grafikart
• Jayway Vue.js 2 workshop. Build an e-commerce site with vue-router, vuex and vue-resource
• How to Create Great VueJS Applications Using Wijmo Controls
• 讲解Vue.js 2 官网 中文-含代码、百度云、youtube on bhnddowinf
• Vue.js Cheatsheet: Server-side Applications, Router, Vuex Store, GraphQL and more by @xpepermint
• Medium like Image Loading with Vue.js
• How to Use Vuex in a Laravel Spark Project on Metric Loop
• How To Set Up Modules in Vuex on Metric Loop
• Learn Vue 2: Step By Step on Laracasts
• Vue.js 中文教程
• Up and Running with the Vue.js 2.0 Framework on SitePoint
• How to make API Calls with Vuex on Metric Loop
• How to Use Vuex to Build a Feature on Metric Loop
• Vue.js 2.0 Fundamentals on YouTube by DevMarketer
• Vuex For The Clueless — The Missing Primer On Vue’s Application Data Store
• Real-time Grid Component Laravel, Vue.js, Vuex & Socket.io
• VueJS 2 - The Complete Guide (incl. Vuex) - Udemy Tutorial
• Develop Web Apps with Vue.js on egghead.io
• Vue.js 2 - Getting Started
• Vue.js 2 & Vuex (Basics)
• Türkçe VueJS Eğitim Videoları on YouTube by Fatih Acet
• Building a JSON Tree View Component in Vue.js from Scratch in Six Steps on digimondo devblog by Arvid Kahl
• Let's Vue! - OpenLecture 2017.01 in Russian on YouTube by Illya Klymov (@xanf)
• Bootstrapping your first Vue.js application using vue-cli by @afropolymath
• Build vue-hackernews-2.0 from Scratch by @ Detachment
• Role Based Authorization for your Vue.js and Nuxt.js Applications Using vue-kindergarten
• Complete Vue.js Application Tutorial - Creating a Simple Budgeting App with Vue by @matthiaswh
• Vue.js Tutorial: A Prerendered, SEO-Friendly Example
• Vue.js Introduction For People Who Know Just Enough jQuery To Get By
• Fetching Data from a Third-Party API with Vue.js and Axios
• Fun Projects with Vue 2 (Video) by Peter van Meijgaard, Packt. (April 2017)
• Vue JS: Simultaneously Running Express and Webpack Dev Server on Medium by Henrik Fogelberg
• Vue JS 2 Tutorials on Youtube by The Net Ninja
• Add a headless CMS to VueJs in 5 Minutes
• vue 架构中的 Watcher
• Building Your First App With Vue.js
• 5 Practical Examples For Learning Vue.js
• Migrating from KnockoutJS to VueJS by @jesalg
• Create a quiz with Vue.js by @rap2h
• Vue.js: Getting Started by @chadcampbell
• Vue.js 2 & Firebase - Building Real Time Single Page Web Applications
• Vue.js 2 & Vue-Resource - Real-World Application With External API Access
• Interactive Vue.js Screencasts For Beginners
• Vue.JS ile NASA API'ını Kullanarak Veri Çekme on YouTube by Ali GÖREN
• Web development with Vue.js 2 (Video) by Olga Filipova, Packt. (June 2017)
• Build a realtime chart with VueJS and Pusher
• Intro to Vue, repo for Frontend Masters Course
• Vue Guide on CSS-Tricks
• Using Typescript in your VueJS app

Examples

• Starter Application with JWT Auth + sample backend API in Laravel
• Node Webkit + Vue example by @brandonjpierce
• Vue Samples by @superlloyd
• HackerNews clone with vue.js + vue-router by @kazupon
• Electron + Vue example by @bradstewart
• Single page application example (Vue + Voie) by Boris Okunskiy
• Begin - Task Manager SPA written in Vue + Lumen by Raj Abishek
• Vue Mini Shop by BosNaufal
• Vue SoundCloud by mul14
• Feature Requests (Laravel + Vue Combo) by haydenbbickerton
• Vue Cookbook (Vue1.0 + express) by @yjj5855: A demo first screen rendering of a service
• Strong Together - A starter project to build single page Vue.js apps as stand-alone or for Laravel / Laravel Spark projects, based on Browserify and Semantic-ui) by WebSemantics
• vuetest: an ad admin web with user auth, bootstrap ui, uploader, WYSIWYG editor in iframe
• vue-shopping by andylei18
• Vue-cnodejs,060 by @shinygang
• vue-zhihu-daily by hilongjw
• jwt-example by @petervmeijgaard
• VueChess -Multiplayer online chess game by gustaYo
• Ngexplorer-vuejs-client -Vue client for Ngexplorer by gustaYo
• Vue 2048 (Vue + Webpack) by @pengfu: Popular 2048-Game implemented using Vue,Webpack,Sass,ES6
• Vue Simple PWA by BosNaufal
• Tour of Heroes (Vue 2.0): A Vue 2.0 port of the Angular 2.0 Tour of Heroes demo app. Highlights: ES6/7, render functions, JSX, revue (redux bindings for Vue), vue-router, Airbnb eslint, webpack. by @aweber1
• vue-table-pagination A table with pagination by echovic
• Feathers and Vue 2.0 Blog Admin Demo Demo for using Feathers with Vue 2.0. It includes authentication, vue-router, vue-infinite-loading and roles by delay
• vue-zhihudaily-2.0 Zhihudaily demo built with Vue 2.0, vue-router & vuex, with server-side rendering. by cs1707
• vue-demo-todolist a simply vue2.0 demo built with Vue 2.0, vue-cli. by fishenal
• vue-AdminLte by liujians
• Vue(2.0) + Node.js: A blog content manage system (CMS) by @ycwalker
• ngexplorer-quasar -Implementation of Ngexplorer with quasar framework by gustaYo
• zhihu-daily-vue a zhihu daily base on vue2.0 by moonou
• loopback-vue loopback+vue+vue-resource,ionic-app,vue page分页功能,authenticate 权限控制,accesstoken机制,credentials,CI,docker qxl1231
• vue-s3-dropzone A Vue.js drag-and-drop component uploads files to AWS S3 serverlessly
• easy-vue a easy example using the vue to implement easy web with vue 2.0, vuex 2.0, vue-router 2.0, vue-infinite-scroll 2.0, vue-progressbar 2.0 by TIGERB
• Vuex Events Messaging Demo by Metric Loop
• vue-memo a simple demo build with Vue.js(>2.x.), vue-router(>2.x.), vuex(>2.x.), [email protected](>3.x.) and Firebase(>3.6.x) by akifo
• Resume Vue JSON based Resume based on Vue 2.0 by ChangJoo Park
• App example with JWT Authentication developed with Phoenix Framework, Vue and Vue Router (demo) by @Angarsk8
• Sample CRUD app with router in Vue 2.0 by @shershen08
• ASP.NET Core Vue.js server-side rendering sample by @mgyongyosi
• vuefire-quickstart - Documented Firebase integration w/ webpack and eslint, by @sejr.
• hello-vue-django Vue.js and Django integration starter project with hot code reload
• Real Time Social News App developed with Phoenix, Vue, Vue Router and Vuex (demo) by @Angarsk8
• vue-calculator a simply calculator built with Vue 2.0, vue-cli(webpack-simple). by CaiYiLiang
• Wikipedia-viewer A simple wikipedia-viewer page built with vue2.x ,vue-router,vue-cli(webpack-simple) and ajax(jsonp). by CaiYiLiang
• vue2.x-douban A simple of douban movie build with vue2.x,vue-router and axios(豆瓣电影). by Superman
• vue-laravel-example Vue - Laravel - Example is a simple example to set Vue with Laravel. by Jiajian Chan
• vue-foundation A demo app integrating VueJS with Zurb Foundation, built using the webpack vue-cli template
• 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-reddit-app A Reddit SPA demo built with Vue 2.X , Vue Router 2 , Vuex and axios. Using Muse-UI and vue-cli webpack template by @yujiahaol68
• vue-music-qq A qq-music project is based on vue-cli. The pages are simple and smooth
• NavigationTab with Vue-Redux and Plain VueJSX Navigation Tab with both plain Vue JSX and Vue + Redux Binding
• Veggie Map An interactive demo using Vuejs + Vue router + Leaflet and Firebase
• vuejs-d3 examples how to use d3 for visualisations.
• vue-twitter-client A Twitter Client App build with Vue 2.X, Vuex, electron-vue and Electron
• Douban Awesome douban Example created with Vue2.x + Vuex + Vue-router + vue-resource. by jeneser
• Storyblok vuejs-boilerplate - Integrates Storyblok's Component System, allows to create editable Websites.
• Vuexpresso - A boilerplate using VueX, Vue-Router, Vue-Apollo, webpack, GraphQL, Apollo-client, express and mongo
• Vue.js with Sails.js backend example project - This project is for those who are new to single-page applications and want to learn through a real example.
• Vue.js & Pyramid web framework app - A boilerplate using Pylons Pyramid webframework backend Vuejs webpack2, vue-router, yarn(packet manager)
• vue-feathers-chat A sample realtime chat made with Vue in frontend and Feathers in backend, but using just Socket.IO-Client for the communication
• vue-xplan A rotating earth demo page created with Vue and three.js
• vueSocketChatRoom A socket chat room using vue2.x,vuex2.x,vue-router2.x,vux2.x,socket.io
• vue-tetris (Use Vue, Vuex, Immutable to code Tetris) by @Binaryify: Use Vue, Vuex, Immutable to code Tetris.
• route-planner-vue by @Kasheftin: The tool for planning routes with multiple sortable layers, draggable directions, markers and shapes on google map.
• MyDiary-Vue A diary application build with Vue 2.X which is also have contact and todolist function
• VueJS Example Projects on Github by Ali GÖREN
• todo-mvc-webpack by voluntapear TodoMVC implementation on Vue 2 using the webpack-basic template with examples showing vuex, vue-router, central event bus and VueFire.
• Chess Storybook Example with Vue 2.0 by gustaYo
• Vue Weather Notifier A small sample animation app with SVG and Vuex
• Nuxt Type An example Vue project with Nuxt for routing/SSR to demo page transitions
• VueBlog A blog system supporting service side rendering by wmui

Books

• The Majesty Of Vue.js by Alex Kyriakidis & Kostas Maniatis, Packt. (Nov 2016)
• Learning Vue.js 2 by Olga Filipova, Packt. (Dec 2016)
• The Majesty Of Vue.js 2 by Alex Kyriakidis and Kostas Maniatis, Leanpub. (Mar 2017)
• Vue.js 2 Cookbook by Andrea Passaglia, Packt. (May 2017)
• Vue.js in Action by Erik Hanchett and Benjamin Listwon (Spring 2018)

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.
• 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.
• vue-wordpress-pwa
• OpenAPI 3 viewer - Browse and test a REST API described with the OpenAPI 3.0 Specification
  • Stacer - Linux System Optimizer and Monitoring
  • Distrochooser.de - An orientation guide for Linux beginners
  • Buka - EBook Management
  • Docute - A framework for writing documentation without build process
  • pm86 - Production process manager for Node.js apps Websites
  • vms - A Vue.js 2.0 Management System
  • nativescript-vue - A Vue.js implementation of the NativeScript renderer.
  • piper - A drag-and-drop mobile website builder base on Vue.
  • mmf-blog-vue2 - A blog based on Vue2(Vue-router, Vuex) and Webpack2.
  • Media Manager - Web File Manager.
  • dyu/bookmarks - A self-contained, self-hosted bookmarking app powered by leveldb, built with Vue2.1.x.
  • JSON Schema Editor - An intuitive editor for JSON schema. Develop with Vue.js 2 and Firebase.
  • npm-stats - npm package download statistics dashboard
  • vue2-admin-lte - a project that converts AdminLTE to work with Vuejs (v2.x).
  • Dockeron - A project built on Electron + Vue.js for Docker on desktop.
  • Flamme - An open source Tinder desktop client built with electron and Vue.js for educational purposes
  • Goldfish - A HashiCorp Vault UI built with VueJS, Golang, and Bulma CSS
  • Adminify - An Admin dashboard based on Vuetify, check the Online Demo
  • promptie - A framework written in Vue.js for creating command-line like interfaces in web browsers.
  • Hare -