Vue
An approachable component framework with built-in reactivity.
CurrentintermediateGuide only -- no course yet
Overview
Vue is a component-based framework similar in goals to React, but with a more batteries-included approach (built-in state reactivity, templating syntax closer to HTML) that many developers find gentler to start with.
- What it is
- A progressive JavaScript framework for building UIs from reactive, reusable components.
- Why it's used
- For its approachable learning curve, clear separation of template/script/style, and strong built-in tooling.
- Where it fits
- An alternative to React for new frontend projects, especially where a team values Vue's more structured, HTML-like template syntax.
Core concepts
- Single-file components (.vue)
- Reactive data (ref/reactive)
- Template directives (v-if, v-for)
- Computed properties
Example
ref() creates a reactive value; the template automatically re-renders whenever count changes -- Vue's reactivity system tracks the dependency for you.
const { createApp, ref } = Vue;
createApp({
setup() {
const count = ref(0);
return { count };
},
}).mount("#app");
// template: <button @click="count++">{{ count }}</button>Common use cases
- Single-page applications
- Progressively enhancing an existing server-rendered page
Project ideas
- A small reactive form with live validation feedback