¿En qué se diferencia React Native de ReactJS?

ReactJS: es una biblioteca de JavaScript que admite tanto el front-end como el lado del servidor. Es una biblioteca de uso popular, que se centra en el desarrollo de interfaces de usuario (UI) para aplicaciones móviles y basadas en la web. Desarrollado por Facebook, se basa en el lenguaje JavaScript y, por lo tanto, también se llama ReactJS.

Pasos para crear una aplicación React:

• Paso 1: Cree una aplicación React usando el siguiente comando:

  npx create-react-app react-demo

• Paso 2: después de crear la carpeta de su proyecto, es decir, react-demo, muévase a ella con el siguiente comando:

  cd react-demo

Estructura del proyecto: Tendrá el siguiente aspecto.

import React from "react";
import logo from "./logo.svg";
import "./App.css";
  
function App() {
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>ReactJS Demo Application</p>
  
      </header>
    </div>
  );
}
  
export default App;

Paso para ejecutar la aplicación: ejecute la aplicación utilizando el siguiente comando desde el directorio raíz del proyecto:

npm start

Salida: ahora abra su navegador y vaya a http://localhost:3000/, verá la siguiente salida

React Native: React Native es un marco móvil multiplataforma que utiliza el marco ReactJS. Como sugiere el nombre, se utiliza principalmente para desarrollar aplicaciones móviles «nativas» (como Windows, iOS y Android). También desarrollado por Facebook, la principal ventaja proporcionada por React Native es que permite a los desarrolladores crear aplicaciones móviles en varias plataformas diferentes sin comprometer la experiencia del usuario final.

Pasos para crear una aplicación React Native:

• Paso 1: Abra su terminal e instale expo-cli con el siguiente comando.

  npm install -g expo-cli

• Paso 2: ahora cree un proyecto con el siguiente comando.

  expo init react-native-demo

• Paso 3: ahora ve a la carpeta de tu proyecto, es decir, react-native-demo

  cd react-native-demo

Estructura del proyecto: Tendrá el siguiente aspecto.

import React from "react";
import { StyleSheet, Text, View } from "react-native";
  
export default function App() {
  return (
    <View style={styles.container}>
      <Text style={styles.header}>React Native Demo Application</Text>
    </View>
  );
}
  
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
  header: {
    color: "#006600",
    fontSize: 22,
    fontWeight: "700",
  },
});

Paso para ejecutar la aplicación: inicie el servidor con el siguiente comando.

expo start

Producción:

Diferencias entre React y React Native: