React JS Nedir?

Blog

Web ve mobil uygulamalar geliştirmek için React.js hepsine sahip.

Hızlı, güvenli ve ölçeklenebilir. Harika bir kullanıcı ve geliştirici deneyimi sunar. Dahası, popülaritesi, Facebook ve canlı bir topluluk tarafından desteklendikçe artmaktadır. Projeniz için hangi teknolojiyi seçeceğinizi merak ediyorsanız, React.js muhtemelen en iyi seçimdir. İşte nedenini açıklayacak kısa bir rehber.

 

React.js, önde gelen bir JavaScript teknolojisidir ve gittikçe daha popüler hale geliyor.

Son birkaç yılda, React.js paketinin NPM ile indirdiği diğer iki popüler çerçeveye karşı indirilen sayısı - Açısal / Çekirdek ve Vue - önemli ölçüde artmıştır. Teknoloji kullanımı güç yasalarıyla yayılır ve React.js kategorisini devralıyor gibi görünüyor.

 

Kısacası, kullanıcı arayüzleri oluşturmak için bir JavaScript kütüphanesi olan UI'leri oluşturmak için bir araçtır . Bazı yazılım mühendisleri, geliştiricilere Angular veya Vue'dan çok daha fazla özgürlük sağladığı için buna "çerçeve" demeyi tercih eder . 

Angular'ın Google tarafından desteklendiği gibi, React.js de Facebook ve geliştiriciler topluluğu tarafından korunur. Her ikisi de açık kaynaklıdır ve MIT lisansı altında kullanmakta serbesttirler . React.js sadece altı yaşında ve bu da onu nispeten yeni bir teknoloji haline getiriyor. Ancak, çok hızlı bir şekilde olgunlaştı.

JavaScript ile, tarayıcının işlevlerin önemli bir bölümünü gerçekleştirdiği dinamik uygulamalar oluşturabilir, böylece sunucuya başvurmadan çalışabilirler. Ayrıca, bir uygulamanın sadece bir bölümünde (yeniden yüklemeden) verilerin ve arayüzün bağımsız olarak güncellenmesini sağlar.

 

Tam olarak React.js ne yapar?

React, hem UI bileşenlerini hem de tüm UI'leri oluşturmak için bir araçtır - görsel unsurları bir araya getirmek, bu öğelere veri bağlamak ve onu yöneten mantığı belirlemekle ilgili her şey. 

React.js, farklı platformlar için JavaScript'te kullanıcı arayüzleri oluşturmak için kullanılabilir. Sen kullanabilirsiniz ReactDOM , web uygulamaları için Electron ile mobil uygulama geliştirme (Android ve iOS arasındaki kod çoğunluğunu paylaşımı) ve çapraz platform hibrid masaüstü uygulamaları için Native yanıt verin.

Son zamanlarda, Microsoft, Windows için React Native'i de yayımladı .

React.js bir ön uç teknolojisidir, ancak arka uçta da (sunucu tarafından oluşturulan) çalıştırılabilir ve masaüstü uygulamaları için kullanılabilir. 

Modern JavaScript çerçevelerini kullanmak için iki olası yaklaşım vardır - tarayıcının kodu indirdiği ve kullanıcı arayüzünün arka uçta oluşturulduğu sunucu tarafı oluşturma işleminin gerçekleştirildiği istemci tarafı oluşturma.

JavaScript çözümleri (React.js gibi) ve daha eski teknolojiler arasındaki fark, JS'nin sanki hiç sunucu tarafından oluşturulmamış gibi mantık ve belge manipülasyonunun çok daha fazlasını üstlenmesidir.

React.js'in onu diğer popüler JavaScript çerçevelerinden ayıran temel özelliği esnekliktir. Bir kitaplık kapıp basit bir sayfa veya görünüm görüntülemek için kullanabilirsiniz, ancak React.js'yi diğer araçlarla birleştirebilir ve karmaşık bir uygulamanın temelini oluşturacak bir çerçeve olarak kullanabilirsiniz .

Araçlardan, kütüphanelerden ve yaklaşımlardan oluşan canlı bir ekosisteme sahip olduğu için sadece bir kütüphanedir. Bunlar özel bir çerçeve ve araç seti olarak kullanılabilir.

 

React.js ve React Native arasındaki fark

Tepki Yerli son zamanlarda iş çevrelerinde daha da popüler bir terim haline geldi. Bunun nedeni, Facebook'un platformlar arası mobil uygulama geliştirme için en iyi aracı aktif olarak tanıtmasıdır .

React Native, React.js'de yazılmış, düğmeler ve animasyonlar gibi yerel iOS ve Android arabirim bileşenleri oluşturabilen UI öğelerini kullanır .

React Native ile , iki platform arasında kodun büyük çoğunluğunu paylaşan iPhone ve Samsung veya Huawei akıllı telefonlarda sorunsuz çalışan uygulamalar oluşturabilirsiniz .

 

React.js hakkında bilmeniz gereken üç temel terim

Bunların çoğu yok, ancak bu temel ifadeleri anlamak, onun ne hakkında olduğunu anlamanıza yardımcı olacak.

  1. Bileşenler , bir uygulama oluşturmak için bir araya getirilebilecek yapı taşlarıdır. React.js ile özel bileşenler oluşturmak nispeten kolaydır, bu da çok önemli bir özelliktir çünkü% 99 durumlarda özel bileşenler oluşturmak gerekir ve kullanıma hazır bileşenler genellikle bir React.js uygulamasında bileşenlerin% 10-20'sini oluşturur . Ayrıca, tam teşekküllü bir UI kütüphanesine (Malzeme UI gibi) gidebilir ve bileşenleri veri ve özel mantıkla bağlayabilirsiniz.
  2. JSX , geliştiricilerin mantığı kontrol etmek için JS ile karıştırılamayan HTML ve XML'ye benzeyen sözdizimini kullanarak görünümler yazmasına izin veren bir JavaScript uzantısıdır.
  3. Redux , genellikle React.js ile eşleştirilmiş, canlı bir ekosisteme sahip bir devlet yönetimi kütüphanesidir.

 

React.js'de ne yapabilirim?

Bir başlangıç ​​için, Facebook'u düşünün .

React.js ile yapıldı. 2012 yılında Facebook Reklamları, sosyal ağın web uygulaması daha büyük ve daha fazla bileşen içerdiğinden yönetimi zorlaştı.

Mark Zuckerberg, HTML5'e güvenmenin kuruluşlarının en büyük hatalarından biri olduğunu ve aynı zamanda kullanıcılara (ve yatırımcılara) Facebook'un çok yakında harika mobil deneyimleri sunacağına söz verdiğini belirtti.

Aynı zamanda, şirket Instagram'yı satın aldı . Mayıs 2013'te React.js resmen başlatıldı. 

O zamandan beri React.js devraldı. Kullanarak yeni ürünler üretiliyor ve en büyük ve en başarılı dijital ürünlerden bazıları React.js'yi yığınlarına dahil ediyor. Bu, dünyanın en ünlü uygulamalarını içerir, örneğin:

  1. Sosyal ağlar (Facebook, Instagram, Pinterest, Twitter) 
  2. Ekonomi platformlarını paylaşma (Airbnb, Lyft, Uber )
  3. Medya siteleri (Yahoo!)
  4. Video platformları (Netflix)
  5. SaaS araçları (SendGrid, Asana , InVisionApp, Zapier)

Popüler dijital ürünlerin tam listesini React.js kullanarak burada bulabilirsiniz .

Facebook kendi amaçları için React'i yarattı; web ve mobil uygulamalarının çoğu React kullanılarak yazılmıştır. Şu anda, sosyal ağ, tüm platformu React, GraphQL ve Relay ile yeniden inşa etme sürecinde .

 

React.js'in süper güçleri nelerdir ve pratikte ne anlama geliyor?

  1. Declarativity. Kısaca, kavram "ne olduğunu, nasıl olmadığını" söylemesidir. Sen inşa arayüz uygulamanın kullanıcı görünümüne sonra görünüm oluşturarak. React.js ile kod, görüntülemek için hangi adımların atılması gerektiğine değil, neyin görüntülendiğine odaklanır. Kodlayıcı olmayanlar için ikinci yaklaşım daha sezgisel görünmektedir. Ve bu yöntemle bir ekran veya bileşen oluşturmak ve hata ayıklamak gerçekten de daha hızlı. Declarativity, genellikle harika UX'e çeviren harika DX (geliştirici deneyimi) anlamına gelir .
  2. Bileşen tabanlı yaklaşım. Yapı blokları - bir UI işlevinden (örneğin, bir düğme), ağ iletişiminden (örneğin bir veri alıcısı) sorumlu olabilecek bileşenler veya durumu yönetmek gibi çok daha karmaşık işlevler (örn. Bir veri alıcısı) kullanarak React.js ile uygulamalar oluşturursunuz. , Redux Sağlayıcısı). Bu modüler yaklaşım, bir tasarım sisteminin uygulanmasını ve gösterilmesini kolaylaştırır (örneğin, Storybook ile). React.js'deki bileşenler çekici bir DX sağlar.
  3. Minimalizm. React.js küçük ve indirmesi hızlıdır. Programlama ortamını yapılandırmak için fazla iş gerektirmez. Dahası, web sitenizin veya web uygulamanızın yükleme süresini önemli ölçüde azaltabilen kod bölme özelliği sayesinde her zaman tüm uygulamayı yüklemeniz gerekmez. Google, kısa yükleme sürelerine sahip siteleri tanıttığı için ürününüzün UX'i ve pazarlama (SEO) için sorunsuz ve hızlı yükleme süreleri çok önemlidir.
  4. Büyük ekosistem ve esneklik . Dijital ürününüz için bir teknoloji seçerken , gelecekte popüler olacak olan bir programlama dilini veya zaten popüler olan ve en önemlisi, bir çerçeveyi kullanmak istersiniz. Kapsamlı kullanım size en önemli kaynakları sağlar - teknolojiyi bilen ve bileşenlerin kütüphanelerini ve yeni uygulama alanlarını genişletmenin yanı sıra teknolojiyi tanıyan ve öğrenen ve geliştiren bir yetenekli geliştiriciler havuzu. React.js hepsine sahip.
  5. Geriye dönük uyumluluk . Yazılımın, kullandığı (veya buna bağlı) kütüphanelerin eski sürümleriyle çalışabilmesi her zaman harikadır. Ancak, birçok dil ve çerçeve geriye dönük uyumluluk sağlayamaz, çünkü pahalıdır. Neyse ki, Facebook, şirket içi kullanımı için geriye dönük uyumluluğu korumak için yatırım yapmak zorunda kaldı. Bazı FB uygulamaları hala React hala uyumluluk sorunu yaşamadığı sırada oluşturulan kod parçalarını çalıştırmaktadır.

 

Yetenekli geliştiriciler React.js’yi kullanmak istiyor

React.js'nin geliştiriciler arasında bu kadar popüler olmasının bir nedeni olmalı. Stack Overflow Geliştirici Anketi 2019’a göre en çok sevilen ve en çok aranan web çerçevesidir , React.js ile çalışan geliştiricilerin% 74,5’i, çalışmaya devam etmek istediklerini bildiren% 21,5 ve React.js’yi bilmeyen yazılım mühendisleridir. bunu öğrenmek istediklerini belirterek.

Yukarıda belirtilen tüm süper güçler, React.js çerçevesinin önemli ticari avantajlarına dönüşmektedir. Facebook teknolojiyi destekliyor, giderek daha popüler hale geliyor ve dünyanın her yerinden genç yetenekli geliştiriciler öğrenmeye hazır. 

Büyük yetenek havuzu ve parlak bakış açıları işletme bakış açısından temel özelliklerdir. Birçok başarılı dijital proje, kodlarını Facebook da dahil olmak üzere yeni teknolojilere yeniden yazmak zorunda kaldı.

 

Hızlı ve ölçeklenebilir yazılım geliştirme

Sen inşa edebilirsiniz web uygulamaları React.js ile, hızlı ve hibrid mobil uygulamalar. Modern çevik, yinelemeli yazılım tasarımı ve geliştirme yaklaşımı için mükemmeldir. React.js ile, herhangi bir görünüm ve histen ve UX'ten ödün vermeden çok hızlı bir şekilde bir MVP başlatabilirsiniz. 

Modülerliği sayesinde React.js kolayca ölçeklenir. Bir ürünü minimum kaynaklarla önyükleyebilir ve Facebook gibi oldukça büyük bir tek sayfalık uygulama geliştirebilirsiniz.

Farklı kullanım durumlarına uygun takım ve kitaplık kütüphanelerinin mevcudiyeti ve çeşitliliği sayesinde, küçük, hafif web sitelerinden, orta büyüklükteki portallardan ve uygulamalardan büyük işletme ölçekli sistemlere kadar yazılım oluşturmak için React'i kullanmak mümkündür.

Herhangi bir ön uç web veya mobil uygulamada React.js uygulayın. İşte mükemmel uyması gereken bazı senaryolar.

  1. Müşteri tarafında karmaşık akış gerektiren orta-yüksek karmaşıklıktaki bir uygulama ile karşı karşıya kalırsanız.
  2. Eğer reaktif ve performanslı bir UI gerektiren bir uygulama oluşturmayı planlıyorsanız.
  3. Daha fazla veya daha az dinamik içeriğe sahip (blog veya açılış sayfası gibi) statik bir web sitesi geliştirirken. React.js için bir site üreticisi olan Gatsby.js, bu kullanım durumları için endüstri standardıdır.
  4. Performanslı bir web sitesine veya web uygulaması uygulamasına sahipken iş planınız için çok önemlidir.
  5. Yüksek kaliteli bir mühendislik yeteneği bulmak hızlı bir şekilde projenizin başarısı için esastır.

Tüm bu durumlar React.js kullanımı için mükemmel bir fırtına yaratır.

Aslında, React.js'nin doğru seçim olmadığı senaryoları adlandırmak daha zordur. Örneğin, basit bir oluşturma, okuma, güncelleme ve silme (CRUD) uygulaması oluşturmayı planlıyorsanız, React.js geçersiz olabilir.

Aynı basit bir kerelik web sayfası için de geçerli olabilir. Ancak, CRUD işlevleriniz gelecekteki gelişim için sadece ilk adımsa, bu teknolojiyi düşünebilirsiniz.

 

Bugün çalışıyor ve yarın daha iyi çalışacak

Birçok şirket React.js'ye göç eder veya onu kullanarak yeni projeler başlatır. Aynı zamanda, hem küçük hem de üst düzey geliştiriciler çerçeveyi öğreniyorlar.

Facebook ve diğer React.js kullanıcıları, ölçeklenebilir ve güvenli kalması için yatırım yapar. Bu hedeflere React.js'nin minimalizmi sayesinde ulaşması nispeten kolaydır.

Ne kadar çok şirket ve birey React.js kullanıyorsa, toplumun tamamı teknolojiyi geliştirmek için birlikte çalıştığından, daha esnek, ölçeklenebilir ve güvenlidir.

Daha erişilebilir, daha evrensel ve kullanımı daha basit hale gelir.

Zaten birçok kullanım senaryosuna sahip esnek bir araç. En azından bir miktar karmaşıklık seviyesine sahip bir önyüz gerektiren herhangi bir projede uygulanabilir.

JavaScript kitaplığı, başlangıçlarda bir MVP'yi hızlı bir şekilde serbest bırakmak ve ürünü daha sonra büyütmek için kullanılabilir. React.js, yeni özellikleri hızlı bir şekilde uygulamak için kullanıldığı işletmeler için faydalı olduğunu kanıtladı.

React.js, geliştiriciler, girişimciler ve kurumsal ürün sahipleri tarafından sevilen bir teknolojidir. Gelişim çok hızlı olduğunda ve yeni bir teknoloji devrimi her köşenin arkasına gizlendiğinde, dijital teknoloji hakkında öngörülerde bulunmak zor.

Ancak, pek çok kuruluş React.js'yi benimsediğinden ve çok sayıda yetenekli mühendis React.js'yi kullanmakta ve kullanmayı öğrendiğinden, en azından önümüzdeki birkaç yıl içinde, yeniden kullanılabilir bir bileşen tarafından şaşırmamız muhtemeldir. React uygulamalarını, kullanılmayan teknolojiden daha kolay oluşturuyor.