React.js Nedir?
Facebook tarafından geliştirilen ReactJS, en popüler ve açık kaynaklı frontend kütüphanelerinden biridir.
Kolayca genişletilebilir ve Redux gibi kitaplıkları kullanarak durum yönetimi gibi harika özellikler sunar. Ayrıca, az yer kaplamasına rağmen her projeye uygun olabilir. Karmaşık uygulamalar geliştirmek için kullanılabilen, zengin özelliklere sahip devasa bir kütüphanedir. Büyük ölçekli projeler için çok uygundur.
React DOM’u kullanarak sanal bir DOM (Document Object Model) oluşturur. Bu sayede sayfa üzerinde bir değişiklik olduğunda tüm sayfayı güncellemek yerine sadece değişiklik yapılan kısmı günceller. Böylelikle performans tarafında fark gerçek DOM’a göre daha hızlı çalışır.
React’i diğer frontend teknolojilerden ayıran özelliklerinden biri de söz dizimi ve JavaScript uzantısı olan JSX’tir. Şablon için yeni bir dosya oluşturmaya ve ardından JSX ile başka bir dosya mantığı oluşturmaya gerek yoktur. Basitçe söylemek gerekirse, JSX, bir programcının JavaScript’te HTML oluşturmasını sağlar.
JSX, HTML’ye benzeyen ancak aynı zamanda JavaScript gücüne sahip bir sözdizimidir. Bu sözdizimi, geliştiricilerin veri alma, koşullar, döngü, ifadeler vb. gibi gerekli tüm öğelerle UI mantığı yazmasına yardımcı olur. JSX sözdizimini kullanmadan bir ReactJS uygulaması yazabileceğinizi, ancak geliştirme deneyiminin o kadar iyi olmayacağını unutmayın.
JSX örneği,
const x = 5;
const myElement = <h1>{(x) < 10 ? "Hello" : "Goodbye"}</h1>;ReactJS, JavaScript tabanlıdır. Bundan dolayı React öğrenmenizi hızlandırmak için (temel JavaScript bilgisi dışında) birkaç şeye aşina olmanız gerekir.
HTML, bir web sayfasının yapısını sağlar. ReactJS’de kod yazarken JSX adlı yeni bir sözdiziminde HTML yapısını kullanacaksınız. Bunun dışında arayüzde stillendirmeler yapabilmek için CSS öğrenebilirsiniz.
Kurulum
Yeni React uygulamaları oluştururken birkaç farklı yol mevcuttur. Terminalinizde aşağıdaki komutları çalıştırarak bir React projesi oluşturabilirsiniz.
create-react-app ile kurulum,
npx create-react-app my-new-app
cd my-new-app
npm startvite.js ile kurulum,
npm create vite@latest my-react-app — — template react
cd my-react-app
npm start
Vite ile kurulum create-react-app’e göre daha hızlıdır ve performans olarak öne çıkmaktadır.
Popüler Kütüphaneler
React kullanırken işlemleri büyük ölçekte kolaylaştıracak birçok kütüphane bulunmaktadır. En temel ihtiyaç duyulan alanlar state management, routering, style ve form işlemleri oluyor. Bu konularda en yaygın kullanılan araçlar react router, react-helmet, redux, zustand, styled-component, classnames, formik, react-query kütüphaneleri olarak öne çıkıyor.
Avantajları/Dezavantajları
Avantajları
- Performans olarak hızlıdır.
- Component tabanlıdır ve yeniden kullanılabilen bileşenlere izin verir.
- Basit tasarımı ve sözdizimi nedeniyle React’i öğrenmesi kolaydır.
- Tüm bileşenleri güncelleme şeklindeki geleneksel yaklaşım yerine uygulamanın önceki ve mevcut durumlarını karşılaştırarak uygulamanın performansını daha da artırmak için sanal DOM kullanır.
- Tek yönlü veri(one-way data binding) akışına izin verir ve veri akışının tek yönde olduğu uygulamalarda hata ayıklamak daha kolaydır.
- Cross-platform uyumluluğu vardır.
- Üçüncü taraf kütüphaneler ile ve API’lerle entegrasyonu esnek olacak şekilde tasarlanmıştır ve diğer kütüphanler ile ve API’lerle kolayca entegre edilebilir.
- Geriye dönük uyumludur. Her güncellemeden sonra, React API neredeyse aynı kalır.
- Büyük bir topluluğa sahiptir.
- Farklı sürümleri arasında geçiş yapmak kolaydır.
- Seo dostu bir kütüphanedir.
Dezavantajları
- Geliştirme hızı yavaştır.
- ReactJS’in hızlı bir şekilde gelişmesi dökümantasyon eksikliğine neden olur.
- React JS, Angular JS ile karşılaştırıldığında öğrenmesi kolaydır. Ancak Redux ile zenginleştirildiğinde React’i öğrenmek zorlaşır.
- ReactJS tam framework değildir. Bunun yerine, bir JavaScript kütüphanesidir.
- Herhangi bir dependency injection konsepti kullanmaz.
StackOverFlow sonuçları;
Son
React’in bir uygulamadaki birincil rolü, en iyi ve en verimli işlemi yürütmeyi sağlayarak, o uygulamanın görünüm katmanını idare etmektir. Hızlı, verimli ve ölçeklenebilir web uygulamaları oluşturma yeteneği nedeniyle React, kararlılık ve popülerlik kazandı. Bugün köklü şirketlerden yeni kurulan şirketlere kadar binlerce web uygulaması React kullanıyor. React kullanan uygulamalardan bazıları;
- Netflix
- Uber
- Airbnb
- The New York Times
- Khan Academy
- Codecademy
- SoundCloud
- Discord
- WhatsApp Web
