├── content ├── .vuepress │ ├── .gitignore │ ├── public │ │ ├── CNAME │ │ ├── googleb0cb4a6e76619924.html │ │ ├── hero.png │ │ ├── logo.png │ │ ├── robots.txt │ │ ├── icons │ │ │ ├── favicon-16x16.png │ │ │ ├── favicon-32x32.png │ │ │ ├── apple-touch-icon.png │ │ │ ├── mstile-150x150.png │ │ │ ├── android-chrome-192x192.png │ │ │ ├── android-chrome-512x512.png │ │ │ └── safari-pinned-tab.svg │ │ ├── manifest.webmanifest │ │ └── sitemap.xml │ ├── theme │ │ ├── index.js │ │ ├── components │ │ │ ├── NavLink.vue │ │ │ └── Home.vue │ │ └── util │ │ │ └── index.js │ ├── enhanceApp.js │ └── config.js ├── resources │ ├── documentaries.md │ ├── youtube-channels.md │ ├── conferences.md │ ├── official-resources.md │ ├── job-portal.md │ ├── official-examples.md │ ├── courses.md │ ├── external-resources.md │ ├── podcasts.md │ ├── blog-posts.md │ ├── community.md │ ├── books.md │ ├── examples.md │ └── tutorials.md ├── index.md ├── components-and-libraries │ ├── runtime.md │ ├── prerendering.md │ ├── ui-layout.md │ ├── dev-tools.md │ ├── integrations.md │ ├── scaffold.md │ └── frameworks.md └── projects-using-vue-js │ ├── a11y.md │ ├── enterprise-usage.md │ ├── interactive-experiences.md │ ├── commercial-products.md │ └── apps-websites.md ├── .github ├── hero.png ├── CONTRIBUTING.md ├── workflows │ ├── stale.yml │ └── publish.yml └── PULL_REQUEST_TEMPLATE.md ├── .markdownlint.json ├── .editorconfig ├── package.json ├── UNLICENSE ├── .gitignore ├── NOTICE └── README.md /content/.vuepress/.gitignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | -------------------------------------------------------------------------------- /content/.vuepress/public/CNAME: -------------------------------------------------------------------------------- 1 | awesome-vue.js.org 2 | -------------------------------------------------------------------------------- /.github/hero.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/.github/hero.png -------------------------------------------------------------------------------- /.markdownlint.json: -------------------------------------------------------------------------------- 1 | { 2 | "default": true, 3 | "MD013": { "line_length": 1000 } 4 | } 5 | -------------------------------------------------------------------------------- /content/.vuepress/theme/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extend: '@vuepress/theme-default', 3 | }; 4 | -------------------------------------------------------------------------------- /content/.vuepress/public/googleb0cb4a6e76619924.html: -------------------------------------------------------------------------------- 1 | google-site-verification: googleb0cb4a6e76619924.html -------------------------------------------------------------------------------- /content/.vuepress/public/hero.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/content/.vuepress/public/hero.png -------------------------------------------------------------------------------- /content/.vuepress/public/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/content/.vuepress/public/logo.png -------------------------------------------------------------------------------- /content/.vuepress/public/robots.txt: -------------------------------------------------------------------------------- 1 | User-agent: * 2 | Allow: * 3 | 4 | Sitemap: http://awesome-vue.js.org/sitemap.xml 5 | -------------------------------------------------------------------------------- /content/.vuepress/public/icons/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/content/.vuepress/public/icons/favicon-16x16.png -------------------------------------------------------------------------------- /content/.vuepress/public/icons/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/content/.vuepress/public/icons/favicon-32x32.png -------------------------------------------------------------------------------- /content/.vuepress/public/icons/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/content/.vuepress/public/icons/apple-touch-icon.png -------------------------------------------------------------------------------- /content/.vuepress/public/icons/mstile-150x150.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/content/.vuepress/public/icons/mstile-150x150.png -------------------------------------------------------------------------------- /content/.vuepress/public/icons/android-chrome-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/content/.vuepress/public/icons/android-chrome-192x192.png -------------------------------------------------------------------------------- /content/.vuepress/public/icons/android-chrome-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rmjordas/awesome-vue/HEAD/content/.vuepress/public/icons/android-chrome-512x512.png -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = space 5 | indent_size = 2 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | -------------------------------------------------------------------------------- /content/.vuepress/enhanceApp.js: -------------------------------------------------------------------------------- 1 | export default ({ 2 | Vue, 3 | options, 4 | router, 5 | siteData 6 | }) => { 7 | const { routes } = router.options; 8 | 9 | routes.unshift({ 10 | name: 'google-site-verification', 11 | path: '/googleb0cb4a6e76619924.html', 12 | }); 13 | } 14 | -------------------------------------------------------------------------------- /.github/CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing Guide 2 | 3 | Please submit your link(s) to the [official Vue.js Awesome List](https://github.com/vuejs/awesome-vue) repository (read first their [contributing guide](https://github.com/vuejs/awesome-vue/blob/master/.github/contributing.md)). 4 | 5 | If you have any feedback and suggestions for this repository, please [open an issue](https://github.com/rmjordas/awesome-vue/issues/new). 6 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "engines": { 4 | "node": ">=12" 5 | }, 6 | "scripts": { 7 | "dev": "vuepress dev content", 8 | "build": "vuepress build content", 9 | "lint": "markdownlint . -i node_modules", 10 | "test": "npm run lint" 11 | }, 12 | "devDependencies": { 13 | "@vuepress/plugin-back-to-top": "^1.9.10", 14 | "@vuepress/plugin-pwa": "^1.9.10", 15 | "markdownlint-cli": "^0.38.0", 16 | "vuepress": "^1.9.10" 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /content/.vuepress/public/manifest.webmanifest: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Awesome Vue.js", 3 | "short_name": "Awesome Vue.js", 4 | "icons": [ 5 | { 6 | "src": "/icons/android-chrome-192x192.png", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "/icons/android-chrome-512x512.png", 12 | "sizes": "512x512", 13 | "type": "image/png" 14 | } 15 | ], 16 | "start_url": "/index.html", 17 | "display": "standalone", 18 | "theme_color": "#ffffff", 19 | "background_color": "#ffffff" 20 | } 21 | -------------------------------------------------------------------------------- /content/resources/documentaries.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Vue.js documentaries 5 | - name: og:title 6 | content: Documentaries 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/documentaries.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Vue.js documentaries 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Documentaries 19 | - name: twitter:description 20 | content: Vue.js documentaries 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Documentaries 26 | 27 | - [Vue.js: The Documentary](https://www.youtube.com/watch?v=OrxmtDw4pVI) by Honeypot (Feb 2020) 28 | -------------------------------------------------------------------------------- /.github/workflows/stale.yml: -------------------------------------------------------------------------------- 1 | name: Mark stale issues 2 | 3 | on: 4 | schedule: 5 | - cron: "0 0 * * *" 6 | 7 | jobs: 8 | stale: 9 | runs-on: ubuntu-latest 10 | steps: 11 | - uses: actions/stale@v1 12 | with: 13 | repo-token: ${{ secrets.GITHUB_TOKEN }} 14 | stale-issue-message: > 15 | Marking this issue as stale since there has been no activity in the last 30 days. 16 | This issue will be closed in 15 days if stale label is not removed or if there are no new comments. 17 | stale-pr-message: > 18 | Marking this pull request as stale since there has been no activity in the last 30 days. 19 | This pull request will be closed in 15 days if stale label is not removed or if there are no new comments. 20 | stale-issue-label: 'stale' 21 | days-before-stale: 30 22 | days-before-close: 15 23 | -------------------------------------------------------------------------------- /content/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | home: true 3 | heroImage: /hero.png 4 | actionText: Continue → 5 | actionLink: /resources/official-resources 6 | meta: 7 | - name: description 8 | content: A curated list of awesome things related to Vue.js 9 | - name: og:title 10 | content: Awesome Vue.js 11 | - name: og:type 12 | content: website 13 | - name: og:url 14 | content: https://awesome-vue.js.org 15 | - name: og:image 16 | content: https://awesome-vue.js.org/hero.png 17 | - name: og:description 18 | content: A curated list of awesome things related to Vue.js 19 | - name: twitter:card 20 | content: summary 21 | - name: twitter:title 22 | content: Awesome Vue.js 23 | - name: twitter:description 24 | content: A curated list of awesome things related to Vue.js 25 | - name: twitter:image:src 26 | content: https://awesome-vue.js.org/hero.png 27 | --- 28 | -------------------------------------------------------------------------------- /.github/workflows/publish.yml: -------------------------------------------------------------------------------- 1 | name: GitHub Pages 2 | 3 | on: 4 | push: 5 | branches: 6 | - master 7 | 8 | jobs: 9 | deploy: 10 | runs-on: ubuntu-latest 11 | 12 | steps: 13 | - uses: actions/checkout@v3 14 | with: 15 | fetch-depth: 0 16 | 17 | - uses: actions/setup-node@v3 18 | with: 19 | node-version: 16 20 | cache: 'npm' 21 | 22 | - name: Install dependencies 23 | run: npm ci 24 | 25 | - name: Lint markdown files 26 | run: npm run lint 27 | 28 | - name: Build static site 29 | run: npm run build 30 | 31 | - name: Deploy to GitHub Pages 32 | uses: crazy-max/ghaction-github-pages@v2 33 | with: 34 | target_branch: gh-pages 35 | build_dir: content/.vuepress/dist 36 | env: 37 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 38 | -------------------------------------------------------------------------------- /content/resources/youtube-channels.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Vue.js YouTube channels 5 | - name: og:title 6 | content: YouTube Channels 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/youtube-channels.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Vue.js YouTube channels 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Tutorials 19 | - name: twitter:description 20 | content: Vue.js YouTube channels 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # YouTube Channels 26 | 27 | - [VueNYC](https://www.youtube.com/vuenyc) 28 | - [VueConf EU](https://www.youtube.com/channel/UC9dJjbYeXjirDYYVfUD3bSw) 29 | -------------------------------------------------------------------------------- /content/resources/conferences.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Vue.js conferences 5 | - name: og:title 6 | content: Conferences 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/conferences.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Vue.js conferences 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Conferences 19 | - name: twitter:description 20 | content: Vue.js conferences 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Conferences 26 | 27 | - [VueConf](https://conf.vuejs.org) 28 | - [Vue.js London](https://vuejs.london) 29 | - [VueConf US](https://vueconf.us) 30 | - [VueConf Toronto](https://vuetoronto.com) 31 | - [Vue.js Amsterdam](https://vuejs.amsterdam) 32 | -------------------------------------------------------------------------------- /content/resources/official-resources.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Official Vue.js resources 5 | - name: og:title 6 | content: Official Resources 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/official-resources.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Official Vue.js resources 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Official Resources 19 | - name: twitter:description 20 | content: Official Vue.js resources 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Official Resources 26 | 27 | - [Official Guide](https://vuejs.org/guide/) 28 | - [API Reference](https://vuejs.org/api/) 29 | - [GitHub Repo](https://github.com/vuejs/vue) 30 | - [Release Notes](https://github.com/vuejs/vue/releases) 31 | - [Style Guide](https://vuejs.org/v2/style-guide/) 32 | - [Vue.js News](https://news.vuejs.org/) 33 | -------------------------------------------------------------------------------- /content/resources/job-portal.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Vue.js job portal 5 | - name: og:title 6 | content: Job Portal 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/job-portal.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Vue.js job portal 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Job Portal 19 | - name: twitter:description 20 | content: Vue.js job portal 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Job Portal 26 | 27 | - [Vue.js Jobs - VueJobs](https://vuejobs.com/) - A Vue.js job portal to hire or get hired for all your Vue.js jobs. 28 | - [Vue.js Interview Questions](https://github.com/sudheerj/vuejs-interview-questions) - A List of 300 VueJS Interview Questions and Answers 29 | - [Prokarman Resume Builder](https://prokarman.com/) - A Free Resume Builder for crafting resumes for your dream job 30 | -------------------------------------------------------------------------------- /content/components-and-libraries/runtime.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Libraries for running Vue.js applications outside of the browser 5 | - name: og:title 6 | content: Runtime 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/components-and-libraries/runtime.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Libraries for running Vue.js applications outside of the browser 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Runtime 19 | - name: twitter:description 20 | content: Libraries for running Vue.js applications outside of the browser 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Runtime 26 | 27 | ## Command Line / Terminal 28 | 29 | - [blessed-vue](https://github.com/lyonlai/blessed-vue) - A VueJS runtime to let you write command line UI in Vue Edit 30 | - [temir](https://github.com/webfansplz/temir) - Vue for interactive command-line apps 31 | -------------------------------------------------------------------------------- /content/resources/official-examples.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Official examples from Vue.js developers 5 | - name: og:title 6 | content: Official Examples 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/official-examples.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Official examples from Vue.js developers 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Official Examples 19 | - name: twitter:description 20 | content: Official examples from Vue.js developers 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Official Examples 26 | 27 | - [Vue.js TodoMVC](https://github.com/vuejs/vue/tree/dev/examples/todomvc) 28 | - [CoffeeScript Version](https://github.com/anfelor/TodoMVC-CoffeeScript-and-Vue.js) 29 | - [Vue.js HackerNews Clone](https://github.com/vuejs/vue-hackernews) 30 | - [Vue.js 2.0 HackerNews Clone](https://github.com/vuejs/vue-hackernews-2.0) 31 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | # Please Read 2 | 3 | ## Link Submission 4 | 5 | Please submit your link(s) to the [official Vue.js Awesome List](https://github.com/vuejs/awesome-vue) repository (read first their [contributing guide](https://github.com/vuejs/awesome-vue/blob/master/.github/contributing.md)). 6 | 7 | If they merge your pull request there, it will also be updated in this repository. 8 | 9 | _But if you really want to add it here, I would still review it._ 10 | 11 | ## Bug Fix or New Feature 12 | 13 | For bug fixes or new features to this repository, delete this template text and proceed to provide information about the changes introduced in this pull request. 14 | 15 | ## Contribution Agreement 16 | 17 | By submitting a pull request to this repository, you are accepting this contribution agreement: 18 | 19 | > I dedicate any and all copyright interest in this software to the public domain. I make this dedication for the benefit of the public at large and to the detriment of my heirs and successors. I intend this dedication to be an overt act of relinquishment in perpetuity of all present and future rights to this software under copyright law. 20 | -------------------------------------------------------------------------------- /UNLICENSE: -------------------------------------------------------------------------------- 1 | This is free and unencumbered software released into the public domain. 2 | 3 | Anyone is free to copy, modify, publish, use, compile, sell, or 4 | distribute this software, either in source code form or as a compiled 5 | binary, for any purpose, commercial or non-commercial, and by any 6 | means. 7 | 8 | In jurisdictions that recognize copyright laws, the author or authors 9 | of this software dedicate any and all copyright interest in the 10 | software to the public domain. We make this dedication for the benefit 11 | of the public at large and to the detriment of our heirs and 12 | successors. We intend this dedication to be an overt act of 13 | relinquishment in perpetuity of all present and future rights to this 14 | software under copyright law. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 17 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 18 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. 19 | IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR 20 | OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, 21 | ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 22 | OTHER DEALINGS IN THE SOFTWARE. 23 | 24 | For more information, please refer to 25 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | 8 | # Runtime data 9 | pids 10 | *.pid 11 | *.seed 12 | *.pid.lock 13 | 14 | # Directory for instrumented libs generated by jscoverage/JSCover 15 | lib-cov 16 | 17 | # Coverage directory used by tools like istanbul 18 | coverage 19 | 20 | # nyc test coverage 21 | .nyc_output 22 | 23 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 24 | .grunt 25 | 26 | # Bower dependency directory (https://bower.io/) 27 | bower_components 28 | 29 | # node-waf configuration 30 | .lock-wscript 31 | 32 | # Compiled binary addons (https://nodejs.org/api/addons.html) 33 | build/Release 34 | 35 | # Dependency directories 36 | node_modules/ 37 | jspm_packages/ 38 | 39 | # TypeScript v1 declaration files 40 | typings/ 41 | 42 | # Optional npm cache directory 43 | .npm 44 | 45 | # Optional eslint cache 46 | .eslintcache 47 | 48 | # Optional REPL history 49 | .node_repl_history 50 | 51 | # Output of 'npm pack' 52 | *.tgz 53 | 54 | # Yarn Integrity file 55 | .yarn-integrity 56 | 57 | # dotenv environment variables file 58 | .env 59 | 60 | # next.js build output 61 | .next 62 | 63 | # vuepress build output 64 | .vuepress/dist 65 | 66 | # Serverless directories 67 | .serverless 68 | 69 | # Project 70 | .temp 71 | .cache 72 | -------------------------------------------------------------------------------- /content/resources/courses.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Vue.js courses 5 | - name: og:title 6 | content: Courses 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/courses.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Vue.js courses 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Courses 19 | - name: twitter:description 20 | content: Vue.js courses 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Courses 26 | 27 | - [Learn Vue by Building and Deploying a CRUD App](https://testdriven.io/courses/learn-vue/) - This course is focused on teaching the fundamentals of Vue by building and testing a web application using Test-Driven Development (TDD) 28 | - [Introduction to Vue.js](https://frontendmasters.com/courses/vue/) - An introductory course that explores the basics of features like directives and modifiers, concepts like components, reactive programming, Nuxt.js, and Vuex 29 | - [Advanced Vue.js Features from the Ground Up](https://frontendmasters.com/courses/advanced-vue/) - Learn how to build more accessible routing, state management, form validation and internationalization libraries from the ground up 30 | - [Become a Ninja with Vue 3](https://vue-exercises.ninja-squad.com) - This course teaches how to build a complete application with Vue 3, step by step, using Vue CLI, TypeScript and the Composition API. Each exercise comes with instructions and tests to check 100% of your code 31 | -------------------------------------------------------------------------------- /NOTICE: -------------------------------------------------------------------------------- 1 | Homepage theme and associated utilities are based on the official Vuepress default theme which is 2 | licensed under the terms of the MIT License: 3 | 4 | - content/.vuepress/theme/components/Home.vue 5 | - content/.vuepress/theme/components/NavLink.vue 6 | - content/.vuepress/theme/util/index.js 7 | 8 | 9 | 10 | 11 | ================================================================================ 12 | 13 | 14 | 15 | 16 | -------------------------------- 17 | Vuepress's MIT License 18 | -------------------------------- 19 | 20 | 21 | 22 | 23 | The MIT License (MIT) 24 | 25 | Copyright (c) 2018-present, Yuxi (Evan) You 26 | 27 | Permission is hereby granted, free of charge, to any person obtaining a copy 28 | of this software and associated documentation files (the "Software"), to deal 29 | in the Software without restriction, including without limitation the rights 30 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 31 | copies of the Software, and to permit persons to whom the Software is 32 | furnished to do so, subject to the following conditions: 33 | 34 | The above copyright notice and this permission notice shall be included in 35 | all copies or substantial portions of the Software. 36 | 37 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 38 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 39 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 40 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 41 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 42 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 43 | THE SOFTWARE. 44 | -------------------------------------------------------------------------------- /content/projects-using-vue-js/a11y.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Resources and libraries for making accessible Vue.js applications 5 | - name: og:title 6 | content: A11y 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/projects-using-vue-js/a11y.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Resources and libraries for making accessible Vue.js applications 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: A11y 19 | - name: twitter:description 20 | content: Resources and libraries for making accessible Vue.js applications 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # A11y 26 | 27 | - [Vue A11y project](https://github.com/vue-a11y) - Vue.js community project to improve web accessibility. 28 | - [vue-skip-to](https://github.com/vue-a11y/vue-skip-to) - It helps people who only use the keyboard to jump to what matters most. 29 | - [vue-axe](https://github.com/vue-a11y/vue-axe) - Accessibility auditing for Vue.js applications. 30 | - [vue-announcer](https://github.com/vue-a11y/vue-announcer) - A simple way with Vue to announce any useful information for screen readers. 31 | - [eslint-plugin-vue-a11y](https://github.com/maranran/eslint-plugin-vue-a11y) - Static AST checker for accessibility rules on elements in .vue 32 | - [vue-focus-lock](https://github.com/theKashey/vue-focus-lock) - It is a trap! A lock for a Focus. A11y util for scoping a focus. 33 | - [vue-a11y-calendar](https://github.com/IBM/vue-a11y-calendar) - Accessible, internationalized Vue calendar. 34 | - [eslint-plugin-vuejs-accessibility](https://github.com/vue-a11y/eslint-plugin-vuejs-accessibility) - Vue.js accessibility eslint-plugin managed by [vue-a11y](https://github.com/vue-a11y). 35 | -------------------------------------------------------------------------------- /content/components-and-libraries/prerendering.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Libraries for generating static HTML pages of your Vue.js app 5 | - name: og:title 6 | content: Prerendering 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/components-and-libraries/prerendering.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Libraries for generating static HTML pages of your Vue.js app 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Prerendering 19 | - name: twitter:description 20 | content: Libraries for generating static HTML pages of your Vue.js app 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Prerendering 26 | 27 | - [react-snap](https://github.com/stereobooster/react-snap) - A zero-configuration static pre-renderer for SPA 28 | - [prerender-plugin](https://github.com/mubaidr/prerender-plugin) - A Node.js/ webpack plugin to prerender static HTML in a single-page application (SPA). 29 | - [vue-prerender](https://github.com/eldarc/vue-prerender) - A Vue.js tailored plugin which implements three strategies for prerendering Vue.js pages using headless chrome. 30 | - [Rendora](https://github.com/rendora/rendora) - dynamic SSR (server-side rendering) using headless Chrome to effortlessly solve the SEO problem for modern javascript websites 31 | - [pre-vue](https://github.com/mtlynch/pre-vue) - A boilerplate Vue + Nuxt project that offers built-in support for OpenGraph tags, Google Analytics, a sitemap, and robots.txt 32 | - [ssr-vuejs-nodejs](https://github.com/gustavoSoriano/ssr-vuejs-nodejs) - Server-side render Vue.js with Node.js without Nuxt 33 | - [vue-genesis](https://github.com/fmfe/genesis) - Micro front-end, microservice and lightweight solution based on Vue SSR 34 | -------------------------------------------------------------------------------- /content/.vuepress/theme/components/NavLink.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 91 | -------------------------------------------------------------------------------- /content/projects-using-vue-js/enterprise-usage.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: List of companies that use Vue.js for their applications 5 | - name: og:title 6 | content: Enterprise Usage 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/projects-using-vue-js/enterprise-usage.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: List of companies that use Vue.js for their applications 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Enterprise Usage 19 | - name: twitter:description 20 | content: List of companies that use Vue.js for their applications 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Enterprise Usage 26 | 27 | - Alibaba 28 | - Baidu 29 | - Sina Weibo 30 | - Xiaomi 31 | - Ele.me 32 | - Optimizely 33 | - Expedia 34 | - UCWeb 35 | - Line 36 | - Nintendo 37 | - Celtra 38 | - [Sainsbury's](https://sainsburys.jobs/) 39 | - [AREX](https://arex.io/) 40 | - DJI 41 | - Octimine GmbH 42 | - Hunliji 43 | - [GitLab](https://about.gitlab.com/2016/10/20/why-we-chose-vue/) 44 | - [Clemenger BBDO Melbourne](https://clemengerbbdo.com.au) 45 | - [ZenMate](https://zenmate.com) 46 | - [Codeship](https://blog.codeship.com/consider-vuejs-next-web-project/) 47 | - [Storyblok](https://app.storyblok.com) 48 | - [Monito](https://www.monito.com) - Building the Booking.com for international money transfers 49 | - [Hypefactors](https://hypefactors.com) - Software for data-driven PR professionals 50 | - Adobe 51 | - IBM 52 | - [Cotabox](https://cotabox.com.br) 53 | - [Aromajoin](https://aromajoin.com) - Develop the finest digital scent products based on the harmony of hardware, software and material technology. 54 | - [Carrefour](https://www.carrefour.fr) 55 | - [Staples Canada](https://www.staples.ca/) 56 | - [Blibli](https://www.blibli.com) 57 | - [Manduka](https://www.manduka.com/) 58 | - [Louis Vuitton](https://us.louisvuitton.com/eng-us/homepage) 59 | - [Flutterwave](https://flutterwave.com) 60 | - [Upwork](https://www.upwork.com/) - Work marketplace for freelancers and employers 61 | -------------------------------------------------------------------------------- /content/projects-using-vue-js/interactive-experiences.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Interactive Vue.js web applications 5 | - name: og:title 6 | content: Interactive Experiences 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/projects-using-vue-js/interactive-experiences.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Interactive Vue.js web applications 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Interactive Experiences 19 | - name: twitter:description 20 | content: Interactive Vue.js web applications 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Interactive Experiences 26 | 27 | - [YouTube AdBlitz 2016](https://adblitz.withyoutube.com/#!/advertisers) 28 | - [Omnisense Experience](http://omnisense.net) 29 | - [Louis Ansa Website (portfolio)](https://louisansa.com) 30 | - [Djeco.com](http://www.djeco.com/en) 31 | - [Tolks.io](https://tolks.io) 32 | - [NOIZE original](https://noizeoriginal.com) 33 | - [TR-101 Synth Drum Machine](https://inverted3.gitlab.io/drum-machine) 34 | - [Bootstrap 4 Editor](https://www.itwonders-web.com/bootstrap4-editor/) 35 | - [Subtletab - Browser Extension](https://subtletab.com) 36 | - [web-riimote](https://web-riimote.herokuapp.com) - Turn your smartphone into a 3D controller ([source code](https://github.com/konaraddio/web-riimote)) 37 | - [CSS ColorVars](https://csscolorvars.github.io/) - Interactive tool code generation ([source code](https://github.com/CSSColorVars/csscolorvars)) 38 | - [Nightlight During Conflict](https://pngk.org/nightlight/) - Explore GIS data on nightlight output for countries in conflict 39 | - [User Friendly Justice Data](https://justicemoroccoprototype.hiil.org/) - Explore justice data from Morocco 40 | - [Thing](https://github.com/snturk/thing) - Breath exercise & meditation web app made with Vue 41 | - [Vue Play](https://www.vueplay.com) - Create Vue components and applications in an interactive/visual drag & drop designer 42 | - [Yahya J. Aifit's Portfolio Site](https://yja.me) - Portfolio site that inspired by the appearance of desktop operating system 43 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 |

3 | 4 |
5 | 6 | Awesome Vue.js 7 | 8 |
9 |
10 | 11 | Awesome Vue.js 12 | 13 |

14 | 15 |

A curated list of awesome things related to Vue.js

16 | 17 |

18 | 19 | Deploy to GitHub Pages build status badge 20 | 21 | 22 | 23 | Awesome Vue.js website 24 | 25 |

26 | 27 |
28 | 29 | 30 | This project does not aim to replace the **[official Vue.js Awesome List][vuejs/awesome-vue]** but rather to provide a nicer experience when browsing the content. 31 | 32 | [vuejs/awesome-vue]: https://github.com/vuejs/awesome-vue 33 | 34 | ## Instructions 35 | 36 | To run this application on your machine, first clone the repository and install the required dependencies: 37 | 38 | ```bash 39 | git clone https://github.com/rmjordas/awesome-vue.git 40 | cd awesome-vue 41 | npm install 42 | ``` 43 | 44 | Run the `dev` script to compile the content and spawn a local server to serve the compiled code. While this script is running, any changes made to the markdown files will automatically be updated on the locally served pages. 45 | 46 | ```bash 47 | npm run dev 48 | ``` 49 | 50 | To prepare the application for deployment, first run `npm run build` to compile the application in production mode. This will generate a directory in `content/.vuepress` called **`dist`**. 51 | 52 | ```bash 53 | npm run build 54 | # You can use `serve` to inspect the output 55 | npm install -g serve 56 | serve content/.vuepress/dist 57 | ``` 58 | 59 | ## Scripts 60 | 61 | | Script | Description | 62 | |---------|---------------------------------------------------------| 63 | | `dev` | Compiles content and serves bundled code | 64 | | `build` | Compiles content and other static assets for deployment | 65 | | `lint` | Runs markdown linter to check lint errors | 66 | | `test` | An alias for `lint` (runs `lint` script) | 67 | 68 | ## Contributing 69 | 70 | Please refer to the [Contributing Guide](.github/CONTRIBUTING.md). 71 | 72 | ## License 73 | 74 | This is free and unencumbered software released into the public domain. 75 | 76 | For more information, please refer to 77 | -------------------------------------------------------------------------------- /content/resources/external-resources.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: External resources for Vue.js 5 | - name: og:title 6 | content: External Resources 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/external-resources.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: External resources for Vue.js 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: External Resources 19 | - name: twitter:description 20 | content: External resources for Vue.js 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # External Resources 26 | 27 | - [Vue.js資料まとめ(for japanese)](https://gist.github.com/hashrock/f575928d0e109ace9ad0) by @hashrock 28 | - [Vue.js Wikipedia](https://en.wikipedia.org/wiki/Vue.js) 29 | - [Weekly Vue.js Newsletter](https://mokkapps.de/newsletter) - Weekly Vue.js news & tips by @mokkapps 30 | - [Vue News](https://vuenews.io) - Social website focusing on the latest Vue.js news and information. 31 | - [Vue Curated Resources](https://hackr.io/tutorials/learn-vue-js) - Recommended Vue.js courses and tutorials. 32 | - [Vue School](https://vueschool.io) - Learn Vue.js from video courses by core members and industry experts 33 | - [VueDose](https://vuedose.tips) - Tips & tricks about the Vue ecosystem, for busy devs. 34 | - [Vue.js DEV Community](https://dev.to/t/vue) - Official tag for the Vue.js JavaScript Framework on DEV.to 35 | - [Vue.js Online Courses Directory](https://classpert.com/vuejs) - Vue.js courses from top e-learning platforms curated by Classpert, a online course search engine 36 | - [WebTechSurvey.com](https://webtechsurvey.com/technology/vue.js) - An extensive list of websites created with the Vue.js Javascript framework 37 | - [Vue Mastery](https://www.vuemastery.com) - The ultimate learning resource for Vue developers 38 | - [Vue 3 Video Playlist](https://www.youtube.com/playlist?list=PLMLZt4pr7Aq6AfC_ynfeDbEk2hbMFGpHO) - Amazing Vue 3 tutorials and experiments 39 | - [Vue.js Workshops](https://public.vuejsworkshops.com) - Learn Vue 2, in browser, by building 3 applications: Landing page, Todos App and Podcasts aggregator. (Vue.js, Vue-Router, Vuex, Vue-Axios, Vue-Apollo) 40 | - [Vue.js Articles](https://thewebdev.info/category/javascript/vue/) - Assorted Vue 2 and 3 tutorials and articles 41 | - [Best vue.js Courses On YouTube](https://www.nbshare.io/blog/best-vue-js-courses-on-youtube/) - Handpicked list of best Vue.js tutorials on YouTube 42 | - [Notes on Vue](https://notes-on-vue.ackzell.dev/) - A personal guide to Vue development 43 | - [Vue-FAQ](https://vue-faq.org/) - FAQ about frontend in general and Vue.js in particular 44 | -------------------------------------------------------------------------------- /content/resources/podcasts.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Podcast episodes that talk about Vue.js 5 | - name: og:title 6 | content: Podcasts 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/podcasts.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Podcast episodes that talk about Vue.js 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Podcasts 19 | - name: twitter:description 20 | content: Podcast episodes that talk about Vue.js 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Podcasts 26 | 27 | - [Full Stack Radio #30 (11-23-2015)](http://www.fullstackradio.com/30) 28 | - [Changelog #184 (11-27-2015)](https://changelog.com/podcast/184) 29 | - [Software Engineering Daily (12-29-2015)](https://softwareengineeringdaily.com/2015/12/29/front-end-javascript-with-evan-you/) 30 | - [JavaScript Air 016 (03-30-2016)](https://javascriptair.com/episodes/2016-03-30/) 31 | - [Codecasts #2 - Falando Sobre Vuejs e Web Components (2016-08-19) \[pt-BR\]](https://soundcloud.com/codecasts/2-falando-sobre-vuejs-e-web-components) 32 | - [Full Stack Radio #50 (09-21-2016)](http://www.fullstackradio.com/50) 33 | - [和 Vue.js 框架的作者聊聊前端框架开发背后的故事 \[zh-CN\]](https://teahour.fm/78) 34 | - [MW S04E08 - Vue.js with Evan You and Sarah Drasner (04-27-2017)](https://modernweb.podbean.com/e/mw-s04e09-evan-yu-sarah-drasner/) 35 | - [Request For Commits #12 - Crowdfunding Open Source (Vue.js) (06-15-2017)](https://changelog.com/rfc/12) 36 | - [The Web Platform Podcast 132: Vue.js (07-27-2017)](https://thewebplatformpodcast.com/132-vuejs) 37 | - [Animating VueJS with Sarah Drasner (Software Engineering Daily 01-12-2017)](https://softwareengineeringdaily.com/2017/12/01/animating-vuejs-with-sarah-drasner/) 38 | - [Vue podcast list via The QIT Tech Podcast Indexer](https://qit.cloud/search/vue) 39 | - [DNE 138 - Vale a pena VueJS? (01-05-2018)](https://devnaestrada.com.br/2018/01/05/vale-pena-vuejs.html) 40 | - [Cynical Developer #99 (10-15-2018)](https://cynicaldeveloper.com/podcast/99/) 41 | - [Syntax #130 (03-27-2019)](https://syntax.fm/show/130/the-vuejs-show-scott-teaches-wes) 42 | - [Enjoy the Vue: The new Vue.js podcast](https://enjoythevue.io/) 43 | - [What is Pinia? with @posva (My typeof Radio) \[es-MX\]](https://www.mytypeof.dev/1190693/9610327-que-es-pinia-con-posva) 44 | - [Evolution of Vue - Part I (My typeof Radio) \[es-MX\]](https://www.mytypeof.dev/1190693/7055926-evolucion-de-vue-parte-i) 45 | - [Evolution of Vue - Part II (My typeof Radio) \[es-MX\]](https://www.mytypeof.dev/1190693/7068499-evolucion-de-vue-parte-ii) 46 | - [Evolution of Vue - Part III (My typeof Radio) \[es-MX\]](https://www.mytypeof.dev/1190693/7136740-evolucion-de-vue-parte-iii) 47 | - [React vs Vue - their communities (My typeof Radio) \[es-MX\]](https://www.mytypeof.dev/1190693/6151663-react-vs-vue-las-comunidades) 48 | - [Views on Vue (weekly podcast on Vue)](https://topenddevs.com/podcasts/views-on-vue) 49 | -------------------------------------------------------------------------------- /content/resources/blog-posts.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Blog posts about Vue.js 5 | - name: og:title 6 | content: Blog Posts 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/blog-posts.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Blog posts about Vue.js 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Blog Posts 19 | - name: twitter:description 20 | content: Blog posts about Vue.js 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Blog Posts 26 | 27 | - [Vue x Hasura GraphQL](https://medium.com/@malgamves/vue-x-hasura-graphql-d66f585a3ba5) 28 | - [Using GraphQL Mutations in Vue.js](https://medium.com/@malgamves/using-graphql-mutations-in-vue-js-3b4570234edf) 29 | - [Learn How To Build A Data-Driven Search UI with Vue.JS](https://medium.appbase.io/learn-how-to-build-a-github-search-explorer-app-with-vue-js-c66f61d6e152) 30 | - [Using GitLab CI/CD to auto-deploy your Vue.js application to AWS S3](https://medium.com/@croo/using-gitlab-ci-cd-to-auto-deploy-your-vue-js-application-to-aws-s3-9affe1eb3457) 31 | - [Dockerizing a Vue App](https://mherman.org/blog/dockerizing-a-vue-app/) 32 | - [Deploying a Flask and Vue App to Heroku with Docker and Gitlab CI](https://testdriven.io/blog/deploying-flask-to-heroku-with-docker-and-gitlab/) 33 | - [Large-scale Vuex application structures](https://medium.com/3yourmind/large-scale-vuex-application-structures-651e44863e2f) 34 | - [Composing computed properties in Vue.js](https://medium.com/@kevin_peters/composing-computed-properties-in-vue-js-87b4507af079) 35 | - [Learn how to refactor Vue.js Single File Components with a real-world example](https://medium.com/@kevin_peters/learn-how-to-refactor-vue-js-single-file-components-on-a-real-world-example-501b3952ae49) 36 | - [Get Started Writing Class-based Vue.js Apps in TypeScript](https://www.sitepoint.com/class-based-vue-js-typescript) 37 | - [Vue.js with TypeScript](https://johnpapa.net/vue-typescript) by [John Papa](https://johnpapa.net/about/) 38 | - [Guide to Unit Testing Vue Components](https://testdriven.io/blog/vue-unit-testing/) 39 | - [Realtime chat App with Vue and Hasura](https://dev.to/hasurahq/realtime-chat-app-with-vue-and-hasura-202h) 40 | - [Vue vs React: Which is the better framework?](https://buttercms.com/blog/vue-vs-react-which-is-the-better-framework) 41 | - [Building a Beautiful Animated News App with Vue.js and Vuetify](https://buttercms.com/blog/build-a-beautiful-animated-news-app-with-vuejs-and-vuetify) 42 | - [Comparing Angular vs Vue](https://buttercms.com/blog/comparing-angular-vs-vue) 43 | - [Vue vs. React – Which Should You Pick For Your Next Web Project?](https://www.ideamotive.co/blog/vue-vs-react?utm_source=awesome-vue.js.org&utm_medium=social&utm_campaign=vue-vs-react) 44 | - [Vue.js from scratch series](https://www.youtube.com/playlist?list=PLLhEJK7fQIxDWDJEyeT68wT8ZroODeRuw) on YouTube by Paris Nakita Kejser 45 | - [10 Quick-Fire Vue Interview Questions](https://medium.com/javascript-in-plain-english/10-quick-fire-vue-interview-questions-3c16d14a3b51) 46 | - [VueJS Admin Template](https://themeselection.com/vuejs-admin-template/) - Collection of awesome opens source and premium Vue.js admin templates 47 | -------------------------------------------------------------------------------- /content/.vuepress/config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | title: 'Awesome Vue.js', 3 | description: 'A curated list of awesome things related to Vue.js', 4 | head: [ 5 | ['meta', { name: 'viewport', content: 'width=device-width, initial-scale=1' }], 6 | ['link', { rel: 'icon', href: `/logo.png` }], 7 | ['link', { rel: 'manifest', href: '/manifest.webmanifest' }], 8 | ['meta', { name: 'theme-color', content: '#3eaf7c' }], 9 | ['meta', { name: 'apple-mobile-web-app-capable', content: 'yes' }], 10 | ['meta', { name: 'apple-mobile-web-app-status-bar-style', content: 'black' }], 11 | ['link', { rel: 'apple-touch-icon', href: `/icons/apple-touch-icon.png` }], 12 | ['link', { rel: 'mask-icon', href: '/icons/safari-pinned-tab.svg', color: '#3eaf7c' }], 13 | ['meta', { name: 'msapplication-TileImage', content: '/icons/msapplication-icon-144x144.png' }], 14 | ['meta', { name: 'msapplication-TileColor', content: '#fff' }] 15 | ], 16 | plugins: { 17 | '@vuepress/pwa': { 18 | serviceWorker: true, 19 | updatePopup: true 20 | }, 21 | '@vuepress/back-to-top': true, 22 | }, 23 | base: '/', 24 | themeConfig: { 25 | activeHeaderLinks: false, 26 | algolia: { 27 | apiKey: 'b99936b745ef54d9428c2ba55c88c7a3', 28 | indexName: 'rmjordas_awesome_vue' 29 | }, 30 | repo: 'rmjordas/awesome-vue', 31 | docsDir: 'content', 32 | editLinks: true, 33 | lastUpdated: 'Last Updated', 34 | nav: [ 35 | { text: 'Contribute 💚', link: 'https://github.com/sponsors/rmjordas' }, 36 | ], 37 | sidebar: [ 38 | { 39 | title: 'Resources', 40 | collapsable: false, 41 | children: [ 42 | '/resources/official-resources', 43 | '/resources/external-resources', 44 | '/resources/job-portal', 45 | '/resources/community', 46 | '/resources/conferences', 47 | '/resources/podcasts', 48 | '/resources/youtube-channels', 49 | '/resources/official-examples', 50 | '/resources/tutorials', 51 | '/resources/examples', 52 | '/resources/books', 53 | '/resources/blog-posts', 54 | '/resources/courses', 55 | '/resources/documentaries', 56 | ], 57 | }, 58 | { 59 | title: 'Projects Using Vue.js', 60 | collapsable: false, 61 | children: [ 62 | '/projects-using-vue-js/open-source', 63 | '/projects-using-vue-js/commercial-products', 64 | '/projects-using-vue-js/apps-websites', 65 | '/projects-using-vue-js/interactive-experiences', 66 | '/projects-using-vue-js/enterprise-usage', 67 | '/projects-using-vue-js/a11y', 68 | ], 69 | }, 70 | { 71 | title: 'Components and Libraries', 72 | collapsable: false, 73 | children: [ 74 | '/components-and-libraries/ui-components', 75 | '/components-and-libraries/ui-layout', 76 | '/components-and-libraries/frameworks', 77 | '/components-and-libraries/ui-utilities', 78 | '/components-and-libraries/utilities', 79 | '/components-and-libraries/integrations', 80 | '/components-and-libraries/dev-tools', 81 | '/components-and-libraries/scaffold', 82 | '/components-and-libraries/runtime', 83 | '/components-and-libraries/prerendering', 84 | ], 85 | }, 86 | ] 87 | } 88 | }; 89 | -------------------------------------------------------------------------------- /content/.vuepress/public/icons/safari-pinned-tab.svg: -------------------------------------------------------------------------------- 1 | 2 | 4 | 7 | 8 | Created by potrace 1.11, written by Peter Selinger 2001-2013 9 | 10 | 12 | 31 | 35 | 40 | 45 | 49 | 52 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /content/.vuepress/public/sitemap.xml: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | 9 | 10 | https://awesome-vue.js.org/ 11 | 1.00 12 | 13 | 14 | https://awesome-vue.js.org/resources/official-resources.html 15 | 0.80 16 | 17 | 18 | https://awesome-vue.js.org/resources/external-resources.html 19 | 0.80 20 | 21 | 22 | https://awesome-vue.js.org/resources/job-portal.html 23 | 0.80 24 | 25 | 26 | https://awesome-vue.js.org/resources/community.html 27 | 0.80 28 | 29 | 30 | https://awesome-vue.js.org/resources/conferences.html 31 | 0.80 32 | 33 | 34 | https://awesome-vue.js.org/resources/podcasts.html 35 | 0.80 36 | 37 | 38 | https://awesome-vue.js.org/resources/youtube-channels.html 39 | 0.80 40 | 41 | 42 | https://awesome-vue.js.org/resources/official-examples.html 43 | 0.80 44 | 45 | 46 | https://awesome-vue.js.org/resources/tutorials.html 47 | 0.80 48 | 49 | 50 | https://awesome-vue.js.org/resources/examples.html 51 | 0.80 52 | 53 | 54 | https://awesome-vue.js.org/resources/books.html 55 | 0.80 56 | 57 | 58 | https://awesome-vue.js.org/resources/blog-posts.html 59 | 0.80 60 | 61 | 62 | https://awesome-vue.js.org/projects-using-vue-js/open-source.html 63 | 0.80 64 | 65 | 66 | https://awesome-vue.js.org/projects-using-vue-js/commercial-products.html 67 | 0.80 68 | 69 | 70 | https://awesome-vue.js.org/projects-using-vue-js/apps-websites.html 71 | 0.80 72 | 73 | 74 | https://awesome-vue.js.org/projects-using-vue-js/interactive-experiences.html 75 | 0.80 76 | 77 | 78 | https://awesome-vue.js.org/projects-using-vue-js/enterprise-usage.html 79 | 0.80 80 | 81 | 82 | https://awesome-vue.js.org/projects-using-vue-js/a11y.html 83 | 0.80 84 | 85 | 86 | https://awesome-vue.js.org/components-and-libraries/ui-components.html 87 | 0.80 88 | 89 | 90 | https://awesome-vue.js.org/components-and-libraries/ui-layout.html 91 | 0.80 92 | 93 | 94 | https://awesome-vue.js.org/components-and-libraries/frameworks.html 95 | 0.80 96 | 97 | 98 | https://awesome-vue.js.org/components-and-libraries/ui-utilities.html 99 | 0.80 100 | 101 | 102 | https://awesome-vue.js.org/components-and-libraries/utilities.html 103 | 0.80 104 | 105 | 106 | https://awesome-vue.js.org/components-and-libraries/integrations.html 107 | 0.80 108 | 109 | 110 | https://awesome-vue.js.org/components-and-libraries/dev-tools.html 111 | 0.80 112 | 113 | 114 | https://awesome-vue.js.org/components-and-libraries/scaffold.html 115 | 0.80 116 | 117 | 118 | https://awesome-vue.js.org/components-and-libraries/runtime.html 119 | 0.80 120 | 121 | 122 | https://awesome-vue.js.org/components-and-libraries/prerendering.html 123 | 0.80 124 | 125 | 126 | 127 | 128 | -------------------------------------------------------------------------------- /content/projects-using-vue-js/commercial-products.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Showcase of commercial websites and web applications that use Vue.js 5 | - name: og:title 6 | content: Commercial Products 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/projects-using-vue-js/commercial-products.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Showcase of commercial websites and web applications that use Vue.js 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Commercial Products 19 | - name: twitter:description 20 | content: Showcase of commercial websites and web applications that use Vue.js 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Commercial Products 26 | 27 | - [Wijmo](https://wijmo.com/products/wijmo-5/) - A collection of UI controls with VueJS support. 28 | - [ChatWoot](https://www.chatwoot.com/) - Livechat and agent collaboration over Facebook messenger. 29 | - [VueA](https://themeforest.net/item/vuejs-laravel-admin-template/20119122?ref=jyostna&utm_source=awesome-vue.js.org) - VueJS Admin template with multiple layouts and laravel version. 30 | - [Teleo](https://www.teleo.co/?utm_source=awesome-vue.js.org) - Team collab-app moving effortlessly between talking, planning & doing 31 | - [EducationLink](https://geteducation.link/?utm_source=awesome-vue.js.org) - CRM and sales automation for education agents and colleges. 32 | - [Pragmatic v2.0](https://1.envato.market/LYWqL) - Responsive and configurable admin template built with Vue.js and Element. 33 | - [Moonitor](https://moonitor.io/) - Cryptocurrency tracker for Desktop. 34 | - [Deskree](https://deskree.com/) - Online collaboration platform that combines Ideas, Tasks, and Issues in one place. 35 | - [OSHCExpress](https://oshcexpress.com/?utm_source=awesome-vue.js.org) - A comparison and ecommerce for OSHC (Overseas Student Health Cover) insurance (Australia's insurance for international students). 36 | - [Agiloo](https://www.agiloo.com) - Project Management app for Scrum and Kanban 37 | - [ScaffoldHub](https://www.scaffoldhub.io) - Online Web App Generator for VueJS with NodeJS, and MongoDB or SQL. 38 | - [Commandeer](https://getcommandeer.com) - Cloud Management Reimagined. A Desktop cloud management app built with Vue.js and Electron. 39 | - [Mongster](https://github.com/mallgroup/mal-mongster) - Connect your Mongo DB nodes into one cluster within a control panel 40 | - [Leave Dates](https://leavedates.com) - A powerful new way to track your staff leave 41 | - [Time Door](https://timedoor.io) - A time series analysis API 42 | - [vREST NG](https://ng.vrest.io) - An enterprise application for Automated API Testing, built with VueJS and Element UI 43 | - [ScaleChamp](https://www.scalechamp.com) - Multi-cloud managed databases provider with Hetzner, AWS, Linode, IBM, Azure, Scaleway, Alibaba Cloud, DigitalOcean, GCP and UpCloud support 44 | - [Coloban](https://www.coloban.com) - All-in-one project management tool with chats, Kanban, Gantt, calls, screenshare and many more 45 | - [NxShell](https://github.com/nxshell/nxshell) - An easy to use new terminal for SSH, which is based on Electron and Vue.js 46 | - [Materio Vuetify VueJS Admin Template](https://themeselection.com/products/materio-vuetify-vuejs-admin-template/) - Most powerful, developer-friendly, production ready & comprehensive Vuetify VueJS admin template 47 | - [Mystery Football Shirts](https://boxtobox.uk) - An E-commerce app using Vue, Node & Mongdo DB 48 | - [NocoDB](https://github.com/nocodb/nocodb) - An opensource Airtable alternative 49 | - [KodaDot](https://github.com/kodadot/nft-gallery) - NFT Marketplace on Polkadot funded as public good, written in Vue.js 50 | - [Convertio](https://convertio.co/) - Online media converter. 51 | - [EmailJs](https://emailjs.com/) - Send emails with javascript. 52 | - [Doc^2^](https://app.polydocs.io/) - Catpure documents for example Invoice etc. 53 | - [He3](https://he3.app) - Free and modern developer utilities toolbox 54 | - [RunJS](https://runjs.app) - JavaScript playground that evaluates your code as you type and gives instant feedback. Ideal for prototyping ideas or trying out new libraries 55 | - [Sneat Vuetify VueJS Admin Template](https://themeselection.com/item/sneat-vuetify-vuejs-admin-template/) - The ultimate Vue.js admin template for responsive web apps 56 | -------------------------------------------------------------------------------- /content/resources/community.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Vue.js user forums and chat groups 5 | - name: og:title 6 | content: Community 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/community.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Vue.js user forums and chat groups 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Community 19 | - name: twitter:description 20 | content: Vue.js user forums and chat groups 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Community 26 | 27 | - [Twitter](https://twitter.com/vuejs) 28 | - [Official Forum](https://forum.vuejs.org/) 29 | - [vue-requests](https://github.com/vuejs/vue-requests) - Request a Vue.js module you wish existed or get ideas for modules 30 | - [VueJS English community](https://t.me/vue_en) 31 | - [VueJS Iran](https://telegram.me/vue_js) - Telegram Channel & group (group link available in channel bio) 32 | - [vueslack](https://vueslack.slack.com/) - 2300+ registered users worldwide 33 | - [Vue Land](https://vue-land.js.org/) - Discord chat server 34 | - [VueJS Russia](https://t.me/vuejs_ru) - Telegram Group (Russian) 35 | - [VueJS Russia - News](https://t.me/vue_russia) - Telegram Group (Russian) 36 | - [VueJS Viet Nam](https://www.facebook.com/groups/vuejsvietnam/) - Facebook group 37 | - [VueJS Thailand](https://www.facebook.com/groups/VuejsThailand/) - Facebook Group 38 | - [VueJS Brasil](https://t.me/vuejsbrasil) - Telegram Group (Portuguese) 39 | - [VueJS Brasil](https://www.facebook.com/vuejsbrasil/) - Facebook Page (Portuguese) 40 | - [VueJS Brasil](https://www.facebook.com/groups/vuejsbr/) - Facebook Group (Portuguese) 41 | - [VueJS en español](https://www.facebook.com/groups/vue.es/) - Facebook Group (Spanish) 42 | - [VueJS India](https://goo.gl/mYXKUv) - Discord chat server 43 | - [VueJS Indonesia](https://t.me/vuejsindonesia) - Telegram Group (Indonesian) 44 | - [VueJS Indonesia](https://www.facebook.com/groups/1675298779418239/) - Facebook Group (Indonesian) 45 | - [VueJS Indonesia](https://www.meetup.com/Vuejs-Indonesia/) - Meetup Page (Indonesian) 46 | - [VueJS Hong Kong](https://www.facebook.com/groups/887185518120024) - Facebook group 47 | - [VueJS Arab](https://t.me/vuejsarab) - Telegram Group 48 | - [VueJS Vix](https://t.me/vuejsvix) - Telegram Group (Portuguese) 49 | - [VueJS Vix](https://www.meetup.com/pt-BR/Vue-js-in-Vix/) - Meetup Page (Portuguese) 50 | - [VueJS Norway](https://www.meetup.com/VueJS-Oslo/) - Meetup 51 | - [VueJS Israel](https://www.facebook.com/officalVuejsIsrael/) - Facebook Page 52 | - [VueJS Finland](https://www.meetup.com/vuejs-finland/) - Meetup 53 | - [VueJS Finland](https://www.facebook.com/vuejsfinland/) - Facebook Page 54 | - [Hablemos de Vue.js](https://t.me/vuejsEs) - Telegram Group (Castellano) 55 | - [VueBLR](https://www.meetup.com/vue-bangalore/) - Meetup 56 | - [VueBLR](http://bit.ly/vueblr-whatsapp) - WhatsApp Group 57 | - [VueBLR](https://www.facebook.com/groups/vue.blr/) - Facebook Group 58 | - [VueJS USA](https://events.vuejs.org/meetups/#united-states) - Meetups 59 | - [VueJS CZ/SK](https://discord.gg/mDr2z8V) - Discord group 60 | - [VueJS Malaysia](https://t.me/vueMalaysia) - Telegram Group (Malaysian) 61 | - [VueJS DOM](https://chat.whatsapp.com/L5rFQpme22IHmmyOMI1MWA) - WhatsApp group 62 | - [VueJS DOM](https://www.facebook.com/groups/2022974857757366/) - Facebook group 63 | - [VueJS Uzbekistan](https://t.me/vuejsuzbekcommunity) - Telegram Group (Uzbek) 64 | - [VueJS Uzbekistan](https://t.me/vuejs_uz) - Telegram community and support group (Uzbek) 65 | - [VueJS Turkey](https://t.me/vuejsTR) - Telegram Group 66 | - [Vue Turkey](https://twitter.com/Vue_Turkey) - Twitter Account 67 | - [Vue Türkiye](https://kommunity.com/vue-turkey) - Kommunity Page 68 | - [VueJS Singapore](https://t.me/vuejssg) - Telegram Group 69 | - [VueJS Bootcamp kablosuzkedi - Turkey](https://t.me/joinchat/pqiJOgi8byQ5Y2E0) - Telegram Group 70 | - [VueJS Translations Ukraine](https://t.me/vuejs_ukraine) - Telegram Group (Ukraine) 71 | - [VueJS Kenya](https://twitter.com/KenyaVue) - Twitter Account 72 | - [VueJS Magyar](https://www.facebook.com/groups/huvuejs/) - Facebook Group (Hungarian) 73 | - [VueJS Nigeria](https://t.me/vuejsnigeria) - Telegram Group 74 | - [VueJS Bangladesh](https://www.facebook.com/groups/764064325433370) - Facebook Group 75 | -------------------------------------------------------------------------------- /content/.vuepress/theme/components/Home.vue: -------------------------------------------------------------------------------- 1 | 72 | 73 | 95 | 96 | 201 | -------------------------------------------------------------------------------- /content/resources/books.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Books about Vue.js 5 | - name: og:title 6 | content: Books 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/books.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Books about Vue.js 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Books 19 | - name: twitter:description 20 | content: Books about Vue.js 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Books 26 | 27 | - [The Majesty Of Vue.js](https://www.packtpub.com/web-development/majesty-vuejs) by Alex Kyriakidis & Kostas Maniatis, Packt. (Nov 2016) 28 | - [Learning Vue.js 2](https://www.packtpub.com/web-development/learning-vuejs-2) by Olga Filipova, Packt. (Dec 2016) 29 | - [The Majesty Of Vue.js 2](https://leanpub.com/vuejs2) by Alex Kyriakidis and Kostas Maniatis, Leanpub. (Mar 2017) 30 | - [Vue.js 2 Cookbook](https://www.packtpub.com/web-development/vuejs-2-cookbook) by Andrea Passaglia, Packt. (May 2017) 31 | - [Vue.js in Action](https://www.manning.com/books/vue-js-in-action) by Erik Hanchett and Benjamin Listwon (Spring 2018) 32 | - [Testing Vue.js Applications](https://www.manning.com/books/testing-vuejs-applications) by Edd Yerburgh (Summer 2018) 33 | - [Vue.js 2 and Bootstrap 4 Web Development](https://www.packtpub.com/web-development/vuejs-2-and-bootstrap-4-web-development) by Olga Filipova, Packt. (September 2017) 34 | - [Front-end com Vue.js](https://www.casadocodigo.com.br/products/livro-frontend-vue) by Leonardo Vilarinho, Casa do Código. (November 2017) 35 | - [Vue.js 2 Web Development Projects](https://www.packtpub.com/web-development/vuejs-2-web-development-projects) by Guillaume Chau, Packt. (November 2017) 36 | - [Full-Stack Vue.js 2 and Laravel 5](https://www.packtpub.com/application-development/full-stack-vuejs-2-and-laravel-5) by Anthony Gore, Packt. (December 2017) 37 | - [Vue.js 2.x by Example](https://www.packtpub.com/application-development/vuejs-2x-example) by Mike Street, Packt. (December 2017) 38 | - [Mastering Vue.js](https://masteringvuejs.com) by Oleksandr Kocherhin. (January 2018) 39 | - [Fullstack Vue: The Complete Guide to Vue.js](https://www.fullstack.io/vue/) by Hassan Djirdeh, Nate Murray, & Ari Lerner. (March 2018) 40 | - [Vue.js 2 Design Patterns and Best Practices](https://www.amazon.com/dp/178883979X) by Paul Halliday, Packt. (March 2018) 41 | - [Vuex Quick Start Guide](https://www.amazon.com/dp/1788999932) by Andrea Koutifaris, Packt. (April 2018) 42 | - [Full-Stack Web Development with Vue.js and Node](https://www.amazon.com/Full-Stack-Web-Development-Vue-js-Node/dp/1788831144) by Aneeta Sharma, Packt. (May 2018) 43 | - [The Vue Handbook](https://vuehandbook.com) by Flavio Copes. (July 2018) 44 | - [ASP.NET Core 2 and Vue.js](https://www.amazon.com/dp/1788839463) by Stuart Ratcliffe, Packt. (July 2018) 45 | - [Vue.js: Construa aplicações incríveis](https://www.casadocodigo.com.br/products/livro-vue) by Caio Incau, Casa do Código. (September 2017) 46 | - [Getting to Know Vue.js](https://www.apress.com/us/book/9781484237809) by Brett Nelson, Apress. (August 2018) 47 | - [Vue: Build & Deploy](https://leanpub.com/vue-book) by Daniel Schmitz, Leanpub. (September 2018) 48 | - [Building Applications with Spring 5 and Vue.js 2](https://www.packtpub.com/application-development/building-applications-spring-5-and-vuejs-2) by James J. Ye, Packt. (October 2018) 49 | - [Vue.js Quick Start Guide](https://www.packtpub.com/application-development/vuejs-quick-start-guide) by Ajdin Imsirovic, Packt. (October 2018) 50 | - [Vue.js Component Patterns Course](https://fdietz.de/pages/vue-component-patterns-course/) by Frederik Dietz (April 2019) 51 | - [Vue.js: Understanding its Tools and Ecosystem](https://www.packtpub.com/business-other/vue-js-understanding-its-tools-and-ecosystem?utm_source=awesome-vue.js.org&utm_medium=referral&utm_campaign=OutreachB15894fivedollar) by Dave Berning (November 2019) 52 | - [Building Forms with Vue.js](https://www.packtpub.com/business-other/building-forms-with-vue-js?utm_source=awesome-vue.js.org&utm_medium=referral&utm_campaign=OutreachB15411) by Marina Mosti (October 2019) 53 | - [Testing Vue.js Components with Jest](https://www.packtpub.com/programming/testing-vue-js-components-with-jest?utm_source=awesome-vue.js.org&utm_medium=refferal&utm_campaign=OutreachB15653) by Alex Jover Morales, Packt (October 2019) 54 | - [Vue.js](https://www.amazon.com/Vue-js-Actionable-Chris-Minnick/dp/1951959019) by Chris Minnick and Nat Dunn, Webucator (February, 2020) 55 | - [Become a Ninja with Vue 3](https://books.ninja-squad.com/vue) by Cédric Exbrayat (English and French versions) (May, 2020) 56 | - [vue.js Succinctly](https://www.syncfusion.com/ebooks/vuejs-succinctly) by Ed Freitas (July 2020) 57 | - [Large Scale Apps with Vue 3 and TypeScript](http://leanpub.com/vue-typescript/c/vaYXLEFWbMi7) by Damiano Fusco, Leanpub (September, 2020) 58 | - [Vue.js 3 Cookbook: Discover actionable solutions for building modern web apps with the latest Vue features and TypeScript](https://www.amazon.com/gp/product/183882622X/ref=as_li_tl?ie=UTF8&tag=bloodf-20&camp=1789&creative=9325&linkCode=as2&creativeASIN=183882622X&linkId=778f687401efe3b5dff7a26bbfc6aef4) by Heitor Ramon Ribeiro, Packt. (September, 2020) 59 | - [Vue - The Road To Enterprise](https://theroadtoenterprise.com/?utm_source=github&utm_medium=vue-awesome&utm_campaign=vue_the_road_to_enterprise) by Thomas Findlay (January, 2021) 60 | - [Building Vue.js Applications with GraphQL: Develop a complete full-stack chat app from scratch using Vue.js, Quasar Framework, and AWS Amplify](https://www.amazon.com/gp/product/B08NXVD7XB/ref=as_li_tl?ie=UTF8&tag=bloodf-20&camp=1789&creative=9325&linkCode=as2&creativeASIN=B08NXVD7XB&linkId=6ae2a9058f3421ac6d12fa53508b27be) by Heitor Ramon Ribeiro, Packt (January, 2021) 61 | - [Accessible Vue – Get started with Accessibility in Vue.js!](https://accessible-vue.com) by Marcus Herrmann (March 2021) 62 | - [Building a Strapi E-Commerce: Nuxt.js Tutorial & Live Demo](https://snipcart.com/blog/strapi-ecommerce-nuxtjs-tutorial) (September 2021) 63 | -------------------------------------------------------------------------------- /content/components-and-libraries/ui-layout.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Layout for the overall or main view for Vue.js applications 5 | - name: og:title 6 | content: UI Layout 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/components-and-libraries/ui-layout.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Layout for the overall or main view for Vue.js applications 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: UI Layout 19 | - name: twitter:description 20 | content: Layout for the overall or main view for Vue.js applications 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # UI Layout 26 | 27 | Layout for the overall / main view 28 | 29 | - [vue-waterfall](https://github.com/MopTym/vue-waterfall) - A waterfall layout component for Vue.js. 30 | - [vueisotope](https://github.com/David-Desmaisons/Vue.Isotope) - Vue component for isotope filter & sort magical layouts. 31 | - [vue-grid-layout](https://github.com/jbaysolutions/vue-grid-layout) - A draggable and resizable grid layout, for Vue.js. 32 | - [vue-drag-zone](https://github.com/surmon-china/vue-drag-zone) - Drag Zone component for Vue.js(2.x). 33 | - [vue-masonry](https://github.com/shershen08/vue-masonry) - Vue.js directive for masonry blocks layouting. 34 | - [vue-fraction-grid](https://github.com/bkzl/vue-fraction-grid) - Flexbox based responsive fraction grid system for Vue.js. 35 | - [vue-virtual-scroll-list](https://github.com/tangbc/vue-virtual-scroll-list) - A vue (2.x) component support big data by using virtual scroll list. 36 | - [vue-virtual-scroller](https://github.com/Akryum/vue-virtual-scroller) - Component to scroll a large amount of elements efficiently (Vue 2.x). 37 | - [vue-virtualscroll](https://github.com/ddgll/vue-virtualscroll) - [Vue 2.x] component to virtual scroll things. 38 | - [vue-inview](https://github.com/rachmanzz/vue-inview) - [Vue 2.x] Viewport, get notification when DOM element is entered or leave. 39 | - [dnd-grid](https://github.com/dattn/dnd-grid) - A vuejs grid with draggable and resizable boxes 40 | - [vue-extend-layout](https://github.com/ktquez/vue-extend-layout) - Extend the default layout or create custom layouts for the pages of your Vue.js SPA 41 | - [vue-masonry-css](https://github.com/paulcollett/vue-masonry-css) - Vue.js Masonry layout component powered by CSS, dependency free 42 | - [vue-fullpage.js](https://github.com/alvarotrigo/vue-fullpage.js) - Official fullPage.js component for Vue.js. 43 | - [vue-virtual-collection](https://github.com/starkwang/vue-virtual-collection) - Vue component for efficiently rendering large collection data. 44 | - [autoresponsive-vue](https://github.com/xudafeng/autoresponsive-vue) - Auto responsive grid layout library for Vue. 45 | - [VueFlex](https://github.com/SeregPie/VueFlex) - A flexbox grid system. 46 | - [v-chacheli](https://gitlab.com/shellyBits/v-chacheli) - A Vue.js component to create and display custom dashboard-like grid layouts. 47 | - [vue-grid-styled](https://github.com/mattrothenberg/vue-grid-styled) - A lightweight set of functional grid components, ported from React's [grid-styled](https://github.com/jxnblk/grid-styled/) 48 | - [simple-grid](https://github.com/anthinkingcoder/simple-grid) - Vue component for grid layout,support flex. 49 | - [vue-container-component](https://github.com/kavalcante/vue-container-component) - Simple container component inspired on Bootstrap Container 50 | - [vue-colcade](https://github.com/alexiscolin/vue-colcade) - A small wrapper for integrating Colcade grid layout to Vuejs. 51 | - [vue-ads-layout](https://github.com/arnedesmedt/vue-ads-layout) - A small library of Vue components to quickly generate a responsive web application layout with toolbar, left/right drawers and a footer. All components can be positioned fixed or relative. 52 | - [vue-magic-grid](https://github.com/imlinus/Vue-Magic-Grid) - A tiny port of Magic Grid for Vue.js 2. 53 | - [vue-splitter-pane](https://github.com/venkatperi/vue-splitter-pane) - A Vue.js component which renders two slots in a adjustable split arrangement (vertical or horizontal) 54 | - [splitpanes](https://github.com/antoniandre/splitpanes) - A Vue JS reliable, simple and touch-ready panes splitter / resizer. 55 | - [vue-mock-layout](https://github.com/promosis/vue-mock-layout) - Easily mock the layout of your Vue apps. 56 | - [vue-simple-drawer](https://github.com/dreambo8563/vue-simple-drawer) - A tiny drawer panel with bounced animation, nest supported and theme customized. directions: left/right/up/down 57 | - [vue-grd](https://github.com/1000ch/vue-grd) - Simple, Light-weight and Flexible Vue.js component for grid layout 58 | - [vue-masonry-component](https://github.com/Guillaume69/vue-masonry-component) - A Vue.js component wrapping masonry layout library 59 | - [vue-smart-widget](https://github.com/xiaoluoboding/vue-smart-widget) - Smart widget is a flexible and extensible content container component for Vue.js 2.x 60 | - [vue-colrow](https://github.com/phphe/vue-colrow) - Responsive grid layout components: Row, Col. Based on css flexbox. Support SSR, fixed or fraction width, auto grow Col 61 | - [vue-diagonal](https://github.com/albertodeago/vue-diagonal) - Simple and light-weight component to create diagonal elements 62 | - [vue-responsive-dash](https://github.com/bensladden/vue-responsive-dash) - A Responsive, Draggable & Resizable Dashboard (grid) made with vue and TypeScript 63 | - [vue-masonry-wall](https://github.com/fuxingloh/vue-masonry-wall) - A pure vue responsive masonry layout without direct dom manipulation, ssr friendly and lazy loading 64 | - [vue-horizontal-list](https://github.com/fuxingloh/vue-horizontal-list) - A pure vue responsive horizontal list layout with ssr support, mobile and touch friendly 65 | - [vue-layout-system](https://github.com/leeboyin/vue-layout-system) - Vue components that solve daily layout problems 66 | - [simple-vue-grid](https://github.com/harmyderoman/simple-vue-grid) - Simple grid containers that will help you to build layouts for your app 67 | - [iron-grid-system](https://github.com/ilker0/iron-grid-system) - A responsive grid system for Vue 3.x 68 | - [vue-re-resizable](https://github.com/tachibana-shin/vue-re-resizable) - Plugin for Vue 3 allows resizing components. Rewritten [re-resizable](https://github.com/bokuweb/re-resizable) 69 | - [vue-console-feed](https://github.com/tachibana-shin/vue-console-feed) - A plugin that allows you to display console like Chrome DevTools for Vue 70 | - [vue-typed-virtual-list](https://github.com/bsssshhhhhhh/vue-typed-virtual-list) - [Vue 3.x] Small, efficient, TypeScript-friendly virtual scroller for rendering massive data 71 | - [fit-screen](https://github.com/jp-liu/fit-screen) - A vue component based on the scale large screen adaptive solution 72 | - [vue-virtual-waterfall](https://github.com/lhlyu/vue-virtual-waterfall) - A virtual waterfall component for Vue 3.x 73 | -------------------------------------------------------------------------------- /content/.vuepress/theme/util/index.js: -------------------------------------------------------------------------------- 1 | export const hashRE = /#.*$/ 2 | export const extRE = /\.(md|html)$/ 3 | export const endingSlashRE = /\/$/ 4 | export const outboundRE = /^[a-z]+:/i 5 | 6 | export function normalize (path) { 7 | return decodeURI(path) 8 | .replace(hashRE, '') 9 | .replace(extRE, '') 10 | } 11 | 12 | export function getHash (path) { 13 | const match = path.match(hashRE) 14 | if (match) { 15 | return match[0] 16 | } 17 | } 18 | 19 | export function isExternal (path) { 20 | return outboundRE.test(path) 21 | } 22 | 23 | export function isMailto (path) { 24 | return /^mailto:/.test(path) 25 | } 26 | 27 | export function isTel (path) { 28 | return /^tel:/.test(path) 29 | } 30 | 31 | export function ensureExt (path) { 32 | if (isExternal(path)) { 33 | return path 34 | } 35 | const hashMatch = path.match(hashRE) 36 | const hash = hashMatch ? hashMatch[0] : '' 37 | const normalized = normalize(path) 38 | 39 | if (endingSlashRE.test(normalized)) { 40 | return path 41 | } 42 | return normalized + '.html' + hash 43 | } 44 | 45 | export function isActive (route, path) { 46 | const routeHash = decodeURIComponent(route.hash) 47 | const linkHash = getHash(path) 48 | if (linkHash && routeHash !== linkHash) { 49 | return false 50 | } 51 | const routePath = normalize(route.path) 52 | const pagePath = normalize(path) 53 | return routePath === pagePath 54 | } 55 | 56 | export function resolvePage (pages, rawPath, base) { 57 | if (isExternal(rawPath)) { 58 | return { 59 | type: 'external', 60 | path: rawPath 61 | } 62 | } 63 | if (base) { 64 | rawPath = resolvePath(rawPath, base) 65 | } 66 | const path = normalize(rawPath) 67 | for (let i = 0; i < pages.length; i++) { 68 | if (normalize(pages[i].regularPath) === path) { 69 | return Object.assign({}, pages[i], { 70 | type: 'page', 71 | path: ensureExt(pages[i].path) 72 | }) 73 | } 74 | } 75 | console.error(`[vuepress] No matching page found for sidebar item "${rawPath}"`) 76 | return {} 77 | } 78 | 79 | function resolvePath (relative, base, append) { 80 | const firstChar = relative.charAt(0) 81 | if (firstChar === '/') { 82 | return relative 83 | } 84 | 85 | if (firstChar === '?' || firstChar === '#') { 86 | return base + relative 87 | } 88 | 89 | const stack = base.split('/') 90 | 91 | // remove trailing segment if: 92 | // - not appending 93 | // - appending to trailing slash (last segment is empty) 94 | if (!append || !stack[stack.length - 1]) { 95 | stack.pop() 96 | } 97 | 98 | // resolve relative path 99 | const segments = relative.replace(/^\//, '').split('/') 100 | for (let i = 0; i < segments.length; i++) { 101 | const segment = segments[i] 102 | if (segment === '..') { 103 | stack.pop() 104 | } else if (segment !== '.') { 105 | stack.push(segment) 106 | } 107 | } 108 | 109 | // ensure leading slash 110 | if (stack[0] !== '') { 111 | stack.unshift('') 112 | } 113 | 114 | return stack.join('/') 115 | } 116 | 117 | /** 118 | * @param { Page } page 119 | * @param { string } regularPath 120 | * @param { SiteData } site 121 | * @param { string } localePath 122 | * @returns { SidebarGroup } 123 | */ 124 | export function resolveSidebarItems (page, regularPath, site, localePath) { 125 | const { pages, themeConfig } = site 126 | 127 | const localeConfig = localePath && themeConfig.locales 128 | ? themeConfig.locales[localePath] || themeConfig 129 | : themeConfig 130 | 131 | const pageSidebarConfig = page.frontmatter.sidebar || localeConfig.sidebar || themeConfig.sidebar 132 | if (pageSidebarConfig === 'auto') { 133 | return resolveHeaders(page) 134 | } 135 | 136 | const sidebarConfig = localeConfig.sidebar || themeConfig.sidebar 137 | if (!sidebarConfig) { 138 | return [] 139 | } else { 140 | const { base, config } = resolveMatchingConfig(regularPath, sidebarConfig) 141 | if (config === 'auto') { 142 | return resolveHeaders(page) 143 | } 144 | return config 145 | ? config.map(item => resolveItem(item, pages, base)) 146 | : [] 147 | } 148 | } 149 | 150 | /** 151 | * @param { Page } page 152 | * @returns { SidebarGroup } 153 | */ 154 | function resolveHeaders (page) { 155 | const headers = groupHeaders(page.headers || []) 156 | return [{ 157 | type: 'group', 158 | collapsable: false, 159 | title: page.title, 160 | path: null, 161 | children: headers.map(h => ({ 162 | type: 'auto', 163 | title: h.title, 164 | basePath: page.path, 165 | path: page.path + '#' + h.slug, 166 | children: h.children || [] 167 | })) 168 | }] 169 | } 170 | 171 | export function groupHeaders (headers) { 172 | // group h3s under h2 173 | headers = headers.map(h => Object.assign({}, h)) 174 | let lastH2 175 | headers.forEach(h => { 176 | if (h.level === 2) { 177 | lastH2 = h 178 | } else if (lastH2) { 179 | (lastH2.children || (lastH2.children = [])).push(h) 180 | } 181 | }) 182 | return headers.filter(h => h.level === 2) 183 | } 184 | 185 | export function resolveNavLinkItem (linkItem) { 186 | return Object.assign(linkItem, { 187 | type: linkItem.items && linkItem.items.length ? 'links' : 'link' 188 | }) 189 | } 190 | 191 | /** 192 | * @param { Route } route 193 | * @param { Array | Array | [link: string]: SidebarConfig } config 194 | * @returns { base: string, config: SidebarConfig } 195 | */ 196 | export function resolveMatchingConfig (regularPath, config) { 197 | if (Array.isArray(config)) { 198 | return { 199 | base: '/', 200 | config: config 201 | } 202 | } 203 | for (const base in config) { 204 | if (ensureEndingSlash(regularPath).indexOf(encodeURI(base)) === 0) { 205 | return { 206 | base, 207 | config: config[base] 208 | } 209 | } 210 | } 211 | return {} 212 | } 213 | 214 | function ensureEndingSlash (path) { 215 | return /(\.html|\/)$/.test(path) 216 | ? path 217 | : path + '/' 218 | } 219 | 220 | function resolveItem (item, pages, base, groupDepth = 1) { 221 | if (typeof item === 'string') { 222 | return resolvePage(pages, item, base) 223 | } else if (Array.isArray(item)) { 224 | return Object.assign(resolvePage(pages, item[0], base), { 225 | title: item[1] 226 | }) 227 | } else { 228 | const children = item.children || [] 229 | if (children.length === 0 && item.path) { 230 | return Object.assign(resolvePage(pages, item.path, base), { 231 | title: item.title 232 | }) 233 | } 234 | return { 235 | type: 'group', 236 | path: item.path, 237 | title: item.title, 238 | sidebarDepth: item.sidebarDepth, 239 | initialOpenGroupIndex: item.initialOpenGroupIndex, 240 | children: children.map(child => resolveItem(child, pages, base, groupDepth + 1)), 241 | collapsable: item.collapsable !== false 242 | } 243 | } 244 | } 245 | -------------------------------------------------------------------------------- /content/components-and-libraries/dev-tools.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Tools for Vue.js development 5 | - name: og:title 6 | content: Developer Tools 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/components-and-libraries/dev-tools.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Tools for Vue.js development 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Developer Tools 19 | - name: twitter:description 20 | content: Tools for Vue.js development 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Developer Tools 26 | 27 | - [vue-dev-server](https://github.com/paulpflug/vue-dev-server) - A small development server for building `vue` components. 28 | - [Storybook](https://storybook.js.org) - The UI Development Environment. works with v3.2+ later. 29 | - [Font Awesome Finder](https://chrome.google.com/webstore/detail/font-awesome-icon-finder/kjejboahkcobalmgldloeinebmbomgog) - Chrome extension to search, preview and choose Font Awesome icons and copy the selected icon HTML code & Unicode to clipboard. 30 | - [vue-dummy](https://github.com/paulcollett/vue-dummy) - Placeholder Text and Dummy Images as a simple `v-dummy` directive. 31 | - [Bit](https://github.com/teambit/bit) - Manage and reuse `vue` components between projects. Easily isolate and share components from any project without changing its source code, organize curated collections and install in different projects. 32 | - [ComponentFixture](https://github.com/David-Desmaisons/ComponentFixture) - is a component design to develop and test other components, automatically binding their props. 33 | - [vue-cli-template-dev-server](https://github.com/eliranmal/vue-cli-template-dev-server) - development server for building vue-cli custom templates. 34 | - [vue-codemods](https://github.com/SergioCrisostomo/vue-codemods) - Collection of codemod scripts that help update and refactor Vue and JavaScript files 35 | - [codesandbox](https://codesandbox.io/s/vue-vue) - An online IDE and prototyping tool for rapid Vue development 36 | - [vue-dom-hints](https://github.com/privatenumber/vue-dom-hints) - Get hints in the DOM. Minimal Vue devtool alternative 37 | - [components-helper](https://github.com/tolking/components-helper) - Based on the documents to provide code prompt files for Vue component library 38 | - [vue-unicorn-log](https://github.com/webdevnerdstuff/vue-unicorn-log) - A Vue 2 magical plugin to make coloring the (devtools) console output easier and more flexible. [Vue 3 version](https://github.com/webdevnerdstuff/vue3-unicorn-log) version also available 39 | 40 | ## Inspect 41 | 42 | Inspecting & debugging 43 | 44 | - [Vue.js devtools](https://github.com/vuejs/vue-devtools) - Chrome devtools extension for debugging Vue.js applications. 45 | - [DejaVue](https://github.com/MiCottOn/DejaVue) - Visualization and debugging tool built for Vue.js. 46 | - [vue-clicky](https://github.com/Herteby/vue-clicky) - Right click any component to show info about it in the console. 47 | - [vuejs-logger](https://github.com/justinkames/vuejs-logger) - Provides customizable logging functionality for Vue.js. 48 | - [vue-inspector](https://github.com/calirojas506/vue-inspector) - Vue.js Inspector for Mobile Devices 49 | - [Vue Performance Devtool](https://github.com/vue-perf-devtool/vue-perf-devtool) - Vue Performance Devtool is a browser extension for inspecting the performance of Vue Components 50 | - [VueSource](https://github.com/davestewart/vue-source) - Global Vue mixin which identifies components in source code by adding HTML comments 51 | - [NW-Vue-DevTools](https://github.com/TheJaredWilcurt/nw-vue-devtools) - DevDependency for adding Vue DevTools into NW.js 52 | - [bruit-io](https://github.com/Moventes/bruit.io) - Collect feedback with screenshot and technical data and post them to an API like [bruit.io](https://bruit.io) 53 | 54 | ## Docs 55 | 56 | Create documentation 57 | 58 | - [vue-markdown-loader](https://github.com/QingWei-Li/vue-markdown-loader) - Convert Markdown file to Vue Component. 59 | - [vue-styleguide-generator](https://github.com/shershen08/vue-styleguide-generator) - React inspired style guide generator for Vue.js. 60 | - [CheatSheet](https://vuejs-tips.github.io/cheatsheet) - Complete Interactive API. 61 | - [Vuex CheatSheet](https://vuejs-tips.github.io/vuex-cheatsheet) - Complete Interactive Vuex API. 62 | - [vue-styleguidist](https://github.com/vue-styleguidist/vue-styleguidist) - A style guide generator for Vue components with a living style guide. 63 | - [vue-elucidate](https://github.com/mattrothenberg/vue-elucidate) - A component that generates beautiful documentation for your living styleguide / design system. 64 | - [vue-md-loader](https://github.com/wxsms/vue-md-loader) - Markdown files to ALIVE Vue components. 65 | - [@vuedoc/parser](https://gitlab.com/vuedoc/parser) - Generate a JSON documentation for a Vue file component. 66 | - [@vuedoc/md](https://gitlab.com/vuedoc/md) - Generate a Markdown Documentation for a Vue file. 67 | - [jsdoc-vue-component](https://github.com/ccqgithub/jsdoc-vue-component) - A jsodc3 plugin that extract vue SFC info(name, props, events...) to document. 68 | - [jsdoc-vuedoc](https://github.com/ccqgithub/jsdoc-vuedoc) - A jsdoc3 plugin use `@vuedoc/md`. 69 | - [vue-storybook](https://github.com/mattrothenberg/vue-storybook) - Add `` blocks to your Vue single file components for tighter integration of Vue + [Storybook](https://github.com/storybooks/storybook) 70 | - [vue-patterns](https://github.com/learn-vuejs/vue-patterns) - Useful Vue patterns, techniques, tips and tricks and helpful curated links. 71 | - [vuese](https://github.com/vuese/vuese) - One-stop solution for vue component documentation. 72 | - [vue-dotmd-loader](https://github.com/mengdu/vue-dotmd-loader) - A webpack loader for loader markdown file transform to vue file 73 | - [vue-tut](https://github.com/evwt/vue-tut) - Easily build beautiful tutorials with Vue 74 | 75 | ## Test 76 | 77 | - [avoriaz](https://github.com/eddyerburgh/avoriaz) - A Vue.js testing utility library. 78 | - [vuenit](https://github.com/jackmellis/vuenit) - Utilities for testing Vue components and directives. 79 | - [vue-unit](https://github.com/wrseward/vue-unit) - A library for Vue.js that makes it easier to create and unit test components. 80 | - [vue-a2b](https://github.com/fromAtoB/vue-a2b) - A library for Split Testing with Vue.js (A/B Testing). Highly configurable and tiny (1.2k gzipped) 81 | - [vue-test-utils](https://github.com/vuejs/vue-test-utils) - Official utilities for testing Vue components. 82 | - [vue-test-actions](https://github.com/biigpongsatorn/vue-test-actions) - Unit testing Vuex actions with Jest mocks. 83 | - [jest-vue-matcher](https://github.com/14nrv/jest-vue-matcher) - Additional jest matchers for vue 84 | - [vue-hubble](https://github.com/crishellco/vue-hubble) - A better way to select elements for UI testing in Vue. 85 | - [Vue Testing Library](https://github.com/testing-library/vue-testing-library) - Simple and complete testing utilities that encourage good testing practices. Based on DOM Testing Library and built upon the official Vue Test Utils. 86 | - [jest-serializer-vue-tjw](https://github.com/tjw-lint/jest-serializer-vue-tjw) - Improved formatting of Jest Snapshots 87 | - [vuex-test-utils](https://github.com/Incognitus-Io/vuex-test-utils) - Unit testing Vux with chai 88 | 89 | ### Browser-less require 90 | 91 | Load Vue components without browser 92 | 93 | - [vue-node](https://github.com/knpwrs/vue-node) - Load vue components in node. 94 | 95 | ## Source Code Editing 96 | 97 | Text editor plugins 98 | 99 | ### Atom 100 | 101 | - [language-vue@atom.io](https://github.com/hedefalk/atom-vue) - Vue component file syntax for Atom. 102 | - [vue-snippets@atom.io](https://github.com/ealves-pt/atom-vue-snippets) - Atom snippets for Vue component files. 103 | - [vue-autocompile@atom.io](https://github.com/paulpflug/vue-autocompile) - Auto compile vue file on save. 104 | - [lint-sass-vue@atom.io](https://github.com/fsblemos/lint-sass-vue) - Atom.io package to lint Sass/SCSS in `.vue` files. 105 | - [vuejs2-snippets@atom.io](https://github.com/CorentinAndre/Vuejs-snippets) - Atom snippets for javascript and components, including lifecycle hooks, directives, properties, vuex, vue-router, vue-i18n support. 106 | - [vue2-autocomplete@atom.io](https://github.com/ealves-pt/atom-vue2-autocomplete) - Vue.js 2.0+ autocomplete for Atom. 107 | 108 | ### Sublime Text 109 | 110 | - [Vue Syntax Highlight](https://github.com/vuejs/vue-syntax-highlight) - Sublime Text syntax highlighting for single-file Vue components. 111 | - [VUEFormatter](https://github.com/baixuexiyang/VUEFormatter) - Sublime Text code format 112 | - [Vue Next Formatter](https://github.com/luozhihua/sublime-vue-formatter) - Sublime Text Vue formatter, Supported ES5/6/7, Less/Sass and Pug/Html template. 113 | 114 | ### Vim 115 | 116 | - [Vim Vue](https://github.com/posva/vim-vue) - Syntax Highlight for Vue.js components. 117 | - [vim-vue-plugin](https://github.com/leafOfTree/vim-vue-plugin) - Vim syntax and indent plugin for .vue files. 118 | 119 | ### Visual Studio Code 120 | 121 | - [Vetur](https://github.com/octref/vetur) - Vue tooling for VSCode. 122 | - [Vue VSCode Snippets](https://github.com/sdras/vue-vscode-snippets) - Snippets that will supercharge your Vue workflow 123 | - [Ionic Snippets](https://github.com/moduslabs/ionic/tree/master/packages/ionic-vetur) - Vetur support for Ionic Components 124 | - [Volar](https://github.com/johnsoncodehk/volar) - The Fastest Vue Language Support Extension 125 | 126 | ### Visual Studio 127 | 128 | - [VuePack](https://github.com/madskristensen/VuePack) - Contains HTML Intellisense and code snippets for the Vue.js JavaScript library. 129 | 130 | ### Brackets 131 | 132 | - [Brackets Vue](https://github.com/pandao/brackets-vue) - Brackets extension for Vue.js. 133 | 134 | ### Intellij 135 | 136 | - [Vue.js support for WebStorm](https://github.com/JetBrains/intellij-plugins/tree/master/vuejs), IntelliJ IDEA, PhpStorm, PyCharm & RubyMine – official Vue.js support by JetBrains 137 | 138 | ### Emacs 139 | 140 | - [Vue Mode](https://github.com/CodeFalling/vue-mode) - Emacs major mode for vue.js. 141 | 142 | ### Kate 143 | 144 | - [Kate Syntax Files](https://github.com/mtorromeo/kate-syntax-files) - Syntax files (modified or original) for katepart (kate, kwrite, kdevelop). 145 | 146 | ### CodeLobster IDE 147 | 148 | - [VueJS plug-in](http://www.codelobster.com/vuejs.html) - CodeLobster IDE plug-in for VueJS download, autocomplete and tooltips for VueJS functions, context and dynamic help. 149 | -------------------------------------------------------------------------------- /content/components-and-libraries/integrations.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Integrate Vue.js applications with services or other frameworks 5 | - name: og:title 6 | content: Integrations 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/components-and-libraries/integrations.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Integrate Vue.js applications with services or other frameworks 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Integrations 19 | - name: twitter:description 20 | content: Integrate Vue.js applications with services or other frameworks 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Integrations 26 | 27 | Integrate with services or other frameworks 28 | 29 | - [vue-disqus](https://github.com/ktquez/vue-disqus) - Vue component to integrate Disqus comments in your application, with support for SPA. 30 | - [vue-youtube-embed](https://github.com/kaorun343/vue-youtube-embed) - Vue.js and YouTube. 31 | - [vue-add-to-calendar](https://github.com/nicolasbeauvais/vue-add-to-calendar) - A Vue.js component that provides "Add to Calendar" functionality, works with Vue 2.X. 32 | - [Vue + Meteor](https://github.com/Akryum/vue-meteor) - Vue first-class integration in Meteor. 33 | - [av-ts](https://github.com/HerringtonDarkholme/av-ts) - A modern, type-safe, idiomatic Vue binding library. 34 | - [Neutronium](https://github.com/NeutroniumCore/Neutronium) - Build .NET desktop applications using HTML, CSS and javascript. 35 | - [vue-typescript-jest](https://github.com/locoslab/vue-typescript-jest) - Jest preprocessor.js for Vue.js components (supporting html, pug, and babel) and TypeScript. 36 | - [vue-jest-utils](https://github.com/locoslab/vue-jest-utils) - Utilities for testing Vue.js components using Jest. 37 | - [vue-custom-element](https://github.com/karol-f/vue-custom-element) - Vue Custom Element - Custom Elements for Vue.js. 38 | - [vue-cordova](https://github.com/kartsims/vue-cordova) - Vue.js plugin for Cordova. 39 | - [vue-wamp](https://github.com/lajosbencz/vue-wamp) - AutobahnJS wrapper library fo Vue.js. 40 | - [express-vue](https://github.com/danmademe/express-vue) - Vue rendering engine for Express.js. Use .Vue files as templates using res.render(). 41 | - [vue-grecaptcha](https://github.com/drozdzynski/vue-grecaptcha) - Google reCAPTCHA for VueJS 2 42 | - [vue-recaptcha](https://github.com/DanSnow/vue-recaptcha) - Google reCAPTCHA component for Vue.js 43 | - [require-vuejs](https://github.com/edgardleal/require-vuejs) - RequireJS plugin to async and dynamic load and parse .vue components. 44 | - [facebook-login-vuejs](https://github.com/iliran11/facebook-login-vue.git) - Vue Component for Authenticating your Facebook App and get the benefits of Facebook Login. 45 | - [vuejs/vuefire](https://github.com/vuejs/vuefire) - Official Firebase Integration for VueJS 46 | - [vuefire](https://github.com/nigeltiany/vuefire) - Firebase for VueJS and Vuex 47 | - [vue-runkit](https://github.com/maple3142/vue-runkit) - RunKit Embed for Vue.js 48 | - [vue-youtube](https://github.com/anteriovieira/vue-youtube) - Provides a simple layer for you to use your imagination while over the [YouTube IFrame Player API](https://developers.google.com/youtube/iframe_api_reference). (Compatible with SSR) 49 | - [vue-introjs](https://github.com/alex-oleshkevich/vue-introjs) - Integrates intro.js step-by-step guide and feature introduction with Vue.js [https://introjs.com/](https://introjs.com/). 50 | - [vue-loopback](https://github.com/InCuca/vue-loopback) - Loopback and Vue application template 51 | - [vue-laroute](https://github.com/samturrell/vue-laroute) - Integrate Laravel routes into your VueJS application using laroute. 52 | - [vue-raven](https://github.com/anteriovieira/vue-raven) - Automatically reports uncaught JavaScript exceptions triggered from vue component. 53 | - [vue-telegram-login](https://github.com/vchaptsev/vue-telegram-login) - Vue Component for [Telegram Login](https://core.telegram.org/widgets/login) 54 | - [vuexpress](https://github.com/vuexpress/vuexpress) - Vue + Express.js = VueXpress / A server-side rendering engine for Express.js. Use .vue files as your Express.js templates 55 | - [vue-fixer](https://github.com/eperedo/vue-fixer) - A simple vue component for the [fixer API](https://fixer.io). 56 | - [amazon-cognito-vuex-module](https://github.com/Botre/amazon-cognito-vuex-module) - Vuex module for Amazon Cognito. 57 | - [vue-web3](https://github.com/morrislaptop/vue-web3) - Web3 blockchain bindings for Vue.js (inspired by Vuefire and Drizzle) 58 | - [sbt-vuefy](https://github.com/GIVESocialMovement/sbt-vuefy) - Vue.js integration for Playframework 59 | - [loopback-vue-starter](https://github.com/ivandov/loopback-vue-starter) - LoopBack and Vue starter template with easy plugin management through `vue-cli` and `vue ui`. 60 | - [vue.py](https://stefanhoelzl.github.io/vue.py/) - Write Vue.js Components in Python 61 | - [vue-telegram-passport](https://github.com/vchaptsev/vue-telegram-passport) - Vue Component for [Telegram Passport](https://telegram.org/blog/passport) 62 | - [vue-facebook-login-component](https://github.com/adi518/vue-facebook-login-component) - A fully customizable component for integrating Facebook login. 63 | - [vue-programmatic-invisible-google-recaptcha](https://github.com/promosis/vue-programmatic-invisible-google-recaptcha) - A simple invisible Google reCAPTCHA component focused solely on programmatic invocation. 64 | - [vbuild](https://github.com/manatlan/vbuild) - Its main purpose is to let you use components (.vue files) in your vuejs app, without a full nodejs stack. Since 0.6 versions : you can create [your component in pure python](https://github.com/manatlan/vbuild/blob/master/doc/PyComponent.md) ! 65 | - [feathers-vuex](https://github.com/feathers-plus/feathers-vuex) - is a first class integration of the Feathers Client and Vuex. It implements many Redux best practices under the hood, eliminates a lot of boilerplate code, and still allows you to easily customize the Vuex store. 66 | - [vue-nocaptcha](https://github.com/chiaweilee/vue-nocaptcha) - Aliyun noCAPTCHA component for Vue.js 67 | - [ionic-vue](https://github.com/ModusCreateOrg/ionic-vue) - Vue.js integration for Ionic v4 68 | - [vue-0xcert](https://github.com/0xcert/framework/tree/master/packages/0xcert-vue-plugin) - Vue.js integration for 0xcert Framework - an open-source library that provides tools for building powerful decentralized applications 69 | - [vue-zdog](https://github.com/AlexandreBonaventure/vue-zdog) - Vue wrapper for zDog - a minimalist 3D engine for the browser 70 | - [vue-unleash](https://github.com/crishellco/vue-unleash) - A Vue plugin for the [Unleash](https://unleash.github.io/) open-source feature flag platform 71 | - [vuejs-playframework](https://github.com/SunPj/silhouette-vuejs-app) - PlayFramework + VueJs integration (dev hot reload && prod static assets) 72 | - [vue-zeye-client](https://github.com/zeye-ru/vue-zeye-client) - A Vue plugin for simple use of the [Zeye-server](https://github.com/zeye-ru/zeye-server) open-source mediasoup WebRTC SFU server 73 | - [vue-postgrest](https://github.com/technowledgy/vue-postgrest) - Vue.js integration for postgREST: flexible, powerful and easy to use 74 | - [Vuecket](https://github.com/OrienteerBAP/vuecket) - WebFramework where power of Vue.JS married with magic of [Apache Wicket](https://wicket.apache.org/) 75 | - [vue-ld](https://github.com/dashhudson/vue-ld) - Vue LaunchDarkly plugin and routing utilities 76 | - [Prisma](https://github.com/sherl0g/prisma) - Logs visualization client for @sherlog/cli 77 | - [vuetube](https://github.com/webistomin/vuetube) - A fast, lightweight, lazyload Vue component acting as a thin layer over the YouTube IFrame Player API which renders fast 78 | - [vue-tweet](https://github.com/DannyFeliz/vue-tweet) - Vue 3 component that let you embed tweets in your app by only giving the tweet ID 79 | - [vue-dapp](https://github.com/chnejohnson/vue-dapp) - Vue 3 library for building Dapps with ethers.js 80 | - [vue3-recaptcha2](https://github.com/bbonch/vue3-recaptcha2) - Google reCAPTCHA 2 for Vue 3 81 | - [hugoVueSFC](https://github.com/indus/hugoVueSFC) - Vue Single-File Components (SFC) in [Hugo](https://gohugo.io/) 82 | - [vue-tg](https://github.com/deptyped/vue-telegram) - Telegram Web Apps integration for Vue 3 83 | 84 | ## Vue CLI Plugins 85 | 86 | - [vue-cli-plugin-cordova](https://github.com/m0dch3n/vue-cli-plugin-cordova) - Vue CLI Plugin to add Cordova easily to your project 87 | - [vue-cli-plugin-component](https://github.com/David-Desmaisons/vue-cli-plugin-component) - Vue CLI Plugin to create component 88 | - [vue-cli-plugin-modular-vuex](https://github.com/PureConstructs/vue-cli-plugin-modular-vuex) - Vue CLI Plugin to create modular Vuex store files 89 | - [vue-cli-plugin-modular-router](https://github.com/PureConstructs/vue-cli-plugin-modular-router) - Vue CLI Plugin to create modular route files 90 | - [vue-cli-plugin-docker-nginx](https://github.com/truefalse10/vue-cli-plugin-docker-nginx) - Vue CLI Plugin to add a docker deployment using a minimal nginx server 91 | - [vue-cli-plugin-element](https://github.com/codetrial/vue-cli-plugin-element) - Vue CLI Plugin to build an enterprise application with element-ui in seconds 92 | - [vue-cli-plugin-electron-builder](https://github.com/nklayman/vue-cli-plugin-electron-builder) - Vue CLI Plugin for Electron with no required configuration that uses Electron Builder. 93 | - [vue-cli-plugin-codeceptjs-puppeteer](https://github.com/codecept-js/vue-cli-plugin-codeceptjs-puppeteer) - Installs CodeceptJS & Puppeteer for supercharged end-to-end testing 94 | - [vue-cli-plugin-kami](https://github.com/KamiMeow/vue-cli-plugin-kami) - Vue CLI Plugin with work-made architecture for quickly start your app 95 | - [vue-cli-plugin-auto-alias](https://github.com/BryanAdamss/vue-cli-plugin-auto-alias) - Vue CLI Plugin to automatically set aliases 96 | - [vue-cli-plugin-clean](https://github.com/DevTony101/vue-cli-plugin-clean) - Vue CLI Plugin to help you clean and quickly set up your Vue app by adding some common tools and patterns 97 | - [vue-cli-plugin-mock](https://github.com/xuxihai123/vue-cli-plugin-mock) - Vue CLI Plugin to mock HTTP requests 98 | - [vue-cli-plugin-ci](https://github.com/P0ppoff/vue-cli-plugin-ci) - Vue CLI Plugin to generate CI agent config file to start project with CI 99 | - [vue-cli-plugin-capacitor](https://github.com/capacitor-community/vue-cli-plugin-capacitor) - A Vue CLI 3 Plugin for Capacitor 100 | - [vue-cli-plugin-chrome-extension-cli](https://github.com/sanyu1225/vue-cli-plugin-chrome-extension-cli) - Vue CLI Plugin to generate Chrome extension template 101 | 102 | ## Google Analytics 103 | 104 | - [vue-ua](https://github.com/ScreamZ/vue-analytics) - Google Universal Analytics support in Vue.js. 105 | - [vue-analytics](https://github.com/MatteoGabriele/vue-analytics) - Vue plugin for Google Analytics. 106 | - [vue-gtm](https://github.com/mib200/vue-gtm) - Vue plugin for Google Tag Manager 107 | - [vue-gtag](https://github.com/MatteoGabriele/vue-gtag) - Global Site Tag plugin for Vue 108 | 109 | ## Yandex Metrika 110 | 111 | - [vue-ya-metrica](https://github.com/shershen08/vue-ya-metrica) - Vue plugin for Yandex.Metrica 112 | - [vue-yandex-metrika](https://github.com/vchaptsev/vue-yandex-metrika) - Vue plugin for Yandex Metrika with router integration, plugin options 113 | -------------------------------------------------------------------------------- /content/components-and-libraries/scaffold.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: A collection of scaffolds, boilerplates, project seeds, starter kits, stack ensemble, Yeoman generator and others for Vue.js 5 | - name: og:title 6 | content: Scaffold 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/components-and-libraries/scaffold.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: A collection of scaffolds, boilerplates, project seeds, starter kits, stack ensemble, Yeoman generator and others for Vue.js 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Scaffold 19 | - name: twitter:description 20 | content: A collection of scaffolds, boilerplates, project seeds, starter kits, stack ensemble, Yeoman generator and others for Vue.js 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Scaffold 26 | 27 | Scaffold / boilerplate / seed / starter kits / stack ensemble / Yeoman generator 28 | 29 | - [vue-cli](https://github.com/vuejs/vue-cli) - Simple CLI for scaffolding Vue.js projects. 30 | - [Vue-Django](https://github.com/NdagiStanley/vue-django) - A boilerplate to set you up in bringing the awesomeness of VueJS into a Django (Python) app. 31 | - [python-vuejs](https://github.com/cstrap/python-vuejs) - Gluing Python web frameworks and Vue.js with a set of scripts. Basically a `vue-cli` wrapper. 32 | - [generator-vue-plugin](https://github.com/jeneser/generator-vue-plugin) - Yeoman generator generating vue plugin. 33 | - [vue-seed](https://github.com/dulin666/vue-seed) - vue-seed is minimal seed for those looking to get up-and-running with Vue 34 | - [nuxt-seed](https://github.com/dulin666/nuxt-seed) - nuxt-seed is minimal seed for those looking to get up-and-running with Vue and Nuxt 35 | - [rails_vue_melt](https://github.com/midnightSuyama/rails_vue_melt) - Rails view with webpack=vue optimizer. 36 | - [vue-starter](https://github.com/rohitkrai03/vue-starter) - A Vue.js starter kit that lets you focus on more programming and less configuration. 37 | - [vuejs-wordpress-theme-starter](https://github.com/EvanAgee/vuejs-wordpress-theme-starter) - A WordPress theme with the guts ripped out and replaced with Vue 38 | - [Cordovue](https://github.com/TheMushrr00m/cordovue) - A sample Apache Cordova application using Vue. 39 | - [Cookiecutter-Django-Vue](https://github.com/vchaptsev/cookiecutter-django-vue) - Django+VueJS+Docker customizable project generator with a large number of settings/integrations 40 | - [iBiu](https://github.com/bobiscool/iBiu) - A visual CLI for scaffolding large Vue projects in 2 seconds. 41 | - [wp-vue](https://github.com/alexmacarthur/wp-vue) - A simple Vue blog template that displays posts from a WordPress REST API endpoint. 42 | - [vue-cli-template-nativescript](https://github.com/julon/vue-cli-template-nativescript) - Template for starting new nativescript+vue projects with rollup+babel+eslint 43 | - [vue-element-ui-scaffold](https://scaffoldhub.io/vue-sample) - Online and visual Vue 2 with Element-UI CRUD scaffold/generator. 44 | - [vue-firebase-element-ui-scaffold](https://scaffoldhub.io/vue-firebase) - Online and visual Vue 2, Element-UI and Firebase scaffold/generator with CRUDs, authentication, file/image upload, activity log and more. 45 | - [vuesion](https://github.com/vuesion/vuesion) - Vuesion is a boilerplate that helps product teams build faster than ever with fewer headaches and modern best practices across engineering & design 46 | - [vue-vuex-typescript-webpack-seed](https://github.com/IsraelZablianov/vue-vuex-typescript-webpack-seed) - A seed project with Vue, Vuex, Typescript, Scss & Webpack with hot reloading 47 | - [VueCharged Template](https://github.com/mrboomer/vuecharged-template) - A highly opinionated, feature-first Vue 2 template with CLI scaffolding. Uses Vue 2, Vuex, Vue Router and Vue I18n. 48 | - [Huncwot](https://github.com/zaiste/huncwot) - Vue.js boilerplate with Node.js for building modern JavaScript applications with « batteries included » approach. 49 | - [wemake-vue-template](https://github.com/wemake-services/wemake-vue-template) - Bleeding edge vue template focused on code quality and developer happiness. Featuring: nuxt, flow, and jest. 50 | - [vue-lib-template](https://github.com/biigpongsatorn/vue-lib-template) - A simple template for building and publishing Vue component/library as an open source project 51 | - [Awesome Vue Boilerplate](https://github.com/NarHakobyan/awesome-vue-boilerplate) - Awesome Vue, Vuex, Vuex-pathify, element-ui, tailwindcss 52 | - [ScaffoldHub.io](https://scaffoldhub.io) - Generate full Vue applications with SQL, MongoDB or Firebase Firestore databases. 53 | - [VuePlay](https://christiankienle.github.io/vueplay/) - Generate disposable Vue playgrounds in seconds. Allows you to test things quickly. 54 | - [Mevn-CLI](https://github.com/madlabsinc/mevn-cli) - Light speed setup for MEVN stack based apps. 55 | - [vue-cli-template-registry](https://github.com/eliranmal/vue-cli-template-registry) - A solution for installing vue-cli custom templates hosted on private/enterprise repositories. 56 | - [Vuejs Firebase CRUD Starter with Auth](https://github.com/Timtech4u/vuejs-firebase-cruder) 57 | - [vue-enterprise-boilerplate](https://github.com/chrisvfritz/vue-enterprise-boilerplate) - An ever-evolving, very opinionated architecture and dev environment for new Vue SPA projects using Vue CLI 3 58 | - [nuxt-headless](https://github.com/bovas85/nuxt-headless) - Boilerplate for Nuxt.js using Wordpress REST API as headless CMS 59 | - [vue-starters-directory](https://shershen08.github.io/vue-starters-directory/) - Search for available scaffold projects and starter kits for VueJS. Features search and github stats are available 60 | - [janak](https://github.com/vinayakkulkarni/janak) - Build your Vue 3 apps in a breeze 61 | - [vue-composable-starter](https://github.com/Tahul/vue-composable-starter) - Minimalist starting point for your next Vue composable 62 | - [Vuetify-tailwind-animate-starter](https://github.com/GoodManWEN/vuetify-tailwind-animate-starter) - A vue-cli starter template for Vuetify + Tailwind CSS + Animate.css 63 | - [vuejs-vuetify-structured-template boilerplate](https://github.com/huogerac/crud-vuetify-structured-template) - A vue-cli template for a full-featured Vue.js + Vuetify + great structure + API ready 64 | - [vue-component-starter](https://github.com/peterroe/vue-component-starter) - A template to help you create Vue 3.x component 65 | - [Vue3-SPA-starter-template](https://github.com/M-Media-Group/Vue3-SPA-starter-template) - A starter kit with Router, Pinia, i18n, Stripe, Event Bus, SEO meta and schema tag handling, and more 66 | 67 | ## Client 68 | 69 | Render Vue application in the browser only 70 | 71 | - [Bourgeon](https://github.com/rayfranco/bourgeon) - Bourgeon is an opinionated-featured VueJS 2.0 setup for Webpack. 72 | - [Vue Settler](https://github.com/weavingbird/vue-settler) - An opinionated Vue 2.0 SPA Starter. 73 | - [vue-multiple-pages](https://github.com/Plortinus/vue-multiple-pages) - A modern Vue.js multiple pages starter which uses Vue 2, Webpack2, and Element-UI 74 | - [vue-typescript-boilerplate](https://github.com/twcapps/vue-typescript-boilerplate) - A Vue.js typescript SPA starter with Vue 2, Vue Typed, Vuex, Vue Router and localization 75 | - [vue-tachyons-template](https://github.com/colorful-tones/vue-tachyons-template) - A Vue 2 project starter template w/ Tachyons, Webpack, and ESLint 76 | - [Vuets](https://github.com/AkiraLaine/Vuets) - A Vue, TypeScript ready boilerplate using class-style components, vue plugin options, webpack & vue-cli. 77 | - [MMF-FE/vue-typescript](https://github.com/MMF-FE/vue-typescript) - A vue2.x typescript template. 78 | - [Friendly Vue Starter](https://github.com/mcongy/friendly-vue-starter) - A full-featured Vue.js starter project with GraphQL support via Apollo-client (Vuex, Vue-router, Vue-i18n, Webpack 3, Eslint, Prettier, ...) 79 | - [vue-ts-amd](https://github.com/Micene09/vue-ts-amd) - A full-featured Vue.js 2 boilerplate using AMD pattern (RequireJS) and Typescript. 80 | - [vue-2-boilerplate](https://github.com/petervmeijgaard/vue-2-boilerplate) - Vue 2 boilerplate for developing medium to large single page applications by [petervmeijgaard](https://github.com/petervmeijgaard/) 81 | - [vue-cli-template-library](https://github.com/julon/vue-cli-template-library) - Template for developing open-source vue.js libraries with Rollup + Jest + Babel + Storybook + TravisCI + SemanticRelease. 82 | - [vue-cli-template-github-pages](https://github.com/julon/vue-cli-template-github-pages) - A full-featured Webpack + vue-loader setup for Github Pages Deployment with travisCI. 83 | - [vue-webpack-chrome-extension-template](https://github.com/ALiangLiang/vue-webpack-chrome-extension-template) - Template for quick creation of Chrome extension on Vuejs hot reloading when developing. 84 | - [vue-auth-boilerplate](https://github.com/VPetar/vue-auth-boilerplate) - Vue SPA boilerplate with Router/Vuex/CLI3 and auth functions (cool looking register and login). Works with minimal setup out of the box with [laravel-api-boilerplate-jwt](https://github.com/VPetar/laravel-api-boilerplate-jwt). 85 | - [vue-atomic-design](https://github.com/alexander-elgin/vue-atomic-design) - Vue front-end boilerplate based on atomic design methodology. 86 | - [vue3-compact-template](https://github.com/upupming/vue3-compact-template) - A simple and compact Vue 3 template with current cutting edge front-end technologies 87 | 88 | ## Universal 89 | 90 | Render Vue application to HTML on the server and to the DOM in the browser 91 | 92 | - [SPA Starter Kit](https://github.com/codecasts/spa-starter-kit) - A highly opinionated starter kit for building Single Page Applications with Laravel and Vue.js. 93 | - [SSR Boilerplate](https://github.com/fenivana/vue-ssr-boilerplate) - Vue.js server-side rendering boilerplate without polluting Vuex 94 | - [neutrino-preset-vue-static](https://github.com/shyiko/neutrino-preset-vue-static) - A minimalistic starter kit for building static sites using Vue.js. 95 | - [Vueniverse](https://github.com/rlindskog/vueniverse) - A fully featured, universal Vue template for user-based applications, powered by Nuxt.js and Express. 96 | - [vue-preload](https://github.com/shershen08/vue-preload) - A plugin Vue for adding `2.x.), vue-router(>2.x.), vuex(>2.x.), vuex-router-sync@next(>3.x.) and Firebase(>3.6.x) by [akifo](https://github.com/akifo) 61 | - [Resume Vue](https://github.com/ChangJoo-Park/Resume-Vue) JSON based Resume based on Vue 2.0 by [ChangJoo Park](https://github.com/ChangJoo-Park/) 62 | - [App example with JWT Authentication](https://github.com/Angarsk8/phoenix_vuejs_authentication_example) developed with `Phoenix Framework`, Vue and Vue Router ([_demo_](https://phoenix-vue-auth.herokuapp.com)) 63 | - [Sample CRUD app with router in Vue 2.0](https://github.com/shershen08/vue.js-v2-crud-application) by [@shershen08](https://github.com/shershen08) 64 | - [ASP.NET Core Vue.js server-side rendering sample](https://github.com/mgyongyosi/VuejsSSRSample) by [@mgyongyosi](https://github.com/mgyongyosi) 65 | - [vuefire-quickstart](https://github.com/sejr/vuefire-quickstart) - Documented Firebase integration w/ webpack and eslint, by [@sejr](https://github.com/sejr). 66 | - [hello-vue-django Vue.js and Django integration starter project with hot code reload](https://github.com/rokups/hello-vue-django) 67 | - [Real Time Social News App](https://github.com/Angarsk8/loopa-news) developed with `Phoenix Framework`, Vue, Vue Router and Vuex ([_demo_](https://loopa-news.herokuapp.com)) 68 | - [vue-calculator](https://github.com/CaiYiLiang/simply-calculator-vuejs) a simply calculator built with Vue 2.0, vue-cli(webpack-simple) 69 | - [Wikipedia-viewer](https://github.com/CaiYiLiang/vue-demos/tree/master/wikipediaViewer-vuejs) A simple wikipedia-viewer page built with vue2.x ,vue-router,vue-cli(webpack-simple) and ajax(jsonp) 70 | - [vue2.x-douban](https://github.com/superman66/vue2.x-douban) A simple of douban movie build with vue2.x,vue-router and axios(豆瓣电影). by [Superman](https://github.com/superman66) 71 | - [vue-laravel-example](https://github.com/jcc/vue-laravel-example) Vue - Laravel - Example is a simple example to set Vue with Laravel. by [Jiajian Chan](https://github.com/jcc) 72 | - [vue-foundation](https://github.com/hal0gen/vue-foundation) A demo app integrating VueJS with [Zurb Foundation](https://github.com/zurb/foundation-sites), built using the webpack vue-cli f 73 | - [aspnetcore-Vue-starter](https://github.com/MarkPieszak/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. 74 | - [vue-reddit-app](https://github.com/yujiahaol68/reddit-app) A Reddit SPA [_demo_](https://yujiahaol68.github.io/reddit-app/) built with Vue 2.X , Vue Router 2 , Vuex and axios. Using Muse-UI and vue-cli webpack template by [@yujiahaol68](https://github.com/yujiahaol68) 75 | - [vue-music-qq](https://github.com/pluto1114/vue-music-qq) A qq-music project is based on vue-cli. The pages are simple and smooth 76 | - [NavigationTab with Vue-Redux and Plain VueJSX](https://github.com/ShuvoHabib/Vue-JSX-and-Vue-Redux-Navigation-Tab) Navigation Tab with both plain Vue JSX and Vue + Redux Binding 77 | - [Veggie Map](https://veggiemap.herokuapp.com/) An interactive demo using Vuejs + Vue router + Leaflet and Firebase 78 | - [vuejs-d3](https://github.com/johnnynotsolucky/samples/tree/master/vuejs-d3) examples how to use d3 for visualisations. 79 | - [vue-twitter-client](https://github.com/YuheiNakasaka/vue-twitter-client) A Twitter Client App build with Vue 2.X, Vuex, electron-vue and Electron 80 | - [Douban](https://github.com/jeneser/douban) Awesome douban Example created with Vue2.x + Vuex + Vue-router + vue-resource. by [jeneser](https://github.com/jeneser) 81 | - [Storyblok vuejs-boilerplate](https://github.com/storyblok/vuejs-boilerplate) - Integrates Storyblok's Component System, allows to create editable Websites. 82 | - [Vuexpresso](https://github.com/Ethaan/vuexpresso) - A boilerplate using VueX, Vue-Router, Vue-Apollo, webpack, GraphQL, Apollo-client, express and mongo 83 | - [Vue.js with Sails.js example project](https://github.com/ndabAP/vue-sails-example) - This project is for those who are new to single-page applications and want to learn through a real example. 84 | - [Vue.js & Pyramid web framework app](https://github.com/eddyekofo94/pyramidVue.git) - A boilerplate using Pylons Pyramid webframework backend Vuejs webpack2, vue-router, yarn(packet manager) 85 | - [vue-feathers-chat](https://github.com/ErickPetru/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 86 | - [vue-xplan](https://github.com/JackGit/xplan/) A rotating earth demo page created with Vue and three.js 87 | - [vueSocketChatRoom](https://github.com/Chanran/vueSocketChatroom) A socket chat room using vue2.x,vuex2.x,vue-router2.x,vux2.x,socket.io 88 | - [vue-tetris (Use Vue, Vuex, Immutable to code Tetris)](https://binaryify.github.io/vue-tetris/) by [@Binaryify](https://github.com/Binaryify): Use Vue, Vuex, Immutable to code Tetris. 89 | - [route-planner-vue](https://kasheftin.github.io/route-planner-vue/) by [@Kasheftin](https://github.com/Kasheftin): The tool for planning routes with multiple sortable layers, draggable directions, markers and shapes on google map. 90 | - [MyDiary-Vue](https://github.com/ssshooter/MyDiary-Vue/blob/master/README.En.md) A diary application build with Vue 2.X which is also have contact and todolist function 91 | - [VueJS Example Projects](https://github.com/vue-project) on Github 92 | - [todo-mvc-webpack](https://github.com/voluntadpear/todomvc-vue-webpack) by [voluntapear](https://github.com/voluntadpear) TodoMVC implementation on Vue 2 using the webpack-basic template with examples showing vuex, vue-router, central event bus and VueFire. 93 | - [Chess Storybook Example](https://github.com/gustaYo/vue-chess-storybook) with Vue 2.0 94 | - [Vue Weather Notifier](https://github.com/sdras/vue-weather-notifier) A small sample animation app with SVG and Vuex 95 | - [VueBlog](https://github.com/wmui/vueblog) A blog system supporting service side rendering by [wmui](https://github.com/wmui) 96 | - [Cinemateka](https://github.com/Piterden/cinemateka) - An example of SPA made with Vue v1 & Laravel 5. Film & events schedule. Russian comments. 97 | - [vue-2.x-boilerplate](https://github.com/the6thm0nth/vue-2.x-boilerplate) - A simple and small starter kit for a Vue project Vuex + vue-router 98 | - [vue-minesweeper](https://github.com/rhapsodyn/vue-minesweeper) - A deadly simple minesweeper game with vuejs by [rhapsodyn](https://github.com/rhapsodyn) 99 | - [X-Flowchart-Vue](https://github.com/OXOYO/X-Flowchart-Vue) - A flowchart editor with SVG and Vue 100 | - [koa-vue-notes-web](https://github.com/johndatserakis/koa-vue-notes-web) - A fleshed-out SPA using Koa 2.3 on the backend and Vue 2.4 on the frontend. Includes fully featured user-authentication components, CRUD actions for the user's notes, and Vuex store modules. 101 | - [Vuejs Shopping Cart](https://github.com/ittus/vuejs-firebase-shopping-cart) - Shopping cart example using Vuejs and Firebase 102 | - [PokedexVueJs](https://github.com/rchung95/PokedexVueJs) by @rchung95 103 | - [vuefire-auth](https://github.com/aofdev/vuefire-auth) A Vuefire Vue2-Auth-Email Verification with Firebase 104 | - [vuefire-realtimedatabase](https://github.com/aofdev/vuefire-realtimedatabase) A Vuefire Vue2-RealtimeDatabaseCRUD with Firebase 105 | - [vuefire-storage](https://github.com/aofdev/vuefire-storage) A Vuefire Vue2-Storage with Firebase 106 | - [Vue2-PWA-Blog](https://github.com/deepak-singh/vue-blog-pwa) by @deepak-singh 107 | - [vue-firebase-auth-vuex](https://github.com/aofdev/vue-firebase-auth-vuex) A Vue2 Firebase Authentication with Vuex and support Progressive Web Apps 108 | - [vue-chart-stater-kit](https://github.com/joshua1988/vue-chart-starter-kit) Quick starter using Vue Router, Vue Chart, Element-UI 109 | - [vue2.0-demos](https://github.com/qianyinghuanmie/vue2.0-demos) using mint-ui, Element-UI,And have Some demos（select city and so on） 110 | - [conway](https://github.com/edge/conway) Conway's Game of Life in Vue. 111 | - [vuex-feature-scoped-structure](https://github.com/igeligel/vuex-feature-scoped-structure) An example application of the feature scoped vuex application structure 112 | - [vuex-examples](https://github.com/ooade/vuex-examples) - Simple Examples on using Vuex to build Real World Apps 113 | - [vue-vuex-todomvc](https://github.com/bahmutov/vue-vuex-todomvc) - Example TodoMVC Vue.js app with Vuex store and server backend via REST and full set of E2E tests using [Cypress.io](https://www.cypress.io/) test runner. 114 | - [vuejs-sqljs-boilerplate](https://github.com/skysign/vuejs-sqljs-boilerplate) - This is a boilerplate to use both Vue.js and sql.js together 115 | - [X-WebDesktop-Vue](https://github.com/OXOYO/X-WebDesktop-Vue) - The WebDesktop system based on Vue 116 | - [vuejs-music-player](https://github.com/Jamaks/vuejs-music-player) - A Vue.js lite music player 117 | - [Vue.js Best Practices Example Project](https://github.com/sarneeh/vuejs-example-stock-trader) - A best practices example project using Vue.js + Vue Router + Vuex + Vuelidate 118 | - [Vue.js \[ONE\] client](https://github.com/jasscia/one) - \[ONE\] client written with Vue 2.5 119 | - [Vue.js 2.5 with vue-cli v3 including authentication with auth0](https://github.com/DominikAngerer/auth0-vue) by Dominik Angerer, Storyblok 120 | - [Skeleton Vue+TypeScript](https://github.com/SierraSoftworks/vue-template) - TypeScript, VueJS, ElementUI, Vue Router, Vuex, Material Icons, BrowserSync, Dockerfile 121 | - [**PENV Starter**](https://github.com/jesalg/penv-starter) - A basic example of how to use VueJS, Express and PostgreSQL in conjunction 122 | - [vue-relay-examples](https://github.com/ntkme/vue-relay-examples) - A collection of example applications using vue-relay. 123 | - [laravel-vue-boilerplate](https://github.com/alefesouza/laravel-vue-boilerplate) - A Laravel 5.5 SPA boilerplate with a users CRUD using Vue.js 2.5, Bootstrap 4, TypeScript, Sass, Pug and Jest. 124 | - [Vue Design System](https://github.com/viljamis/vue-design-system) - An open source boilerplate for building UI Design Systems with Vue.js. 125 | - [Vue Bulma Demo](https://github.com/faisaltheparttimecoder/bulma-vuejs-demo-website) - A simple demo website to check out Bulma / Vue JS & express in conjunction. 126 | - [Starter application ready for production with TypeScript, vuex, vue-router, HMR and more](https://github.com/kadro/vue-boilerplate) 127 | - [vue.js与laravel结合的前后端分离开发模板](https://github.com/wmhello/laravel_template_with_vue)- A template website to laravel passport / Vue.JS & Element UI. 128 | - [Hands-On Web Development with Vue.js](https://www.packtpub.com/web-development/hands-web-development-vuejs-video) by Roman Kuba, Packt. (May 2018) 129 | - [Vue Online Shopping Mall](https://github.com/PowerDos/Mall-Vue) - A online shopping mall SPA demo, 基于VUE开发的前后端分离电子商城前端项目 130 | - [FUE](https://github.com/elaijuh/fue) - Admin SPA client and server-side boilerplate with Vue.js + Vue Router + Vuex + Vuetify + FeathersJS 131 | - [Vue + TypeScript Cookbook](https://github.com/ffxsam/vue-typescript-cookbook/blob/master/README.md) - A small cookbook covering some less-than-obvious solutions for people getting started with Vue + TypeScript 132 | - [Vuejs Examples](https://vuejsexamples.com/) 133 | - [ASP.NET Core Vue Starter CLI 3.0](https://github.com/SoftwareAteliers/asp-net-core-vue-starter) A Vue starter template using Vue CLI 3.0 with custom configuration (default TypeScript, Vue, Router, Vuex, Vuetify) integrated with ASP.​NET Core by [@SoftwareAteliers](https://github.com/SoftwareAteliers) (September 2018) 134 | - [vue-soundcloud](https://github.com/soroushchehresa/vue-soundcloud) A Soundcloud client built with Vue.js 2, by [Soroush Chehresa](https://github.com/soroushchehresa) 135 | - [vue-cart](https://github.com/crisgon/vue-cart) - A simple shop cart made with vue, vuex and vue router. by [crisgon](https://github.com/crisgon) 136 | - [Nuxt + Apollo + Element](https://github.com/kavalcante/nuxt-element-apollo) A Vue.js SSR boilerplate with Nuxt, Element (custom theme) and Vue Apollo. 137 | - [vue-daily-zhihu](https://github.com/walleeeee/daily-zhihu) a simple demo build with Vue 2.0 & vue-router & vuex by [walleeeee](https://github.com/walleeeee) 138 | - [Multi-page ASP.NET Core Vue with TypeScript](https://github.com/danijelh/aspnetcore-vue-typescript-template) - Multi-page ASP.NET Core Vue, Typescript, Vuex, Vue router, Bulma, Sass and Jest application. Template/starting point on how to use Vue.js as a multi page(multiple mini spa's) application in .NET Core MVC. 139 | - [CION - Design system boilerplate for Vue.js](https://github.com/visualjerk/vue-cion-design-system) - A design system build primarily for Vue.js applications. It utilizes design tokens, a living styleguide with integrated code playgrounds and reusable components for common UI tasks. 140 | - [Vue websockets example](https://github.com/latovicalmin/vuejs-websockets-example) - A basic example of Websockets usage with Vue.js 2 + Node project for full working example. 141 | - [Vue(2.0) + Node.js: A blog](https://github.com/FatDong1/vue-blog) by @FatDong1 142 | - [vue-todo-list](https://github.com/alexander-elgin/vue-todo-list) ToDo List sample app based on Vue + Vuex + Vuetify + Vee-Validate 143 | - [Vue.js and Ionic v4 examples](https://github.com/ModusCreateOrg/ionic-vue-examples/) - A set of examples of how to use Ionic v4 with Vue.js 144 | - [Personal Website that use Vue, Vuex and Vue-Router](https://github.com/snturk/snturk.github.io) - A simple website example that made with vue, vuex and vue-router by [Muratcan Şentürk](https://github.com/snturk) 145 | - [Client-Side Vue.js](https://github.com/justinwash/Client-Side-Vue) - [Demo](https://client-side-vue.herokuapp.com) - Vue.js client-side for tiny, quick-loading, Node.js-less Single Page Apps by [Justin Wash](https://github.com/justinwash) 146 | - [Large scale Vue.js application boilerplate + Vuex](https://github.com/arunredhu/vuejs_boilerplate) - A boilerplate for starting large scale, flexible Vue.js application with using Vuex as state management - by [Arun Redhu](https://arunredhu.in) 147 | - [Snake game on Vue.js without Canvas](https://github.com/Seokky/vue-snake-game) 148 | - [A one-on-one chat app in Vue with CometChat](https://github.com/cometchat-pro-tutorials/vue-cometchat-one-on-one-chat) 149 | - [Vue webpack typescript](https://github.com/akoidan/vue-webpack-typescript) - Boilerplate with sass/ts/sfc linters. Full typesafety including vuex and nice looking vue component with `vuex-module-decorators`, `vue-property-decorator` 150 | - [Laravel + Nuxt.js boilerplate](https://github.com/acidjazz/laranuxt) - by [@acidjazz](https://github.com/acidjazz) 151 | - [Add Push Notifications to Your Vue Chat App Using CometChat and Firebase](https://www.cometchat.com/tutorials/vue-chat-push-notifications/) 152 | - [TO](https://github.com/snturk/to) - A social media app that allows you post just texts 153 | - [All-About-Me](https://github.com/ooxxro/all-about-me) - A Social Media Web App built with Vue, Firebase (Firestore/Auth/Storage), Element-UI, Disqus, Vuex, Vue-Router, and Sass. Supports image uploading, profile editing, add/remove friends, and comments. 154 | - [Vue Voyagers Space Travel](https://neodigm.github.io/vue_voyagers/) - A Vue.js Gamified example SPA that consumes a REST API. It presents infographics via D3.js, animation, and web audio 155 | - [TodoMVC Vue 3 Composition API](https://github.com/blacksonic/todomvc-vue-composition-api) - A complete TodoMVC implementation in Vue 3 Composition API with components, store, unit e2e tests and linting 156 | - [TodoMVC Vue](https://github.com/blacksonic/todomvc-vue) - A complete TodoMVC implementation in Vue 2 with components, store, unit e2e tests and linting 157 | - [Movie search app with Composition API](https://github.com/blacksonic/movie-search-vue) - A movie search app implemented in Vue 2 with the Composition API plugin 158 | - [Nuxt with JWT authentication via OTP](https://github.com/reiallenramos/nuxtjs-otp-boilerplate) - A Nuxt.js boilerplate with basic register and OTP-enabled login functions 159 | - [vuetify-i18n-boilerplate](https://github.com/Morgbn/vuetify-i18n-boilerplate) - [Demo](https://morgbn.github.io/vuetify-i18n-boilerplate) - A boilerplate to quickly start a Vue project using Vuetify, Vue-i18n, Vuex and Vue-router 160 | - [Google Keep Clone with Vue + Firestore](https://github.com/sorxrob/vue-keep) - Google Keep clone with Vue and Firestore written in TypeScript 161 | - [Go-echo-vuejs-boilerplate](https://github.com/faisaltheparttimecoder/go-echo-vuejs-boilerplate) - Boilerplate that uses go with echo framework as a backend and vuejs that serve the web traffic 162 | - [Vue-Next-TicTacToe](https://github.com/canersevince/Vue-Next-TicTacToe-Game) - Simple Tic Tac Toe Game made with Vue Next 163 | - [Vue 3 example without Webpack](https://github.com/arijs/vue-next-example) - An example of how to build a Vue app with Vue-Router without the need for Webpack or any other build tool. Includes the ability to prerender components and pages with Vue Server Renderer 164 | - [COVID19 Live Data Component](https://github.com/snturk/covid19-vue-component) - Simple component that shows live COVID-19 data across the world 165 | - [vue-stack-cesium](https://github.com/meschg/vue-stack-cesium) - A minimal sample configuration project with [CesiumJS](https://cesium.com/cesiumjs/) and all the awesome Vue features. The project contains many examples how to combine and use certain packages to get started 166 | - [Shopify Theme Lab](https://github.com/uicrooks/shopify-theme-lab) - Shopify theme development starter using Vue, Vuex and Tailwind CSS 167 | - [Peer to Peer game of telephone](https://github.com/ably-labs/depict-it) - A party game for 4 to 8 players (ideally!) where you mutate a phrase through drawings and captions, to make up funny scenarios with your friends. The project is an example of how to build a peer-to-peer game with Vue 168 | - [vue3-webpack](https://github.com/boussadjra/vue3-webpack) - Vue 3 + Webpack 4 starter 169 | - [laravel-vue-3-starter](https://github.com/boussadjra/laravel-vue-3-starter) - A pre-configured project using Laravel 8 and Vue 3 170 | - [Vuetify Swipeout](https://github.com/davidgaroro/vuetify-swipeout) - A swipe out example built with Vue 2 + Vuetify + Swiper 171 | - [Vuetify Todo PWA](https://github.com/davidgaroro/vuetify-todo-pwa) - A simple Todo PWA built with Vue 2 + Vuex + Vuetify 172 | - [Vue Todo PWA](https://github.com/davidgaroro/vue-todo-pwa) - A simple Todo PWA built with Vue 3 + Vuex + Bootstrap 5 173 | - [Vue simulating](https://github.com/GoodManWEN/GoodManWEN.github.io) - A website simulating Linux system's GUI, using theme of Deepin distro. Using Vue + Tailwind CSS + Animate.css 174 | - [Vue Word Game](https://github.com/debadeepsen/vuewordgame) - A simple Hangman-like word guessing game, built with Vue 2 175 | - [Coinchartsvue](https://github.com/okandas/coinchartsvue) - Coinchartsvue is a cryptocurrency price chart based off Coinbase's original price chart 176 | - [Vue 3 Shopping Cart](https://github.com/sorxrob/vue-cart) - A Shopping cart example using Vue 3, Vite, [daisyUI](https://daisyui.com/) and [Pinia](https://pinia.esm.dev/) 177 | - [Lipku](https://www.lipku.com/vuejs) - Vue.js charts and other libraries 178 | - [vuemoji-picker](https://github.com/wobsoriano/vuemoji-picker) - Vue 2 and 3 lightweight emoji picker 179 | - [Maxim Web Chat](https://github.com/maxim-top/maxim-web) - A chat demo using [MaximTop](https://www.maximtop.com)'s IM SDK (floo), 使用美信拓扑 IM SDK 实现的聊天App 示例 180 | - [vue-cli-3-tailwind-axios-starter](https://github.com/Ted2xmen/vue-cli-3-tailwind-axios-starter) - A boilerplate using Tailwind, Axios-ready, Vuex and Router 181 | - [vue-cli-3-wave-ui-starter](https://github.com/Ted2xmen/vue-cli-3-wave-ui-starter) - A boilerplate using Wave UI + Vuex and Router 182 | - [CVue-Awesome](https://github.com/coskuncayemre/CVue-Awesome) - Auto resume builder by [Emre Coşkunçay](https://github.com/coskuncayemre) 183 | - [Vue 3 TypeScript Library Template](https://github.com/TinkoLiu/vue3-ts-lib-template) - A simple but complete library template for Vue 3, supports generating `.vue.d.ts` 184 | - [Customizable Vue video chat app](https://github.com/daily-demos/vue-call-object) - A Vue video call demo app featuring local device controls and screen sharing 185 | - [Vue3-Starter](https://github.com/cerino-ligutom/Vue3-Starter) - A boilerplate with an opinion on how to structure your files/folders with a few examples such as Vue Router navigation guards, theming with Tailwind CSS, form validation w/ Vuelidate, localization with Fluent, etc. 186 | - [Text Editor](https://github.com/devisasari/text-editor-vue-3) - Text editor made with Vue 3 Composition API, Bootstrap and Firebase by [İsa Sarı](https://github.com/devisasari) 187 | - [Vue 3 + Laravel v9 - Boilerplate / Starter kit](https://github.com/fsgreco/vue3-laravel-api) - An implementation of the Laravel Breeze application/authentication starter kit frontend in Vue.js v3. How a library can become a framework with the help of Pinia and vue-router 188 | - [h5](https://github.com/gyt95/h5) - A Monorepo-based mobile engineering project. (Monorepo + Pnpm + Vite 3.x + Vue 3.2+ + TypeScript 4.x + VueRouter 4.x + Pinia...) 189 | - [Vitesse Starter](https://github.com/antfu/vitesse) - Vue 3 starter inclode ( Layouts | i18n | UnoCSS | pinia | Markdown | Dark Mode | PWA | SSG | Component Auto-Importing | File-Based Router | Composition API | TypeScript) 190 | - [Vitesse-lite Starter](https://github.com/antfu/vitesse-lite) - Lightweight version of Vitesse (Vue 3 Starter) 191 | - [vue-plugin-boilerplate](https://github.com/selimdoyranli/vue-plugin-boilerplate) - Boilerplate for Vue 2 & 3 plugin development 192 | -------------------------------------------------------------------------------- /content/resources/tutorials.md: -------------------------------------------------------------------------------- 1 | --- 2 | meta: 3 | - name: description 4 | content: Tutorials and guides for Vue.js development 5 | - name: og:title 6 | content: Tutorials 7 | - name: og:type 8 | content: website 9 | - name: og:url 10 | content: https://awesome-vue.js.org/resources/tutorials.html 11 | - name: og:image 12 | content: https://awesome-vue.js.org/hero.png 13 | - name: og:description 14 | content: Tutorials and guides for Vue.js development 15 | - name: twitter:card 16 | content: summary 17 | - name: twitter:title 18 | content: Tutorials 19 | - name: twitter:description 20 | content: Tutorials and guides for Vue.js development 21 | - name: twitter:image:src 22 | content: https://awesome-vue.js.org/hero.png 23 | --- 24 | 25 | # Tutorials 26 | 27 | - [Vue.js screencasts](https://laracasts.com/series/learn-vue-2-step-by-step) on Laracasts 28 | - [Learn Vue 3: Step by Step](https://laracasts.com/series/learn-vue-3-step-by-step) on Laracasts 29 | - [Vuejs 2 Authentication Tutorial](https://auth0.com/blog/vuejs2-authentication-tutorial/) on Auth0 blog 30 | - [Create a GitHub File Explorer Using Vue.js](https://scotch.io/tutorials/create-a-github-file-explorer-using-vue-js) on Scotch.io 31 | - [Vue.js Tutorial](https://vegibit.com/vue-js-tutorial/) on Vegibit 32 | - [Vuex introduction video - James Browne from London Vue.js Meetup #1](https://www.youtube.com/watch?v=l1KHL-TX3qs) 33 | - [Hybrid App Example with Laravel and Vue.js in Portuguese](https://www.youtube.com/watch?v=TGSJjDahlrQ) by @vedovelli 34 | - [Vue.js Introduction Turkish Language](https://oguzhan.in/vue-js-ile-uygulama-gelistirme/) on oguzhan.in 35 | - [Vue.js VideoTutoral Series in Spanish (3-8-2016)](https://www.youtube.com/watch?v=IlFk3cyRB0Y&list=PLM-Y_YQmMEqD2EWfWpSbiV3WgShRRW3FE&index=7) on YouTube by Juan Andrés Núñez 36 | - [Vue.js Screencast Series in Spanish](https://styde.net/curso-de-vue-js/) on Styde.net 37 | - [讲解Vue.js 官网 中文-含代码、百度云、youtube](https://github.com/bhnddowinf/vuejs-learn) on bhnddowinf 38 | - [Exploring Real Time Apps with VueJS, ES2015 and Webpack](https://blog.pusher.com/exploring-real-time-apps-with-vuejs-es2016-and-webpack/) on Pusher 39 | - [Vue.js in Bahasa Indonesia](https://www.sekolahkoding.com/track/belajar-vue-js) on sekolahkoding.com 40 | - [Vue.js from Scratch Series in Russian](https://www.youtube.com/playlist?list=PL5r0NkdgM0UOxb4Hl81FV5UIgexwTf8h7) on YouTube by .dev 41 | - [Створення сервісу для зберігання файлів з Flask, RethinkDB та Vue.js, ч. 1](https://codeguida.com/post/526/) Ukraine 42 | - [VueJS 2 French tutorial](https://www.youtube.com/playlist?list=PLjwdMgw5TTLW-mAtlR46VajrKs4dep3y0) Français par Grafikart 43 | - [Jayway Vue.js 2 workshop. Build an e-commerce site with vue-router, vuex and vue-resource](https://github.com/jayway/vue-js-workshop) 44 | - [How to Create Great VueJS Applications Using Wijmo Controls](https://wijmo.com/blog/how-to-create-great-vuejs-applications-using-wijmo-controls/) 45 | - [讲解Vue.js 2 官网 中文-含代码、百度云、youtube](https://github.com/bhnddowinf/vuejs2-learn) on bhnddowinf 46 | - [Medium like Image Loading with Vue.js](https://www.theodo.fr/blog/2016/10/medium-like-image-loading-with-vue-js/) 47 | - [How to Use Vuex in a Laravel Spark Project](https://metricloop.com/blog/how-to-use-vuex-in-a-laravel-spark-project) on `Metric Loop` 48 | - [How To Set Up Modules in Vuex](https://metricloop.com/blog/how-to-set-up-modules-in-vuex) on `Metric Loop` 49 | - [Up and Running with the Vue.js 2.0 Framework](https://www.sitepoint.com/up-and-running-vue-js-2-0/) on SitePoint 50 | - [How to make API Calls with Vuex](https://metricloop.com/blog/how-to-make-api-calls-with-vuex) on `Metric Loop` 51 | - [How to Use Vuex to Build a Feature](https://metricloop.com/blog/how-to-use-vuex-to-build-a-feature) on `Metric Loop` 52 | - [Vue.js 2.0 Fundamentals](https://www.youtube.com/playlist?list=PLwAKR305CRO_1yAao-8aZiQnBqJeyng4O) on YouTube by DevMarketer 53 | - [Vuex For The Clueless — The Missing Primer On Vue’s Application Data Store](https://medium.com/js-dojo/vuex-for-the-clueless-the-missing-primer-on-vues-application-data-store-33fa51ffc3af#.2j25xpfui) 54 | - [Real-time Grid Component Laravel, Vue.js, Vuex & Socket.io](https://www.youtube.com/watch?v=Jxefsv5Zqkw&t=3s) 55 | - [VueJS 2 - The Complete Guide (incl. Vuex) - Udemy Tutorial](https://www.udemy.com/vuejs-2-the-complete-guide) 56 | - [Develop Web Apps with Vue.js](https://egghead.io/courses/develop-web-apps-with-vue-js) on [egghead.io](https://egghead.io/) 57 | - [Vue.js 2 - Getting Started](https://www.youtube.com/playlist?list=PL55RiY5tL51p-YU-Uw90qQH419BM4Iz07) 58 | - [Vue.js 2 & Vuex (Basics)](https://www.youtube.com/playlist?list=PL55RiY5tL51pT0DNJraU93FhMzhXxtDAo) 59 | - [Türkçe VueJS Eğitim Videoları](https://www.youtube.com/playlist?list=PLa3NvhdFWNipwk1KXeUpVQnAiAfuBw4El) on YouTube by [Fatih Acet](https://fatihacet.com) 60 | - [Let's Vue! - OpenLecture 2017.01 in Russian](https://youtu.be/7pmw5gvWAf8) on YouTube by Illya Klymov ([@xanf](https://github.com/xanf/)) 61 | - [Bootstrapping your first Vue.js application using vue-cli](https://afropolymath.svbtle.com/bootstrapping-your-first-vue-js-project/) by [@afropolymath](https://twitter.com/afropolymath) 62 | - [Build vue-hackernews-2.0 from Scratch](https://github.com/Detachment/Build-vue-hackernews-2.0-from-scratch) by [@ Detachment](https://github.com/Detachment) 63 | - [Role Based Authorization for your Vue.js and Nuxt.js Applications Using vue-kindergarten](https://medium.com/@JiriChara/role-based-authorization-for-your-vue-js-and-nuxt-js-applications-using-vue-kindergarten-fd483e013ec5#.kp81np177) 64 | - [Complete Vue.js Application Tutorial - Creating a Simple Budgeting App with Vue](https://matthiashager.com/complete-vuejs-application-tutorial) by [@matthiaswh](https://github.com/matthiaswh) 65 | - [Vue.js Tutorial: A Prerendered, SEO-Friendly Example](https://snipcart.com/blog/vuejs-tutorial-seo-example) 66 | - [Vue.js Introduction For People Who Know Just Enough jQuery To Get By](https://medium.com/@mattrothenberg/vue-js-introduction-for-people-who-know-just-enough-jquery-to-get-by-eab5aa193d77) 67 | - [Fetching Data from a Third-Party API with Vue.js and Axios](https://www.sitepoint.com/fetching-data-third-party-api-vue-axios/) 68 | - [Fun Projects with Vue 2 (Video)](https://www.packtpub.com/web-development/fun-projects-vue-2-video) by Peter van Meijgaard, Packt. (April 2017) 69 | - [Vue JS: Simultaneously Running Express and Webpack Dev Server](https://medium.com/dailyjs/vue-js-simultaneously-running-express-and-webpack-dev-server-292f4a7ed7a3) on Medium by Henrik Fogelberg 70 | - [Vue JS 2 Tutorials](https://www.youtube.com/playlist?list=PL4cUxeGkcC9gQcYgjhBoeQH7wiAyZNrYa) on Youtube by [The Net Ninja](https://www.thenetninja.co.uk) 71 | - [Add a headless CMS to VueJs in 5 Minutes](https://www.storyblok.com/tp/add-a-headless-CMS-to-vuejs-in-5-minutes) 72 | - [vue 架构中的 Watcher](https://github.com/dengwanc/dengwanc.github.io/issues/11) 73 | - [Building Your First App With Vue.js](https://tutorialzine.com/2016/08/building-your-first-app-with-vue-js/) 74 | - [5 Practical Examples For Learning Vue.js](https://tutorialzine.com/2016/03/5-practical-examples-for-learning-vue-js/) 75 | - [Migrating from KnockoutJS to VueJS](https://jes.al/2017/05/migrating-from-knockoutjs-to-vuejs/) 76 | - [Create a quiz with Vue.js](https://medium.com/@rap2h/create-a-quiz-with-vue-js-ed1e8e0e8294) by [@rap2h](https://twitter.com/rap2h) 77 | - [Vue.js 2 & Firebase - Building Real Time Single Page Web Applications](https://www.youtube.com/watch?v=we4zuQIXmnw) 78 | - [Vue.js 2 & Vue-Resource - Real-World Application With External API Access](https://www.youtube.com/watch?v=p-7Zi9xYt2M) 79 | - [Interactive Vue.js Screencasts For Beginners](https://scrimba.com/playlist/playlist-38) 80 | - [Vue.JS ile NASA API'ını Kullanarak Veri Çekme](https://www.youtube.com/watch?v=uC5b2VDATDU) on YouTube 81 | - [Web development with Vue.js 2 (Video)](https://www.packtpub.com/web-development/web-development-vuejs-2-video) by Olga Filipova, Packt. (June 2017) 82 | - [Build a realtime chart with VueJS and Pusher](https://blog.pusher.com/build-realtime-chart-with-vuejs-pusher/) 83 | - [Intro to Vue, repo for Frontend Masters Course](https://github.com/sdras/intro-to-vue) 84 | - [Vue Guide on CSS-Tricks](https://css-tricks.com/guides/vue/) 85 | - [Using Typescript in your VueJS app](https://medium.com/coding-blocks/using-typescript-in-your-vue-app-c4aba0bbc8bc) 86 | - [Vue.js 预览](https://ninghao.net/course/4256) on ninghao.net 87 | - [Building a Vue v2 JS app using Vue-router](https://www.liquidlight.co.uk/blog/article/building-a-vue-v2-js-app-using-vue-router/) 88 | - [Build your own carousel with Vue](https://medium.com/@davidatomhernandez/how-to-a-simple-carousel-with-vue-138715d615d7) by [@Atom_Hernandez](https://twitter.com/Atom_Hernandez) 89 | - [Unit Testing Vue.js Components with the Official Vue Testing Tools and Jest](https://alexjoverm.github.io/series/Unit-Testing-Vue-js-Components-with-the-Official-Vue-Testing-Tools-and-Jest/) by [@alexjoverm](https://twitter.com/alexjoverm) 90 | - [Creating Vue.js Transitions & Animation: Live Examples](https://snipcart.com/blog/vuejs-transitions-animations) by [@udyuxdev](https://twitter.com/UdyUXDev) 91 | - [Creating Custom Vue.js Plugins](https://alligator.io/vuejs/creating-custom-plugins/) 92 | - [Async in VueJS part 1](https://medium.com/js-dojo/async-in-vue-js-part-1-28d96f751a2e) 93 | - [Async in VueJS part 2](https://medium.com/js-dojo/async-in-vuejs-part-2-45e81c836e38) 94 | - [Using localStorage with Vuex store without a plugin](https://www.mikestreety.co.uk/blog/vue-js-using-localstorage-with-the-vuex-store) 95 | - [Using props for accessing URL parameters within components with Vue Router](https://www.youtube.com/watch?v=ESg0k2zdME4) 96 | - [Deploy Vue.js — SSR(Vuetify) on Production with Pm2 and Nginx](https://medium.com/@kamerk22/deploy-vue-js-ssr-vuetify-on-production-with-pm2-and-nginx-ec7b5c0748a3) 97 | - [Testing Vue Components](https://laracasts.com/series/testing-vue) on [laracast](https://laracasts.com/series/testing-vue) 98 | - [Building a Full Stack Web App with Vue.js and Express.js](https://www.youtube.com/watch?v=Fa4cRMaTDUI&t=) by [@CodyLSeibert](https://twitter.com/CodyLSeibert) 99 | - [Vue.js 2 Recipes (Video)](https://www.packtpub.com/application-development/vuejs-2-recipes-video) by Peter van Meijgaard, Packt. (September 2017) 100 | - [Getting Started with Vue.js](https://sabe.io/tutorials/getting-started-with-vue-js) 101 | - [Building Your First Advanced CRUD Application with Vue 2 (Video)](https://www.packtpub.com/web-development/building-your-first-advanced-crud-application-vue-2-video) by Peter van Meijgaard, Packt. (July 2017) 102 | - [프론트엔드 개발자를 위한 Vue.js 입문서](https://joshua1988.github.io/web-development/vuejs/vuejs-tutorial-for-beginner/) 103 | - [누구나 다루기 쉬운 Vue.js (Video)](https://www.inflearn.com/course/vue-pwa-vue-js-%EA%B8%B0%EB%B3%B8/) on [Inflearn](https://www.inflearn.com/) by [Captain Pangyo](https://joshua1988.github.io/) 104 | - [Build a Vue.js Blog in 2 hours tops](https://snipcart.com/blog/vuejs-blog-demo#tutorial) on [Snipcart](https://snipcart.com/) 105 | - [Getting Started with VueJS 2](https://www.udemy.com/getting-started-with-vue-js) by Sachin Bhatnagar [@sachinbee](https://www.twitter.com/sachinbee) on [Udemy](https://udemy.com/) 106 | - [Getting Started with Vuex: Managing State in Vue.js](https://sabe.io/tutorials/getting-started-with-vuex) 107 | - [Vue2 ACL using CASL](https://medium.com/@sergiy.stotskiy/vue-acl-with-casl-781a374b987a) by Sergii Stotskyi 108 | - [Vuejs 2.5+ Authentication Tutorial using Auth0](https://www.storyblok.com/tp/how-to-auth0-vuejs-authentication) on Storyblok blog 109 | - [GraphCMS introduction guide with Vue](https://graphcms.com/docs/introduction/) on GraphCMS 110 | - [Vue.js debugging in Chrome and VS Code](https://github.com/Microsoft/vscode-recipes/tree/master/vuejs-cli) This recipe shows how to use the Debugger for Chrome extension with VS Code to debug Vue.js applications generated by the Vue CLI. 111 | - [Getting Started with Vue JS 2 (Video)](https://www.packtpub.com/web-development/getting-started-vue-js-2-video) by Sachin Bhatnagar, Packt. (January 2018) 112 | - [Building a movie app interface with Vue.js](https://hackernoon.com/building-a-movie-app-interface-with-vue-js-cdc8aeb5db0b) 113 | - [Let’s Build a Custom Vue.js Router](https://hackernoon.com/lets-build-a-custom-vue-js-router-7de634be87c4) 114 | - [Build a Vue.Js E-Commerce App with ButterCMS Headless Backend](https://snipcart.com/blog/vuejs-ecommerce-headless-buttercms) 115 | - [Build a voting application with Go and Vue.js](https://pusher.com/tutorials/voting-app-go-vuejs) 116 | - [Build a collaborative painting app using Vue.js](https://pusher.com/tutorials/collaborative-painting-vuejs) 117 | - [Build a realtime payment dashboard with Stripe](https://pusher.com/tutorials/realtime-payment-dashboard-stripe) 118 | - [Build a cryptocurrency tracker using Vue.js](https://pusher.com/tutorials/cryptocurrency-tracker-vue) 119 | - [Build a design feedback app using Vue.js](https://pusher.com/tutorials/design-feedback-vuejs) 120 | - [Developing a Single Page App with Flask and Vue.js](https://testdriven.io/developing-a-single-page-app-with-flask-and-vuejs) 121 | - [Accepting Payments with Stripe, Vue.js, and Flask](https://testdriven.io/accepting-payments-with-stripe-vuejs-and-flask) 122 | - [API Driven Development With Laravel and VueJS (Free Course)](https://serversideup.net/courses/api-driven-development-laravel-vuejs/) on serversideup.net 123 | - [Managing State in Vue.js](https://medium.com/fullstackio/managing-state-in-vue-js-23a0352b1c87) 124 | - [Real World Projects with Vue.js](https://www.packtpub.com/web-development/real-world-projects-vuejs-video) by Daniel Khalil, Packt. (August 2018) 125 | - [Heartbeat (Vue + NW.js Desktop app Video series)](https://goo.gl/8p3msR) by Axel Martínez (2017 - 2020) 126 | - [Firebase Server-Side Render Vue Apps with Nuxt.js (Server-side Rendering with JavaScript Frameworks)](https://www.youtube.com/watch?v=ZYUWsjUxxUQ) 127 | - [Firebase Measuring Vue SSR Performance with Nuxt.js (Server-side Rendering with JavaScript Frameworks)](https://www.youtube.com/watch?v=Y5XX2lruhxs) 128 | - [Creating an interactive map with D3 and Vue](https://dev.to/denisinvader/creating-an-interactive-map-with-d3-and-vue-4158) (October 2018) 129 | - [The guide to write universal, SSR-ready Vue components](https://blog.lichter.io/posts/the-guide-to-write-universal-ssr-ready-vue-compon) 130 | - [Vue.js Fundamentals](https://vueschool.io/courses/vuejs-fundamentals) 131 | - [Vuex for Everyone](https://vueschool.io/courses/vuex-for-everyone) 132 | - [Vue.js Form Validation](https://vueschool.io/courses/vuejs-form-validation) 133 | - [The Vue.js Master Class](https://vueschool.io/courses/the-vuejs-master-class) 134 | - [Vue.js Firebase Realtime Database](https://vueschool.io/courses/vuejs-firebase-realtime-database) 135 | - [Vue.js Firebase Authentication](https://vueschool.io/courses/vuejs-firebase-authentication) 136 | - [Dynamic Forms with Vue.js](https://vueschool.io/courses/dynamic-forms-vuejs) 137 | - [Custom Vue.js Directives](https://vueschool.io/courses/custom-vuejs-directives) 138 | - [Vue.js Application Development Essentials](https://www.packtpub.com/application-development/vuejs-application-development-essentials-video) by Bartłomiej Potaczek, Packt. (October 2018) 139 | - [Troubleshooting Vue.js](https://www.packtpub.com/application-development/troubleshooting-vuejs-video) by Christian Hur, Packt. (October 2018) 140 | - [Nuxt.js - Vue.js on Steroids](https://www.packtpub.com/application-development/nuxtjs-vuejs-steroids-video) by Maximilian Schwarzmüller, Packt. (October 2018) 141 | - [Building an Electron File Explorer with Quasar (and Vue)](https://medium.com/quasar-framework/building-an-electron-file-explorer-with-quasar-and-vue-7bf94f1bbf6) by [@hawkeye64](https://github.com/hawkeye64). (November 2018) 142 | - [Build Web Apps with Vue JS 2 & Firebase](https://www.udemy.com/build-web-apps-with-vuejs-firebase/learn/v4/overview) on `Udemy` by [the Net Ninja](https://www.thenetninja.co.uk/) 143 | - [Vue JS 2 - The Complete Guide (incl. Vue Router & Vuex)](https://www.udemy.com/vuejs-2-the-complete-guide/learn/v4/overview) on `Udemy` by Maximilian Schwarzmüller 144 | - [SPA Application using Vue.js, Vuex, Vuetify, and Firebase (Part 1)](https://www.jenniferbland.com/spa-application-using-vue-js-vuex-vuetify-and-firebase-part-1/) (November 2018) 145 | - [SPA Application using Vue.js, Vuex, Vuetify, and Firebase (Part 2)](https://www.jenniferbland.com/spa-application-using-vue-js-vuex-vuetify-and-firebase-part-2/) (November 2018) 146 | - [SPA Application using Vue.js, Vuex, Vuetify, and Firebase (Part 3)](https://www.jenniferbland.com/spa-application-using-vue-js-vuex-vuetify-and-firebase-part-3/) (November 2018) 147 | - [SPA Application using Vue.js, Vuex, Vuetify, and Firebase (Part 4)](https://www.jenniferbland.com/spa-application-using-vue-js-vuex-vuetify-and-firebase-part-4/) (November 2018) 148 | - [Adding Internationalization to a Vue Application](https://www.jenniferbland.com/adding-internationalization-to-a-vue-application/) (November 2018) 149 | - [Practical Projects with Vue JS 2](https://www.packtpub.com/web-development/practical-projects-vue-js-2-video) by Jack Herrington, Packt. (December 2018) 150 | - [Vue.js 기초 다지기 (Video)](https://lessipe.com/course/15) by [Lessipe](https://lessipe.com/) 151 | - [Full Stack Web Development with Vue.js and Node.js](https://www.packtpub.com/web-development/full-stack-web-development-vuejs-and-nodejs-video) by Haider Rehman, Packt. (January 2019) 152 | - [Vue for Designers](https://designcode.io/vue) by Design+Code (February 2019) 153 | - [Vue and GraphQL with Hasura video course](https://dev.to/hasurahq/vue-and-graphql-with-hasura-video-course-3mpp) 154 | - [Vue Introduction in Turkish](https://www.onbirkod.com/vue-js-giris-1/) 155 | - [Data pulling using Vue-Resource in Turkish](https://www.onbirkod.com/vue-js-2-vue-resource/) 156 | - [Spa Application using Vue-router in Turkish](https://www.onbirkod.com/vue-js-3-vue-router-ile-bir-spa-uygulamasi/) 157 | - [Create Vue Projects using Vue-cli in Turkish](https://www.onbirkod.com/vue-js-4-vue-cli-ile-hazir-gelen-proje-sablonlari/) 158 | - [Messaging between Vue components and Vuex in Turkish](https://www.onbirkod.com/vue-js-5-bilesenlerin-birbiriyle-haberlesmesi-ve-vuex/) 159 | - [How to Dynamically Add a Class Name in Vue](https://michaelnthiessen.com/dynamically-add-class-name/) by Michael Thiessen 160 | - [Build a Library web application with Vue JS, Node JS, and SQL or MongoDB using ScaffoldHub](https://www.youtube.com/watch?v=FdC4Mjljd3k) By Felipe Lima [@scaffoldhub_io](https://twitter.com/scaffoldhub_io) 161 | - [Building a Realtime Location tracking app with NativeScript + Vue](https://medium.com/saibbyweb/building-a-real-time-location-tracking-app-with-nativescript-vue-under-350-lines-of-code-8b51ad40d657) by Saibbyweb 162 | - [Vue: Getting Started, by John Papa](https://www.pluralsight.com/courses/vue-getting-started) on [Pluralsight](https://www.pluralsight.com) 163 | - [Building a Simple Pre-Rendered Web App Using Vue + Nuxt](https://mtlynch.io/simple-vue-pre-rendered/) by Michael Lynch 164 | - [Vue and GraphQL with Hasura video course](https://dev.to/hasurahq/vue-and-graphql-with-hasura-video-course-3mpp) 165 | - [Frontend and Fullstack VENM-stack coding tutorials by RabbitWerks JavaScript](https://www.youtube.com/c/rabbitwerksjavascript) 166 | - [Nordschool Vue Tutorials](https://nordschool.com/tag/vue) 167 | - [Vue Props Validation - Best Practices](https://nordschool.com/vue-props/) 168 | - [Vue Router - The Complete Guide](https://nordschool.com/vue-router/) 169 | - [Enable VS Code Debugger for Nuxt & Typescript](https://nordschool.com/enable-vs-code-debugger-for-nuxt-and-typescript/) 170 | - [Create A Blog With Gridsome & Vue](https://nordschool.com/create-a-blog-with-gridsome-and-vue/) 171 | - [Building an Imgur Clone with Vue.js and Serverless](https://tutorialedge.net/projects/building-imgur-clone-vuejs-nodejs/) 172 | - [Building a HackerNews clone in Vue.js on AWS](https://tutorialedge.net/projects/hacker-news-clone-vuejs/) 173 | - [Vue.js: Build a Full Stack App with Firebase, Vuex and Router \[Video\]](https://www.packtpub.com/programming/vue-js-build-a-full-stack-app-with-firebase-vuex-and-router-video?utm_source=awesome-vue.js.org&utm_medium=referral&utm_campaign=OutreachV15745) by Chris Dixon (October 2019) 174 | - [Vue.js 2 Academy: Learn Vue Step by Step \[Video\]](https://www.packtpub.com/web-development/vue-js-2-academy-learn-vue-step-by-step-video?utm_source=awesome-vue.js.org&utm_medium=referral&utm_campaign=OutreachV15754) by Chris Dixon (October 2019) 175 | - [Blazing-Fast Vue and GraphQL with Gridsome \[Video\]](https://www.packtpub.com/in/web-development/blazing-fast-vue-and-graphql-with-gridsome-video?utm_source=awesome-vue.js.org&utm_medium=refferal&utm_campaign=OutreachV15688) by Reed Barger, Packt 176 | - [Build Your First Vue.js App in About 30 Minutes](https://raddevon.com/articles/build-your-first-vue-js-app/) by Rad Devon (Video, February 2020) 177 | - [How to make your components dynamic in Vue JS](https://blog.logrocket.com/how-to-make-your-components-dynamic-in-vue-js/) (September 2019) 178 | - [Fragments in Vue JS](https://blog.logrocket.com/fragments-in-vue-js/) (December 2019) 179 | - [Build a movie search app using the Vue Composition API](https://dev.to/blacksonic/build-a-movie-search-app-using-the-vue-composition-api-5218) 180 | - [Vue Testing Crash Course](https://dev.to/blacksonic/vue-testing-crash-course-59kl) 181 | - [Sharing and re-using Vue Mixins in the cloud with Bit.dev](https://blog.bitsrc.io/sharing-and-reusing-vue-mixins-in-the-cloud-with-bit-dev-830104a48d0b) (May 2019) 182 | - [Using Watchers in Vue JS](https://blog.bitsrc.io/introducing-watchers-in-vue-js-d3efd4f4e726) (June 2019) 183 | - [Understanding Filters in Vue JS](https://blog.bitsrc.io/understanding-filters-in-vue-js-7a53b1521dce) (June 2019) 184 | - [Form Validation In VueJS Using Yup](https://vijitail.dev/blog/form-validation-in-vue-using-yup) by [Vijit Ail](https://vijitail.dev/) (May 2020) 185 | - [Use Vue.js to Rewrite React's Official Tutorial Tic Tac Toe](https://chanvinxiao.com/blog/vuejs-tic-tac-toe/) by [Chanvin Xiao](https://github.com/vinzid) 186 | - [Can we use Python with Vue.js or Vue and Django or Flask?](https://vue-view.com/can-we-use-python-with-vue-js-or-vue-and-django-or-flask/) 187 | - [MDN - Vue tutorials](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks#Vue_tutorials) 188 | - [Learn Vue 3 for Beginners - Full 2020 Tutorial Course](https://www.youtube.com/watch?v=ZqgiuPt5QZo&ab_channel=TheEarthisSquare) on YouTube 189 | - [Vue 3 Composition Api Introduction - Full Tutorial](https://www.youtube.com/watch?v=bwItFdPt-6M) 190 | - [Building a VueJS chat app with realtime storage of messages in Airtable](https://ably.com/blog/airtable-database-realtime-messages) by Srushtika Neelakantam (December 2020) 191 | - [Building a realtime quiz with VueJS using a starter kit](https://github.com/ably-labs/realtime-quiz-framework/blob/main/TUTORIAL.md) by Srushtika Neelakantam (October 2020) 192 | - [Make an Heart clicker with vue.js and firebase](https://dev.to/venatus/tutorial-make-an-heart-clicker-with-vue-js-and-firebase-3npe) 193 | - [Building an E-Commerce app with Vue.js, Vuex & Axios](https://codesource.io/building-an-e-commerce-app-with-vue-js-vuex-axios/) by Deven Rathore ( November 2020) 194 | - [Vue.js Debugging: A Guide to Fixing Your Frontend](https://snipcart.com/blog/vuejs-debugging) - Learn the basics of Vue.js debugging. This guide will walk you through a tutorial on how to fix your application's frontend 195 | - [Deploy a Vue App to Firebase Hosting in four easy steps](https://www.youtube.com/watch?v=LF4dLOEUdJk&list=LL&index=8) 196 | - [Node js Express js Firebase with Firestore -| Full Crud Restful Services](https://www.youtube.com/watch?v=Ld4OGwpQ2Yk&list=LL&index=11) 197 | - [Vue 3 with Electron - Building a desktop applications with Vue and Electron](https://www.youtube.com/watch?v=LnRCX074VfA&list=LL&index=4&t=104s) 198 | - [Build a Music app using VueJS](https://www.youtube.com/watch?v=BPyniDJ5QOQ&list=LL&index=6) 199 | - [Learn Vuex in 15 minutes - Program With Erik](https://www.youtube.com/watch?v=oxUyIzDbZts&list=LL&index=2) 200 | - [Help you learn more efficiently vue3 source code - mini-vue](https://github.com/cuixiaorui/mini-vue) by cuixiaorui 201 | - [6 Hour Vue.js & Firebase Project - FireBlogs](https://youtu.be/ISv22NNL-aE) 202 | - [Build a Covid Tracker App With Vue.js & Tailwind](https://youtu.be/m-MAIpnH9ag) 203 | - [Build a Shopping Cart with Vue 3, Vue Router, & VueX](https://youtu.be/oWt4jYThJCo) 204 | - [Creating Your First Vue 3 App with Vite - A Beginner's Tutorial](https://youtu.be/JLt3GrDZDvQ) 205 | - [Vue Authentication Full Course | Login, Logout, Forgot and Reset Password](https://youtu.be/uqpM7WVTKI4) 206 | - [EASY Vue 3 Authentication with Firebase ~ Login Form Vue JS Tutorial](https://youtu.be/FMPHvxqDrVk) 207 | - [EASY Vue 3 POPUP Component ~ Button & Timed Triggers](https://youtu.be/HorXomQrOi8) 208 | - [Build an ANIME Search Database in Vue 3 ~ Jikan Anime API for beginners](https://youtu.be/AI5lsNeVyO8) 209 | - [Build a Twitter UI Clone with Vue JS & TailwindCSS ~ Home Page](https://youtu.be/eue3jbwxQS0) 210 | - [Build a Movie App With Vue JS - A Vue 3 Beginners tutorial](https://youtu.be/UHewcsv6uJY) 211 | - [Simple Quiz App using Vue 3 and Tailwind CSS](https://youtu.be/I29WbGeZrBs) 212 | - [Learn Vue.js 3.0 With Tailwind CSS And Composition API in 2021 - Create A Pokémon app For Beginners](https://youtu.be/ISv22NNL-aE) 213 | - [Vue.js SPA: Build a Powerful E-Commerce App](https://snipcart.com/blog/building-a-vuejs-spa) 214 | - [Learning Vue 3.0](https://github.com/chengpeiquan/learning-vue3) 215 | - [Vue 3.0 and decentralized app (dApp)](https://github.com/hypescale/moralis-vue-boilerplate) 216 | - [Vuejs Authentication Tutorial](https://www.loginradius.com/blog/async/implementing-authentication-on-vuejs-using-jwt/) on LoginRadius blog 217 | - [Add a prebuilt video chat widget to any Vue app with daily-js](https://www.daily.co/blog/build-a-video-chat-app-with-vue-and-daily-prebuilt/) by Jess Mitchell, via Daily (August 2021) 218 | - [Build a custom video chat app with daily-js and Vue](https://www.daily.co/blog/custom-video-chat-app-with-daily-and-vue/) by Jess Mitchell, via Daily (November 2021) 219 | - [Vue Pwa: Build a Progressive Web Application With Nuxt](https://snipcart.com/blog/vue-pwa-development) on Snipcart 220 | - [Meteor + Vue](https://www.youtube.com/playlist?list=PLmJs3lfUmCdS8W27OoWj3uGDP6g4ypNyw) - YouTube playlist by Axel Martínez 221 | - [Introduction to Vue (Spanish)](https://scrimba.com/playlist/pDzVxUd) - Scrimba mini-course in Spanish 222 | - [Intro to Vue 3](https://www.vuemastery.com/courses/intro-to-vue-3/intro-to-vue3) - Free course on Vue 3 with intuitive explanations from Vue Mastery 223 | - [Developing a web application with Vue.js 3 and Vite.js (French)](https://mickael-baron.fr/web/vuejs-miseenoeuvre-part2) par Mickael Baron 224 | - [Deploying a web application powered by Vue.js 3 with Docker (French)](https://mickael-baron.fr/web/vuejs-deploiement-part3) par Mickael Baron 225 | - [Advantages of Vue.js over React, Angular, and other frameworks in Turkish](https://medium.com/@dev.isasari/vuejsin-react-ve-angular-a-g%C3%B6re-avantajlar%C4%B1-6fe1d653beb1) by İsa Sarı 226 | --------------------------------------------------------------------------------