Details
Getting started with Vue
Vue starter (TypeScript) Official Vite template
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.
<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>
Popular projects on StackBlitz
| 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