Instalación

Configuraremos Rozenite en tu proyecto React Native.

Instalación Base

# npm
npm install @rozenite/core

# yarn
yarn add @rozenite/core

# bun
bun add @rozenite/core

Configuración en Expo

// app/_layout.tsx o App.tsx
import { RozeniteProvider } from '@rozenite/core';

export default function RootLayout() {
  return (
    <RozeniteProvider>
      {/* Tu app */}
    </RozeniteProvider>
  );
}

Configuración en Bare React Native

// index.js
import { RozeniteProvider } from '@rozenite/core';
import { AppRegistry } from 'react-native';
import App from './App';

function Main() {
  return (
    <RozeniteProvider>
      <App />
    </RozeniteProvider>
  );
}

AppRegistry.registerComponent('MyApp', () => Main);

Instalar Plugins

# Plugin de Network
npm install @rozenite/network

# Plugin de Storage
npm install @rozenite/storage

# Plugin de Performance
npm install @rozenite/performance

Registrar Plugins

import { RozeniteProvider } from '@rozenite/core';
import { NetworkPlugin } from '@rozenite/network';
import { StoragePlugin } from '@rozenite/storage';

export default function App() {
  return (
    <RozeniteProvider
      plugins={[
        NetworkPlugin,
        StoragePlugin,
      ]}
    >
      {/* Tu app */}
    </RozeniteProvider>
  );
}

Ejercicio Práctico

Objetivo

Instalar Rozenite en un proyecto Expo existente.

Pasos

1. Crea un proyecto Expo: npx create-expo-app@latest
2. Instala Rozenite core
3. Envuelve tu app con RozeniteProvider
4. Verifica que DevTools muestra Rozenite

npx create-expo-app@latest mi-app
cd mi-app
npm install @rozenite/core

// app/_layout.tsx
import { RozeniteProvider } from '@rozenite/core';
import { Stack } from 'expo-router';

export default function RootLayout() {
  return (
    <RozeniteProvider>
      <Stack />
    </RozeniteProvider>
  );
}

Criterios de Éxito

• Rozenite instalado
• Provider configurado
• App ejecuta sin errores

Navegación

• ← Anterior: Introducción
• Índice del Tutorial
• Siguiente: Primeros Pasos →