Vue.js

Vue 3 is release at 2020-09-18, default at 2022-02-07

Vue is a web framework that is as if you rewrote AngularJS 1, kept the good parts (remember those?), and integrated what we learned from React.

Nate Murray (Fullstack React)

Vue.js - The Progressive JavaScript Framework | Vue.js
Introduction | Vue.js
vuejs/core: 🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

Vue.js: The Documentary - YouTube
What to Expect from Vue in 2023 and How it Differs from React - The New Stack
Design Principles of Vue 3.0 by Evan You - YouTube
The New Vue by Evan You - YouTube

<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<!-- version lock -->
<script src="https://cdn.jsdelivr.net/npm/vue@3/dist/vue.min.js"></script>

v-bind:attribute="expression" :attribute="expression"
v-on:eventName="expression" @eventName="expression"

Examples - vue.js
Vue.js Examples

OverVue
OverVue 5.0: Get Started With Vue 3 — FAST | by Ross Lamerson | Jan, 2022 | JavaScript in Plain English

#184: Discussing Vue.js and Personal Projects With Evan You - The Changelog

Vue 3

Props typing with Vue 3 and TypeScript - Get Help - Vue Forum

Design Principles of Vue 3.0 by Evan You - YouTube
Vue 3 - What's New? What Changed? - YouTube
Learn Which Exciting Features Vue 3 Brings to The Table - Vue School Vue.js Tutorials
An Early Look at the Vue 3 Composition API in the Wild | CSS-Tricks
Reactivity: Vue 2 vs Vue 3 | Vue Mastery

An Introduction to Vue Teleport — A New Feature in Vue3 | by Matt Maribojoc | Sep, 2020 | Medium
Take your first steps with Vue.js - Training | Microsoft Learn

Vue 3 Migration Build: safely upgrade your app to Vue 3 (Pt. 1) | Vue Mastery
Vue 3 Migration Changes: Replace, Rename, and Remove (Pt. 2) | Vue Mastery
Why I Love Vue 3's Composition API - Michael Hoffmann (Mokkapps) - Senior Frontend Developer (Freelancer)
Cheatsheet vuemasteryx11

Starter Kit

nuxtjs
vite#Templates

vuejs/create-vue: 🛠️ The recommended way to start a Vite-powered Vue project

vue-cli

Webpack-based

npm install -g @vue/cli

Vue CLI 3
vuejs/vue-cli is a tool built by the Vue.js team to help build Vue applications rapidly. By running a single command, we can generate an entire Webpack-powered Vue application that has features like hot-reloading.

Configuration Reference | Vue CLI 3
How the new Vue CLI simplifies development - Pusher Blog

Introduction · vue-loader

Vitesse

Vitesse
antfu/vitesse: 🏕 Opinionated Vite + Vue Starter Template

Ecosystem

vuejs/awesome-vue: A curated list of awesome things related to Vue.js

Plugin

Plugins | Vite

Animations

Vue provides hooks for CSS/JavaScript animation
Enter/Leave & List Transitions — Vue.js

Animating VueJS with Sarah Drasner | Software Engineering Daily

sdras/animating-vue-workshop: Animated Interfaces with Vue.js Workshop Materials

Template

Vue Template Explorer

Using JSX with Vue - LogRocket Blog

Learn

The Vue Handbook
The Vue Handbook: a thorough introduction to Vue.js
The Vue.js Handbook

Vue Mastery | The best way to learn Vue.js
Intro to Vue 3 - Intro to Vue 3 | Vue Mastery

Up and Running with Vue.js - via @codeship | via @codeship
Vue.js: a (re)introduction
The Best Vue.js Tutorials and Screencasts
Develop Basic Web Apps with Vue.js from @GearUp3D on @eggheadio
Building a Simple Notes Manager with Vue.js - via @codeship | via @codeship
Fun with Vue: A Quick Overview
Replacing jQuery With Vue.js: No Build Step Necessary — Smashing Magazine
30 Days of Vue -- Fullstack.io
Accessing the virtual DOM using render functions in Vue JS - LogRocket Blog

How I Built Space Awesome with Vue.JS

sdras/intro-to-vue: Workshop Materials for my Introduction to Vue.js Workshop

Vue.js Tutorials - YouTube

Layout

Vue tricks: smart layouts for VueJS | by Manu Ustenko | Nov, 2020 | ITNEXT

Tips and Tricks

A Vue pattern for idiomatic, performant component registration you might not know about
7 Secret Patterns Vue Consultants Don’t Want You to Know - YouTube

Common mistakes to avoid while working with Vue.js
Update Array and Object in Vuejs – Milad Meidanshahi – Medium
Solving Common Vue Problems - Level Up Coding

Authentication Best Practices for Vue - Sqreen Blog

Vue.js App Performance Optimization: part 1 — Introduction to performance optimization and lazy…
Vue.js App Performance Optimization: part 2- Lazy loading routes and vendor bundle anti-pattern
Vue.js App Performance Optimization: part 3— Lazy loading Vuex modules

TypeScript

Why You Should Use TypeScript With Vue - Better Programming - Medium

State

Managing State in Vue.js | recallact.com

Pinia

for Vue 3 and beyond,

Pinia | The intuitive store for Vue.js

Vuex

for Vue 2

Vuex was Vue's official state management library, and it will feel familiar if you've ever used Redux. Vuex was built by the Vue.js team to provide a fluid and intuitive experience to integrate flux-like state management onto a Vue application.
Anyway, should I nest data or should I not in Vue JS?