React ve React Native'i Anlamak

Biz insanlar birçok şeyle karıştıracağız. Karışıklık, şeylerin farklı özelliklerine bağlı olarak ortaya çıkabilir. Farklı şeylerle karıştırılmanın en yaygın yolu onların isimleridir.

İnsanlar önce yeni bir şeyin isimlerini öğrenecekler. Ya başka bir kişi, hayvan, ürün, yazılım vs. isimleriyle arama yapacaklar ve daha sonra farklı özellikler, uygulamalar, tarihçe vb. hakkında bilgi sahibi olacaklar,

Bütün bunlar neden?

Evet, insanlar genellikle React ve React Native terimleri (adları) ile karıştırılır. Teknoloji uzmanı olmayanlar React ve React Native adlarını görürlerse, çoğu durumda React'in bir uzantısı olarak Reactive Native'i kabul ederler. Hatta bazı teknik adamlar bile bu alanlarda %0 bilgiye sahiplerse aynı şekilde düşünebilirler.

O şeyler aslında ne? Neden insanlar genellikle başkalarıyla değil de onlarla karıştırılıyor?

React ve React Native iki çerçevedir. İsimler, aralarında fazladan bir kelime ile benzer görünüyor. Bu nedenle, insanlar genellikle ilk bakışta isimleri nedeniyle karıştırırlar. Aynı kafa karışıklığına sahipseniz, onların ardındaki gizemi çözmek için doğru yerdesiniz.

Hadi bulalım.

Tepki

React, tek sayfalık web uygulamaları oluşturmak için kullanılan bir JavaScript kitaplığıdır. Web için kullanıcı arabirimleri (ön uç) oluşturmak için en popüler kitaplıklardan biridir. Belki de şimdilik en popüler kütüphane diyebiliriz. Facebook tarafından oluşturulur ve sürdürülür. ReactJS olarak da bilinir.

React ile tecrübem olduğu için öğrenmesi ve inşa etmesi güzel ve basit olduğunu söyleyebilirim. Bu bir kütüphane. Böylece, özelliklerini kullanarak istediğimizi ve istediğimizi inşa edebiliriz. React ile uygulama geliştirirken uyulması gereken katı kurallar yoktur. Yani özgürlüğümüz olacak.

React'in pek çok harika özelliği var. Onlara bir bakalım.

#1. Bileşenler

React'te her şey bir bileşendir. Web uygulamasının yapı taşı gibidir. Küçük bileşenleri birleştirerek büyük bileşenler oluşturabiliriz. Her bileşenin kendi durumu ve kontrolü vardır. Bileşenler, kullanıcı arayüzünü kontrol eder ve durumuna göre kullanıcılara ne gösterileceğine karar verir.

Bileşenler, React'teki her şeydir. Ve tekrar kullanılabilirler. Bir kez yazın ve her yerde kullanın.

Bileşenleri çok dikkatli yazmamız gerekiyor. Uygulamamız büyüdüğünde işlerin bakımını kolaylaştırır. Tek bir bileşene çok sayıda kod yazarsak, sonunda bakımı bize yük olur. Reaksiyon bileşenleri küçük ve tatlı olmalıdır. Geliştiricilerin hayatını hem cennet hem de cehennem haline getiriyorlar.

#2. sanal DOM

Düğmenin içinde yükleyici gibi bir şey görmeliydin. Ve sosyal medya platformlarında, bastığınız anda beğeni sayısı artıyor. Web'in ilk günlerinde bilgiyi almak için her şeyi yeniden yüklememiz gerekiyordu. Ama artık güncellenmesi gereken bir single, başka şeylere dokunmadan bizim için tazelenecek. Bütün bunlar ne hakkında?

Daha önce gördüğümüz gibi, React'teki her şey bir bileşendir. Tarayıcılar, bir web uygulamasının öğeleri için DOM yapısını korur. Web uygulamasının bir bölümünün güncellenmesi gerektiğinde, DOM manipülasyonlarını kullanarak güncellememiz gerekir. React aynı şeyi verimli bir şekilde yapar.

React, tüm bileşenleri için sanal bir DOM (DOM kopyası) oluşturur. Bir web uygulamasında bir şeyi güncellemek için React, gerçek DOM'yi sanal DOM ile karşılaştırır. Herhangi bir değişiklik varsa, React bileşeni güncellemeyi tetikler.

#3. Tek Yönlü Veri Akışı

Veri akışı olmadan büyük bileşen setini daha küçük bileşenlere bölemeyiz. Bileşenler arasında veri akışının bir yolu olmalıdır.

React, verileri bir bileşenden başka bir bileşene tek bir yönde iletmemizi sağlar. Veriler, ana bileşenlerden alt bileşenlere akar. Ve alt bileşenler verileri güncelleyemez. Veri akışı tek yönlü olduğundan, verileri ana bileşene geri göndermenin bir yolu yoktur.

Önce çok yönlü veri akışı olmadığını düşünebilirsiniz. Ancak, tek yönlü bir veri akışı, bize çok yönlü veri akışı üzerinde daha fazla kontrol sağlar.

genel bakış

JSX, Koşullu Oluşturma vb. gibi daha birçok özellik vardır.; onlar ikincil. React kütüphanesinin temel özelliklerini gördük. React uygulamaları söz konusu olduğunda, onunla hemen hemen her tür web uygulamasını oluşturabiliyoruz. React topluluğu çok büyük. React ile çalışmak için birçok paket bulabilirsiniz.

Yerel Tepki Ver

React Native, platformlar arası mobil uygulamalar geliştirmek için kullanılan bir JavaScript çerçevesidir. Ayrıca Facebook tarafından oluşturulur ve sürdürülür.

Çoğunuz yukarıdaki açıklamaya şaşıracaksınız.

Tek bir çerçeve ile Android ve IOS için mobil uygulamalar oluşturabilir miyiz?

Teknoloji dünyasındaki güncellemeleri takip etmiyorsanız, bunu bilme şansınız yok. Evet, React Native kullanarak platformlar arası (hem Android hem de IOS) uygulamalar oluşturabiliriz. Ve platformlar arası uygulama geliştirme için başka çerçeveler de var.

React Native, türünün en popülerlerinden biridir. Yerel uygulamalardaki JavaScript sınırlamaları nedeniyle en popüler olanı değil. Ancak, gelişim alanlarında parlıyor. Facebook, Instagram, Flipkart vb. gibi büyük şirketler bile bunu kullanıyor. Bu, onu kullanmanız gerektiği anlamına gelmez. Bu, React Native ile platformlar arası üretim düzeyinde uygulamalar oluşturabileceğimiz anlamına gelir.

Yukarıdaki paragrafta Native Applications adında bir grup kelime kullandım. Onlar neler? Yeni bir uygulama türü değil. Yerel bir uygulama, belirli bir platform için özel olarak oluşturulur. Android cep telefonları için Android uygulamaları, iPhone cep telefonları için IOS uygulamaları, Windows için Windows uygulamaları vb.,

Doğalöğesini Tepki de Native nesi var? Buna gelince, React Native, dileğimize göre hem Android hem de IOS'a uygun yerel bir uygulama oluşturur. React Native ile geliştirilen uygulamalar, android için Android Studio ve IOS için benzer şekilde yereldir.

Belki de yaratıcılar bu yüzden ona React Native adını verdiler. Gerçek değil.

React Native'in özelliklerine gelince, bizi bekleyen bir yığın özellik var. Bunlardan bazı temel özellikleri görelim.

#1. Çapraz Platform

Tek bir kod tabanı ile aynı anda hem Android hem de IOS için mobil uygulamalar oluşturabiliyoruz. Şirketler için çok zaman ve para tasarrufu sağlar.

#2. Sıcak veya Canlı Yeniden Yükleme

React veya React Native uygulamalarında deneyiminiz varsa, muhtemelen bunu biliyorsunuzdur. Bu özellik, kodu değiştirdiğimizde tüm uygulamayı yeni güncellemelerle yeniden yükler. Kodu her değiştirdiğimizde yeniden yükle düğmesine basmak zorunda değiliz. Kodu güncelleyin ve değişiklikleri görün. Bu kadar. Bir bug olmadıkça bir şey beklemek zorunda değiliz.

Size ikincil bir özellik gibi görünebilir. Ancak, herhangi bir çerçeve olmadan android geliştirmeden geliyorsanız, bu özelliğin değerini React Native'de anlayacaksınız.

#3. UI Kitaplıkları ve Topluluğu

React Native'de birçok yerleşik yerel bileşen vardır. Bunları herhangi bir ek kurulum veya kurulum olmadan doğrudan kullanabiliriz. Yerel bileşenler, ilgili platformlarda yerel görünür. React Native uygulamaları UI, IOS yerel UI ve Android yerel UI ile eşleşir. React Native, React'e benzer bileşenlere sahiptir.

Ve topluluk söz konusu olduğunda. Büyük ve artmaya devam ediyor. Topluluk içinde sıkışıp kaldığınızda herhangi bir zorluk çekmeden yardım alabilirsiniz.

genel bakış

React Native'in diğer birçok özelliğini internette bulabilirsiniz. Mobil uygulama geliştirmeye giriyorsanız bunları da keşfedin. Bir ön uç geliştirici, React Native kullanarak yerel uygulamalar da geliştirebilir. Platformlar arası mobil uygulamaların geliştirilmesini kolaylaştırır.

Tepki Vs. Yerel Tepki Ver

React ve React Native arasında bazı benzerlikler ve farklılıklar vardır. Onlara bir bakalım.

React ve React Native uygulamaları söz konusu olduğunda, bunlar birbirinden tamamen farklıdır. Ancak, ilkelere gelince, benzer görünüyorlar. Hem React hem de React Native'in bileşenleri vardır. Ve ilgili geliştirmede aynı ilkeleri takip ederler.

Her ikisi de geliştirme için JavaScript dilini kullanır. Her ikisinde de basit bir Hello, World uygulaması görelim.

Tepki

 import React, { Component } from 'react'; import './App.css'; class App extends Component { render() { return ( <div className="container"> <h1>Hello, Wolrd!</h1> </div> ); } } export default App;

Yerel Tepki Ver

 import React from 'react'; import { Text, View } from 'react-native'; const App = () => { return ( <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}> <Text>Hello, world!</Text> </View> ) } export default App;

Gördüğünüz gibi ikisi de React paketini kullanıyor. Sözdizimi, JSX adlı özel bir işaretleme kullandıkları için her iki uygulamada da benzer görünüyor. Ama iş render kısmına gelince ikisi de farklı şeyler kullanıyor. React, Virtual DOM kullanır ve React Native, UI oluşturma için Yerel API'yi kullanır.

React uygulamalarının deyim yönetimi için Redux, MobX, vb. gibi bazı harici paketler vardır. Aynı paketler React Native uygulamalarında da kullanılabilir.

Hem React hem de React Native JavaScript kullanır. Yani hemen hemen her JavaScript paketini her ikisinde de kullanabiliriz. Bu, her iki paket kitaplığına da çok sayıda paket ekler.

React ve React Native birbiriyle ilişkilidir. Ancak farklı amaçlar için kullanılırlar.

Çözüm

React ve React Native, son ürün ve uygulama platformları açısından farklıdır. Ancak, ilgili uygulamanın geliştirilmesinde benzer ilkeleri takip ederler. İki çerçeveden birini, React veya React Native'i öğrenebilirseniz, diğerini öğrenmeyi hızlandırabilirsiniz. Ancak, React Native uygulamalarının geliştirilmesi için React bilgisi gereklidir. Ancak, bunun için yeterli değil. React Native'de destek sınırlı olduğundan, yerel uygulamaların geliştirilmesi hakkında daha fazla bilgi sahibi olmamız gerekiyor.

Gelecekte tam destek için eninde sonunda gelişeceğini umalım.

Web veya mobil uygulama geliştirmeye başlamak istiyorsanız, React veya React Native'i seçmek gelecekte kesinlikle size fayda sağlayacaktır. Ama yine de zorunlu değil.

JavaScript biliyorsanız, React kavramlarını öğrenmek çocuk oyuncağıdır. Resmi belgeler, React veya React Native ile başlamanız için harika bir kaynak olacaktır.

mutlu bilmek