design

React mı? Vue js mi? YOKSA Angular mı? Ama Hangisi

November 28, 2023

React mı? Vue js mi? YOKSA Angular mı? Ama Hangisi


Aslında bu sorunun cevabı çok net "Duruma Göre Hangisini Tercih Edersen"

Uygulamaların Performansları hemen hemen birbirine yakın olsa da artık şuan da React JS Piyasayı önde götürmekte. React JS tercihi tamamen şirket ve ya şahısların tercihi olduğunu düşünüyoruz. Ama gerçekten öyle mi?

Şimdi bu 3 Framework'ün özelliklerini inceleyelim;


  • React: Facebook tarafından geliştirilen bir JavaScript kütüphanesidir. Modüler bir yapıya sahiptir ve bileşen tabanlı bir yaklaşım sunar. Büyük bir topluluğa sahip olan React, sanal DOM (Document Object Model) kullanarak performansı artırır ve dinamik kullanıcı arayüzleri oluşturmak için yaygın olarak tercih edilir. React, genellikle daha büyük ölçekli projelerde ve birden fazla platformda (web, mobil) kullanılabilir olmasıyla bilinir.
  • Vue.js: Kolay öğrenilebilir, esnek ve hafif bir JavaScript framework'üdür. Vue, bileşen tabanlı bir yapı sunar ve diğer framework'lere kıyasla daha az öğrenme eğrisine sahiptir. Esnekliği sayesinde, küçük ve orta ölçekli projelerden büyük ölçekli uygulamalara kadar geniş bir kullanım alanına sahiptir. Vue, özellikle basit ve hızlı prototipleme için tercih edilir.
  • Angular: Google tarafından geliştirilen bir TypeScript tabanlı bir framework'tür. Angular, MVC (Model-View-Controller) modelini kullanır ve kapsamlı bir yapı sunar. Büyük ölçekli, karmaşık ve kurumsal uygulamalar için idealdir. Angular, tam bir framework olduğu için içinde birçok yerleşik özellik barındırır ve bu özellikleri kullanmak isteyen geliştiriciler için avantaj sağlayabilir.


Vue JS 2020 lerde bayağı popüler olmaya başlamıştı ama ne olduysa popülaritesi düştü. Bunun sebeplerinden ana sebebine bakacak olursak ;

Şirketlerin Sürekli React JS Developer Arayışı ve Geliştiricilerin tekrardan React JS'e yönelmesi

Evet Herkesin elinin altında internet var bir frontend geliştirici dilediği Framework ü bu sayede kullanabilir uzun veya kısa vadeli projelerinde de kullanabilirler. Fakat şirketlerin beklenenden fazla React JS Developer arayışı sanırım VUE JS Tarafını biraz üzmüş vaziyette. Angular'a gelecek olursak onun pek umrunda olmadığı aşikar. Çünkü geniş çaplı projelerde Angular tercih ediliyor. Daha sağlam bir alt yapıya sahip olduğunu söylemeliyiz.

Biraz da çalışma mekanizmalarına bakalım;




React Counter Örneği:

index.js

js
import React, { useState } from 'react';

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

  const increment = () => {
    setCount(count + 1);
  };

  const decrement = () => {
    setCount(count - 1);
  };

  return (
    <div>
      <h1>React Counter</h1>
      <p>Count: {count}</p>
      <button onClick={increment}>Increase</button>
      <button onClick={decrement}>Decrease</button>
    </div>
  );
}

export default ReactCounter; 


Vue Counter Örneği:

index.js

js
<template>
  <div>
    <h1>Vue.js Counter</h1>
    <p>Count: {{ count }}</p>
    <button @click="increment">Increase</button>
    <button @click="decrement">Decrease</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      count: 0
    };
  },
  methods: {
    increment() {
      this.count++;
    },
    decrement() {
      this.count--;
    }
  }
};
</script> 


Angular Counter Örneği:

index.js

js
import { Component } from '@angular/core';

@Component({
  selector: 'app-counter',
  template: `
    <div>
      <h1>Angular Counter</h1>
      <p>Count: {{ count }}</p>
      <button (click)="increment()">Increase</button>
      <button (click)="decrement()">Decrease</button>
    </div>
  `
})
export class CounterComponent {
  count: number = 0;

  increment() {
    this.count++;
  }

  decrement() {
    this.count--;
  }
} 


6 + 1 =