Vue.js

What is Vue.js?

Vue.js is a progressive JavaScript framework for building user interfaces, created by Evan You in 2014. It combines an approachable, HTML-based template syntax with a powerful reactivity system and a component model, letting you adopt as little or as much of it as a project needs — from a single interactive widget to a full single-page application.

Where is Vue.js Used?

Vue powers everything from single interactive widgets to full production applications. Here are the major application areas:

Real-World Examples

Here are some practical applications you can build using Vue.js:

Why Learn Vue.js?

Simple Vue Component Example

Here is a basic component that demonstrates several important Vue concepts:

<script setup>
import { ref, computed } from 'vue';

const marks = ref(78.5);

const grade = computed(() => {
  if (marks.value >= 60) return 'First Class';
  if (marks.value >= 50) return 'Second Class';
  return 'Pass';
});
</script>

<template>
  <div class="card">
    <h2>Student Details</h2>
    <p>Name: Rahul</p>
    <p>Marks: {{ marks }}/100</p>
    <p>Grade: {{ grade }}</p>
    <button @click="marks += 5">Add Bonus Marks</button>
  </div>
</template>

Course Curriculum

Follow these 45 lessons sequentially to build a deep, production-ready understanding of Vue.js.

Projects You'll Build

Apply your knowledge by building these real-world projects: