With Vue.js making inroads into the market, it is up to you, as a developer, to stay up-to-date with the trends and learn how to get started with Vue.js to build modern web applications.
Vue.js is a flexible and powerful JavaScript library for building user interfaces. It’s also one of the fastest-growing libraries for building web applications.
If you’re new to Vue.js, this article contains a curated list of development resources to help you get started with Vue.js development and kick off your Vue.js projects in the right direction. The list includes resources that I’ve personally encountered and used during my Vue.js development projects, and on top of that, I’ve closely reviewed the other resources to ensure that they’re worth being on the list.
What Is Vue.js?
According to the official statement, Vue.js is an approachable, performant, and versatile framework for building web user interfaces.
Vue.js is built on top of standard HTML, CSS, and JavaScript with intuitive API and world-class documentation. It provides a rich, incrementally adoptable ecosystem that scales between a library and a full-featured framework.
Vue.js is one of the fastest-growing frameworks out there, and it continues to gain popularity among web developers. The framework allows you to develop single-page applications and promises significantly improved performance when rendering on the client side.
It’s simple, easy to learn, and beginner friendly, with many online resources available on the web. If you are coming from React, Angular, or any other frontend javascript framework, you will feel right at home with Vue.js.
Getting started:
- Vue.js 3 Guide (Official)
- Vue.js 2 Guide (Official)
- Vue.js 3 API (Official)
- Vue.js 2 API (Official)
- Vue 2 -> Vue 3 Migration Guide
- Official Forum
Official Resources:
- vuex: Centralized State Management for Vue.js.
- vue-router: The official router for Vue.js.
- vue-router-next: The Vue 3 official router
- vue-cli: Standard Tooling for Vue.js Development.
- vuepress: Minimalistic Vue-powered static site generator.
- eslint-plugin-vue: Official ESLint plugin for Vue.js.
- vue-loader: Webpack loader for Vue.js components.
- awesome-vue: A curated list of awesome things related to Vue.js.
- composition-api: A plugin that allows you to use Vue 3.0’s Composition API in Vue 2.x.
- jsx-next: Babel Plugin JSX for Vue 3.0.
- vitepress: Vite & Vue powered static site generator.
- vue-class-component: ES / TypeScript decorator for class-style Vue components.
- vue-devtools: Browser devtools extension for debugging Vue.js applications.
- Vetur: Vue tooling for VS Code.
- pinia: Intuitive, type safe, light and flexible Store for Vue using the composition api with DevTools support.
- create-vue: The recommended way to start a Vite-powered Vue project.
- petite-vue: An alternative distribution of Vue optimized for progressive enhancement. It provides the same template syntax and reactivity mental model as standard Vue.
- apollo: Apollo/GraphQL integration for VueJS.
- eslint-plugin-vue: Official ESLint plugin for Vue.js.
UI Components:
Animation
Vue.js components, plugins, and other related libraries for handling animations on your web applications.
Audio & Video
Vue.js components, plugins, and other related libraries for embedding & handling audios and videos on your web applications.
Carousel & Slider
Vue.js components, plugins, and other related libraries to create carousels, sliders, slideshows, and rotators on your web applications.
See also: Best Vue.js Carousel Components
Chart & Graph
Vue.js components, plugins, and other related libraries to create various types of charts and graphs on your web applications.
See also: Best Chart Libraries To Visualize Data In Vue.js App
Color
Vue.js components, plugins, and other related libraries for handling and manipulating colors on your web applications.
See also: Best Open-Source Color Picker Components For Vue.js
Date & Time
Vue.js components, plugins, and other related libraries for handling and manipulating dates & times on your web applications.
See also: Best Date Picker Components For Vue.js
Featured
Featured Vue.js components, plugins, and other related libraries for modern web development.
Form
Vue.js components, plugins, and other related libraries for handling, enhancing, and manipulating HTML forms on your web applications.
Framework
Latest free UI frameworks for Vue.
See also: Best Vue.js UI Component Libraries
Gallery
Vue.js components, plugins, and other related libraries to create galleries on your web applications.
See also: Best Vue.js Gallery Components
Image
Vue.js components, plugins, and other related libraries for handling and manipulating images on your web applications.
Layout
Latest free Vue.js layout components, plugins, and other related libraries for modern mobile & web applications.
Loading
Vue.js components, plugins, and other related libraries for handling and manipulating loading on your web applications.
Menu & Navigation
Latest free Vue.js Menu & Navigation components, plugins, and other related libraries for modern mobile & web applications.
See also: Best Vue.js Navigation Menu Components
Modal & Popup
Latest free modal window and dialog popup components for Vue.js apps.
Notification
Latest free notification components for Vue.js apps.
See also: Best Material Design Inspired Toast Components For Vue.js
Other
Other uncategorized Vue.js components, plugins, and other related libraries for modern web development.
Pagination
Latest free Vue.js pagination components, plugins, and other related libraries for modern mobile & web applications.
Scroll
Latest free Vue.js components, plugins, and other related libraries for handling scrolling events on your application.
Social Media
Latest free Vue.js social media components, plugins, and other related libraries to boost your app on social networks.
Table
Vue.js components, plugins, and other related libraries for handling and manipulating tables on your web applications.
Text
Vue.js components, plugins, and other related libraries for handling and manipulating text-based content on your web applications.
Tooltip
Latest free Vue.js tooltip components, plugins, and other related libraries for modern mobile & web applications.
UI
Latest free frameworks library for Vue.
See also: Best Vue.js UI Component Libraries
Frameworks:
- nuxt.js: Vue.js Meta Framework to create complex, fast & universal web applications quickly.
- quasar: Build responsive Single Page Apps, SSR Apps, PWAs, Hybrid Mobile Apps and Electron Apps, all using the same codebase!, powered with Vue.
Final Thoughts:
Whether you are just starting out with Vue.js or would like to get a more in-depth look into the framework, I hope this article has provided you with some resources you can use to better your future development of applications using Vue.js.
Looking to view & download featured Vue.js components? View This Section.