DEV Community

Cover image for React vs Vue
Piyush
Piyush

Posted on

React vs Vue

As I've recently started learning react , being an Ex Vue Developer. I can see the vision as well as difference of what make these two used for same purpose (Website) but in Different Condition.

React Vue
High Learning Curve Easy to Use
Huge Eco System Minimal & Focused Eco System
Flexible Integration capability Low Integration Capability
Prioritise Code Consistency Prioritise Fast Project Building

If react is looking very Hard for you to learn , start with vue then you can choose to whether stay with vue or switch to react, as you learn basic concept such as components , props , event handling , conditional rendering faster with vue.

Lets Dive into CODE

Below is an Count Increment Example

  • React
import { useState } from 'react'
import './App.css'

function App() {
  const [count, setCount] = useState(0)

  return (
    <>
      <div className="card">
        <button onClick={() => setCount((count) => count + 1)}>
          count is {count}
        </button>
        <p>
          Edit <code>src/App.tsx</code> and save to test HMR
        </p>
      </div>
    </>
  )
}

export default App
Enter fullscreen mode Exit fullscreen mode
  • Vue
<script setup lang="ts">
   let count = ref(0)
</script>

<template>
  <div>
    <div class="count" @click="count++"> 
      {{ count }}
    </div>
  </div>
</template>

<style scoped>
.count {
  background-color: #323232;
  padding: 1.5em;
}
</style>

Enter fullscreen mode Exit fullscreen mode

As you can see , the same purpose can be acquired by both the Tech.

Conclusion

Learn React 💙

  • If you want to get a job in frontend as fast as possible
  • Want an Huge Eco System Support

Learn Vue 💚

  • Want to learn frontend concepts quickly
  • Start building Projects

Top comments (0)