Vue.js

Vue.js, initially released in 2014, was created by Evan You, who drew inspiration from Angular's declarative templates and React's component-based architecture. Vue.js aimed to combine the best of both worlds while offering a simpler and more approachable API.


Details

  • Website vuejs.org
  • npm package vue
  • Weekly downloads 4.3M
  • GitHub stars 44.8k
  • Related technologies vitenuxtvitepress

Getting started with Vue

Vue starter (TypeScript) Official Vite template Try on

Start a Vue project in a terminal

npm create vue@latest

About Vue.js

Since its inception, Vue.js has gained significant popularity among developers due to its ease of learning and flexible ecosystem and it continues to be one of the most popular JavaScript frameworks.

Vue.js has a large and active community, and many well-known companies, such as Alibaba, GitLab, and Nintendo, have adopted it for their web development projects. It also has a thriving ecosystem with several popular frameworks built on top of it, extending its capabilities and providing additional features for specific use cases. Two notable examples of such tools are Nuxt.js, a universal, full-stack framework, and VitePress, a static site generator for building documentation sites.

A sample Vue counter component
<script setup lang="ts">
import { ref } from 'vue'

defineProps<{ msg: string }>()

const count = ref(0)
</script>

<template>
  <button type="button" @click="count++">count is {{ count }}</button>
</template>

<style scoped>
button {
  border: solid 2px #42b883;
}
</style>
Project title Description
x-satori create HMR server and script demo Use Vue files to generate SVG images by Satori. The image can be generated by running ESM script or CLI.
vite-plugin-vue-inspector demo Clicking any element in your Vue app to open the relevant file (and line!) in the editor 😍
Vue Transitions Next generation frontend tooling. It's fast!
nextTick 101
primevue dialog + shadcn Shadcn/Radix skin with Tailwind for PrimeVue Dialog.
defineModel
Reactive Todo List with API call
Moonbow Moonbow example
@astrojs/mdx Mixed frameworks in a single .mdx file using Astro's runtime
Vue 3 drag and drop with function refs

Great repositories to play with