Comecei a aprender React por curiosidade e queria saber a diferença entre React e React Native - embora não tenha conseguido encontrar uma resposta satisfatória usando o Google. React e React Native parecem ter o mesmo formato. Eles têm sintaxe completamente diferente?
javascript
reactjs
react-native
javascript-framework
shiva kumar
fonte
fonte
<h1>
,<p>
, etc. Onde reagem nativo torna componentes vista aplicativo nativo, como<View>
,<Text>
,<Image>
,<ScrollView>
, para que você não pode reutilizar diretamente seu código componente UI menos que reformular / substituir todos os elementos.Respostas:
O ReactJS é uma biblioteca JavaScript, compatível com a Web front-end e sendo executada em um servidor, para a construção de interfaces com o usuário e aplicativos da Web.
O React Native é uma estrutura móvel que compila componentes de aplicativos nativos, permitindo a criação de aplicativos móveis nativos para diferentes plataformas (iOS, Android e Windows Mobile) em JavaScript que permite usar o ReactJS para criar seus componentes e implementa o ReactJS sob o de capuz.
Ambos seguem a extensão de sintaxe JSX para JavaScript.
Ambos são de código aberto pelo Facebook.
fonte
Aqui está o projeto React .
No Facebook, eles inventaram o React para que o JavaScript possa manipular o DOM do site mais rapidamente usando o modelo DOM virtual.
A atualização completa do DOM é mais lenta em comparação com o modelo React virtual-dom , que atualiza apenas partes da página (leia-se: atualização parcial).
Como você pode entender neste vídeo , o Facebook não inventou o React porque eles entenderam imediatamente que a atualização parcial seria mais rápida que a convencional. Originalmente, eles precisavam de uma maneira de reduzir o tempo de reconstrução de aplicativos do Facebook e, felizmente, isso trouxe à vida a atualização parcial do DOM.
Reagir nativo é apenas uma consequência do React. É uma plataforma para criar aplicativos nativos usando JavaScript.
Antes de React native, você precisava conhecer Java para Android ou Objective-C para iPhone e iPad para criar aplicativos nativos.
Com o React Native, é possível imitar o comportamento do aplicativo nativo em JavaScript e, no final, você obterá o código específico da plataforma como saída. Você pode até misturar o código nativo com o JavaScript se precisar otimizar ainda mais seu aplicativo.
Como Olivia Bishop disse no vídeo , 85% da base de código nativa do React pode ser compartilhada entre plataformas. Esses seriam os componentes que os aplicativos normalmente usam e a lógica comum.
15% do código é específico da plataforma. O JavaScript específico da plataforma é o que dá sabor à plataforma (e faz a diferença na experiência).
O legal é esse código específico da plataforma - já está escrito, então você só precisa usá-lo.
fonte
Reagir:
Reagir nativo:
Então, basicamente Reagir é a biblioteca de interface do usuário para a vista de sua aplicação web, usando javascript e JSX , Reagir nativa é uma biblioteca extra no topo da Reagir, para fazer um aplicativo nativo para
iOS
eAndroid
dispositivos.Exemplo de código de reação :
Reagir exemplo de código nativo :
Para mais informações sobre o React , visite o site oficial criado pela equipe do facebook:
https://facebook.github.io/react
Para obter mais informações sobre o React Native , visite o site nativo do React abaixo:
https://facebook.github.io/react-native
fonte
O ReactJS é uma estrutura para construir uma hierarquia de componentes da interface do usuário. Cada componente possui estado e adereços. Os dados fluem do topo para os componentes de baixo nível via adereços. O estado é atualizado no componente de nível superior usando manipuladores de eventos.
O React nativo usa a estrutura React para criar componentes para aplicativos móveis. O React native fornece um conjunto básico de componentes para as plataformas iOS e Android. Alguns dos componentes do React Native são Navegador, TabBar, Texto, TextInput, Exibir, ScrollView. Esses componentes usam componentes de interface do usuário nativos do iOS UIKit e Android internamente. O React native também permite NativeModules onde o código escrito no ObjectiveC para iOS e Java para Android pode ser usado no JavaScript.
fonte
Primeiro, as semelhanças: o React e o React Native (RN) foram projetados para criar interfaces de usuário flexíveis. Há muitos benefícios nessas estruturas, mas a retirada mais fundamental é que elas são feitas para o desenvolvimento da interface do usuário. O Facebook desenvolveu o RN alguns anos após o React.
Reagir: o Facebook projetou essa estrutura para ser quase como escrever seu JavaScript dentro de seu HTML / XML, e é por isso que as tags são chamadas de " JSX " (JavaScript XML) e são semelhantes às tags familiares semelhantes a HTML, como
<div>
ou<p>
. Uma marca registrada do React são as tags com letras maiúsculas que denotam um componente personalizado, como<MyFancyNavbar />
também existe no RN. No entanto, o React usa o DOM . O DOM existe para HTML, portanto, o React é usado para o desenvolvimento da web.Reagir nativo: RN não usa HTML e, portanto, não é usado para desenvolvimento web. É usado para ... praticamente todo o resto! Desenvolvimento móvel (iOS e Android), dispositivos inteligentes (por exemplo, relógios, TVs), realidade aumentada etc. Como o RN não tem DOM para interagir, em vez de usar o mesmo tipo de tags HTML usadas no React, ele usa seus próprios tags que são compiladas em outros idiomas. Por exemplo, em vez de
<div>
tags, os desenvolvedores do RN usam a<View>
tag embutida do RN , que é compilada em outro código nativo sob o capô (por exemplo,android.view
no Android; eUIView
no iOS).Em resumo: são muito semelhantes (para desenvolvimento da interface do usuário), mas usados para diferentes mídias.
fonte
Enquanto React.js é uma biblioteca Javascript pai para o desenvolvimento de aplicativos da Web.
Enquanto você usa tags como
<View>
, com<Text>
muita frequência no React-Native, o React.js usa tags html da web como<div>
<h1>
<h2>
, que são apenas sinônimos no dicionário de desenvolvimentos da web / dispositivos móveis.Para o React.js, você precisa do DOM para a renderização do caminho das tags html, enquanto para o aplicativo móvel: React-Native usa o AppRegistry para registrar seu aplicativo.
Espero que seja uma explicação fácil para diferenças / semelhanças rápidas no React.js e no React-Native.
fonte
Não podemos compará-los exatamente. Existem diferenças no caso de uso .
(Atualização de 2018)
ReactJS
A React tem como foco principal o Desenvolvimento Web.
Reagir nativo
Uma extensão do React , focada no desenvolvimento móvel.
Espero ter ajudado você :)
fonte
Em um sentido simples, o React e o React nativo seguem os mesmos princípios de design, exceto no caso do design da interface do usuário.
De qualquer forma, é uma excelente biblioteca para criar interface de usuário para dispositivos móveis e web.
fonte
React é uma biblioteca JavaScript declarativa, eficiente e flexível para a criação de interfaces com o usuário. Seus componentes informam ao React o que você deseja renderizar; em seguida, o React atualiza e renderiza com eficiência os componentes certos quando seus dados são alterados. Aqui, ShoppingList é uma classe de componente React ou tipo de componente React.
Um aplicativo React Native é um aplicativo móvel real. Com o React Native, você não cria um "aplicativo da web para dispositivos móveis", um "aplicativo HTML5" ou um "aplicativo híbrido". Você cria um aplicativo móvel real que é indistinguível de um aplicativo criado usando Objective-C ou Java. O React Native usa os mesmos componentes fundamentais da interface do usuário que os aplicativos iOS e Android comuns.
Mais informações
fonte
O ReactJS é uma estrutura principal, criada para criar componentes isolados com base no padrão reativo. Você pode pensar nisso como o V do MVC, embora eu gostaria de afirmar que o reagir traz uma sensação diferente, especialmente se você estiver menos familiarizado com o conceito reativo .
ReactNative é outra camada que deve ter um componente definido para a plataforma Android e iOS que é comum. Portanto, o código parece basicamente o mesmo que o ReactJS porque é o ReactJS, mas carrega nativamente em plataformas móveis. Você também pode conectar uma API relativa à plataforma mais complexa e complexa com Java / Objective-C / Swift, dependendo do SO e usá-la no React.
fonte
O React Native é desenvolvido principalmente em JavaScript, o que significa que a maior parte do código que você precisa para começar pode ser compartilhada entre plataformas. O React Native renderizará usando componentes nativos. Os aplicativos React Native são desenvolvidos no idioma exigido pela plataforma destinada, Objective-C ou Swift para iOS, Java para Android etc. O código escrito não é compartilhado entre plataformas e seu comportamento varia. Eles têm acesso direto a todos os recursos oferecidos pela plataforma, sem nenhuma restrição.
React é uma biblioteca JavaScript de código aberto desenvolvida pelo Facebook para criar interfaces de usuário. É usado para manipular a camada de visualização de aplicativos da Web e móveis. O ReactJS é usado para criar componentes de interface do usuário reutilizáveis. Atualmente, é uma das bibliotecas JavaScript mais populares no campo, e possui uma base sólida e uma grande comunidade por trás. Se você aprender o ReactJS, precisará ter conhecimento de JavaScript, HTML5 e CSS.
fonte
React é a abstração básica do React Native e React DOM , portanto, se você trabalhar com o React Native, também precisará do React ... o mesmo com a web, mas, em vez do React Native, será necessário o React DOM.
Como o React é a abstração básica, a sintaxe geral e o fluxo de trabalho são os mesmos, mas os componentes que você usaria são muito diferentes. Portanto, você precisará aprender essas diferenças. você conhece o React (abstração de base), você pode simplesmente aprender as diferenças entre plataformas sem aprender outra linguagem de programação, sintaxe e fluxo de trabalho.
fonte
O React-Native é uma estrutura em que o ReactJS é uma biblioteca javascript que você pode usar para o seu site.
O React-native fornece componentes principais padrão (imagens, texto), onde o React fornece vários componentes e os faz trabalhar juntos.
fonte
O React Js é uma biblioteca Javascript onde você pode desenvolver e executar aplicativos da Web mais rápidos usando o React.
O React Native permite criar aplicativos móveis usando apenas JavaScript; é usado para o desenvolvimento de aplicativos móveis. mais informações aqui https://facebook.github.io/react-native/docs/getting-started.html
fonte
Em relação ao ciclo de vida do componente e todos os outros sinos e assobios, é basicamente o mesmo.
A diferença é principalmente a marcação JSX usada. React usa um que se assemelha a html. A outra é a marcação usada pelo react-native para exibir a exibição.
fonte
O React Native é para aplicativos móveis, enquanto o React é para sites (front-end). Ambos são estruturas inventadas pelo Facebook. O React Native é uma estrutura de desenvolvimento de plataforma cruzada, o que significa que se pode escrever quase o mesmo código para o IOS e o Android e funcionaria. Eu, pessoalmente, sei muito mais sobre o React Native, por isso vou deixar por aqui.
fonte
O React Js está manipulando com HTML Dom. Mas o React native está manipulando com o componente da interface do usuário nativa móvel (iOS / android).
fonte
ReactJS é uma biblioteca javascript usada para criar interfaces da web. Você precisaria de um empacotador como o webpack e tentaria instalar os módulos necessários para criar seu site.
O React Native é uma estrutura javascript e vem com tudo o que você precisa para criar aplicativos multiplataforma (como iOS ou Android). Você precisaria do xcode e do android studio instalados para criar e implantar seu aplicativo.
Ao contrário do ReactJS, o React-Native não usa HTML, mas componentes semelhantes que você pode usar no ios e no android para criar seu aplicativo. Esses componentes usam componentes nativos reais para criar os aplicativos iOS e Android. Devido a isso, os aplicativos React-Native parecem reais, diferentemente de outras plataformas de desenvolvimento híbridas. Os componentes também aumentam a capacidade de reutilização do seu código, pois você não precisa criar a mesma interface de usuário novamente no ios e no android.
fonte
Em termos simples, o ReactJS é uma biblioteca pai que retorna algo para renderizar de acordo com o ambiente host (navegador, celular, servidor, área de trabalho etc.). Além de renderizar, também fornece outros métodos, como ganchos de ciclo de vida ... etc.
No navegador, ele usa outra biblioteca react-dom para renderizar elementos DOM. No celular, ele usa componentes React-Native para renderizar componentes da interface de usuário nativos específicos da plataforma (IOS e Android). TÃO,
react + react-dom = desenvolvimento da web
react + react-native = desenvolvimento móvel
fonte
REACT é uma biblioteca Javascript para criar aplicativos da web de interfaces grandes / pequenas, como o Facebook.
REACT NATIVE é uma estrutura Javascript para desenvolver aplicativos móveis nativos no Android, IOS e Windows Phone.
Ambos são de código aberto pelo Facebook.
fonte
Aqui estão as diferenças que eu conheço:
fonte
Em resumo: React.js para desenvolvimento na Web enquanto React-Native para desenvolvimento de aplicativos para dispositivos móveis
fonte
ReactJS
Reagir nativo
fonte
React Js - React JS é uma biblioteca javascript front-end, é uma biblioteca grande, não um framework
componentes reutilizáveis da interface do usuário
ReactNative - O React Native é uma estrutura de aplicativos móveis de código aberto.
fonte
Um pouco atrasado para a festa, mas aqui está uma resposta mais abrangente com exemplos:
Reagir
React é uma biblioteca de interface do usuário baseada em componente que usa um "DOM de sombra" para atualizar eficientemente o DOM com o que foi alterado, em vez de reconstruir toda a árvore do DOM para cada alteração. Foi desenvolvido inicialmente para aplicativos da Web, mas agora também pode ser usado para dispositivos móveis e 3D / vr.
Os componentes entre o React e o React Native não podem ser trocados porque o React Native mapeia para elementos nativos da interface do usuário móvel, mas a lógica comercial e o código relacionado à não renderização podem ser reutilizados.
ReactDOM
Foi inicialmente incluído na biblioteca do React, mas foi dividido quando o React estava sendo usado para outras plataformas além da web. Ele serve como ponto de entrada para o DOM e é usado em união com o React.
Exemplo:
Reagir nativo
O React Native é uma estrutura móvel multiplataforma que usa o React e se comunica entre o Javascript e seu equivalente nativo por meio de uma "ponte". Devido a isso, muita estrutura da interface do usuário precisa ser diferente ao usar o React Native. Por exemplo: ao criar uma lista, você terá grandes problemas de desempenho se tentar
map
criar a lista em vez de React NativeFlatList
. O React Native pode ser usado para criar aplicativos móveis IOS / Android, bem como para relógios inteligentes e TVs.Expo
A Expo é o principal objetivo ao iniciar um novo aplicativo React Native.
Nota: Ao usar o Expo, você pode usar apenas as APIs nativas fornecidas por eles. Todas as bibliotecas adicionais que você incluir precisarão ser javascript puro ou será necessário ejetar expo.
Mesmo exemplo usando o React Native:
Diferenças:
onClick
transformaronPress
, o React Native usa folhas de estilo para definir estilos de uma maneira mais eficiente e o React Native usa flexbox como a estrutura de layout padrão para manter as coisas responsivas.React360
Também vale mencionar que o React também pode ser usado para desenvolver aplicativos 3D / VR. A estrutura do componente é muito semelhante ao React Native. https://facebook.github.io/react-360/
fonte
O reactjs usa um react-dom e não o navegador, enquanto o react native usa o dom virtual, mas os dois usam a mesma sintaxe, ou seja, se você pode usar o reactjs, pode usar o react native. porque a maioria das bibliotecas que você usa no reactjs está disponível no react native como a navegação de reação e outras bibliotecas comuns que eles têm em comum.
fonte
<h1>
,<p>
, etc. Onde reagem nativo torna componentes vista aplicativo nativo como<View>
e<Text>
.Em resposta ao comentário do @poshest acima, aqui está uma versão nativa do React do código do Clock publicada anteriormente no React (desculpe, não foi possível comentar diretamente na seção, caso contrário, eu teria adicionado o código):
Reagir amostra de código nativo
Observe que o estilo é totalmente minha escolha e não procura replicar diretamente as tags
<h1>
e<h2>
usadas no código React.fonte
Algumas diferenças são as seguintes:
1- O React-Native é uma estrutura usada para criar aplicativos móveis, onde o ReactJS é uma biblioteca javascript que você pode usar no seu site.
2- O React-Native não usa HTML para renderizar o aplicativo enquanto o React o usa.
3- React-Native usado para desenvolver apenas aplicativos móveis, enquanto o React é usado no site e no celular.
fonte
Reagir nativo
É uma estrutura para criar aplicativos nativos usando JavaScript.
Ele é compilado com componentes de aplicativos nativos, o que possibilita a criação de aplicativos móveis nativos.
React js
Ele suporta a Web front-end e é executado em um servidor, para a criação de interfaces com o usuário e aplicativos da Web.
Também nos permite criar componentes reutilizáveis da interface do usuário.
Você pode reutilizar componentes de código no React JS, economizando muito tempo.
fonte
O React.js geralmente chamado de React ou ReactJS é uma biblioteca JavaScript responsável pela construção de uma hierarquia de componentes da interface do usuário ou, por outras palavras, responsável pela renderização dos componentes da interface do usuário. Ele fornece suporte para front-end e servidor.
O React Native é uma estrutura para criar aplicativos nativos usando JavaScript. Reagir compilações nativas a componentes de aplicativos nativos, o que possibilita a criação de aplicativos móveis nativos. No React JS, o React é a abstração básica do React DOM para a plataforma da Web, enquanto que com o React Native, o React ainda é a abstração básica, mas o React Native. Portanto, a sintaxe e o fluxo de trabalho permanecem semelhantes, mas os componentes são diferentes.
fonte