Saltar al contenido principal

Empezar sin un Framework

Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Platform support
Android
iOS
macOS
TV
watchOS
Web
Windows
visionOS

Si tienes restricciones que no son bien atendidas por un Framework, o prefieres escribir tu propio Framework, puedes crear una aplicación de React Native sin usar un Framework.

Para hacerlo, primero necesitarás configurar tu entorno. Una vez configurado, continúa con los pasos a continuación para crear una aplicación y comenzar a desarrollar.

Paso 1: Crear una nueva aplicación​

Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

advertencia

Si instalaste previamente el paquete global react-native-cli, desinstálalo ya que podría causar problemas inesperados:

shell
npm uninstall -g react-native-cli @react-native-community/cli

Puedes usar React Native Community CLI para generar un nuevo proyecto. Vamos a crear un nuevo proyecto de React Native llamado "AwesomeProject":

shell
npx @react-native-community/cli@latest init AwesomeProject

Esto no es necesario si estás integrando React Native en una aplicación existente, si has instalado Expo en tu proyecto, o si estás agregando soporte para Android a un proyecto existente de React Native (consulta Integración con aplicaciones existentes). También puedes usar una CLI de terceros para configurar tu aplicación de React Native, como Ignite CLI.

información

Si tienes problemas con iOS, intenta reinstalar las dependencias ejecutando:

  1. cd ios para navegar a la carpeta ios.
  2. bundle install para instalar Bundler
  3. bundle exec pod install para instalar las dependencias de iOS gestionadas por CocoaPods.

[Opcional] Usar una versión específica o plantilla​

Si deseas iniciar un nuevo proyecto con una versión específica de React Native, puedes usar el argumento --version:

shell
npx @react-native-community/cli@X.XX.X init AwesomeProject --version X.XX.X

También puedes iniciar un proyecto con una plantilla personalizada de React Native usando el argumento --template, lee más aquí.

Paso 2: Iniciar Metro​

Metro es la herramienta de compilación de JavaScript para React Native. Para iniciar el servidor de desarrollo de Metro, ejecuta lo siguiente desde la carpeta de tu proyecto:

shell
npm start
nota

Si estás familiarizado con el desarrollo web, Metro es similar a empaquetadores como Vite y webpack, pero está diseñado específicamente para React Native. Por ejemplo, Metro usa Babel para transformar sintaxis como JSX en JavaScript ejecutable.

Paso 3: Iniciar tu aplicación​

Deja que Metro Bundler se ejecute en su propia terminal. Abre una nueva terminal dentro de la carpeta de tu proyecto de React Native. Ejecuta lo siguiente:

shell
npm run android

Si todo está configurado correctamente, deberías ver tu nueva aplicación ejecutándose en tu emulador de Android en breve.

Esta es una forma de ejecutar tu aplicación; también puedes ejecutarla directamente desde Android Studio.

consejo

Si no puedes hacer que esto funcione, consulta la página de Solución de problemas.

Paso 4: Modificar tu aplicación​

Ahora que has ejecutado la aplicación exitosamente, modifiquémosla.

  • Abre App.tsx en tu editor de texto preferido y edita algunas líneas.

  • Presiona la tecla R dos veces o selecciona Reload en el Menú de desarrollo (Ctrl + M) para ver tus cambios.

¡Eso es todo!​

¡Felicidades! Has ejecutado y modificado exitosamente tu primera aplicación básica de React Native.

./gradlew :app:assembleRelease