> ## Documentation Index
> Fetch the complete documentation index at: https://supastack.dev/llms.txt
> Use this file to discover all available pages before exploring further.
> For the full documentation corpus in one file, fetch: https://supastack.dev/llms-full.txt

# Construye tu primera funcionalidad

Un recorrido de extremo a extremo desde una nueva pantalla hasta datos verificados por el servidor.

## Guía paso a paso para principiantes

Requisitos previos: lea las dos guías para principiantes a continuación, termine la configuración local de Mobile y abra este repositorio en su raíz en su editor. La configuración de Mobile va en `apps/mobile/.env.local`; Expo no lee el .env de la raíz. La vista previa necesita un backend accesible para datos reales.

Términos breves: un espacio de trabajo son los usuarios, datos y configuraciones separados de un equipo. El servidor es el backend confiable; Mantenga las claves del proveedor fuera del código del navegador y del teléfono. Una migración es un cambio de base de datos versionada que crea o actualiza tablas. Un modelo de IA es el motor que responde; el catálogo de modelos es la lista del servidor de ID de modelos disponibles y precios. Un proveedor es un servicio externo, como inteligencia artificial, correo electrónico o servicio de facturación. Un derecho es una concesión que permite que un espacio de trabajo utilice una función. Un webhook es un mensaje que un servicio envía al URL de otro servicio.

1. Abra `.agents/skills/add-a-mobile-screen/SKILL.md` —o pida a su agente de codificación que lo siga— y cree una pantalla pequeña, por ejemplo `apps/mobile/app/(app)/ideas.tsx` con su lógica en `apps/mobile/src/ideas/`.

2. Abra la nueva pantalla en su dispositivo a través de la vista previa en ejecución y confirme que se renderiza para un miembro con sesión iniciada.

3. Compruebe una cuenta cerrada y una cuenta de un segundo workspace: todo lo que deba permanecer privado debe volver denegado o ausente, porque el servidor hace cumplir el límite.

Para código personalizado, nombre la pantalla, los datos que muestra, quién puede verla y los errores a manejar. Dé a su agente de codificación esta tarea y pídale que lea `AGENTS.md`, `.ai/PROJECT_CONTEXT.md` y los espejos `.ai/` de los archivos que tocará; que enumere archivos y verificaciones antes de editar; y que le muestre el diff. Use valores de ejemplo; nunca pegue un secreto real.

[Antes de comenzar](https://supastack.dev/es/docs/mobile/before-you-start.md)

[Conceptos básicos de terminales](https://supastack.dev/es/docs/mobile/terminal-basics.md)

[Configuración local móvil](https://supastack.dev/es/docs/mobile/ship-in-5-minutes.md)

[Mensajes del agente y memoria del proyecto](https://supastack.dev/es/docs/mobile/agents.md)


## Crear la pantalla

Agregue un archivo de ruta bajo `apps/mobile/app/(app)/`: Expo Router convierte el archivo en una pantalla dentro de la pila con sesión iniciada. Compóngala a partir de los primitives de `apps/mobile/src/ui` (Screen, Card, Title, Detail, AppButton) para que herede el espaciado, la tipografía y los colores de la aplicación.

```
apps/mobile/app/(app)/ideas.tsx
apps/mobile/src/ideas/index.ts
apps/mobile/src/ideas/index.test.ts
```


## Leer y escribir a través del cliente tipado

Haga fetch a través de `apps/mobile/src/api/client.ts`, que adjunta la sesión almacenada a cada solicitud contra `EXPO_PUBLIC_API_URL` y devuelve errores tipados. Mantenga los payloads idénticos al contrato web: los mismos endpoints sirven a ambos clientes.

Si la pantalla lee datos del workspace, envuelva la llamada con los ayudantes de `apps/mobile/src/offline/` para que un fallo de red pueda recurrir a la copia en caché, solo en un error de red, nunca después de un error de autenticación o permisos.


## Dejar que el servidor decida la propiedad

El servidor resuelve el miembro con sesión iniciada y el workspace activo y delimita cada registro por `workspaceId`. La aplicación muestra lo que el servidor devuelve; nunca envía un id de workspace en el que el servidor deba confiar.

Si los datos que necesita no tienen endpoint, agréguelo primero en el backend: las reglas de negocio viven en el servidor. Un botón oculto en la aplicación no hace cumplir el acceso.


## Verifica el acceso y la recuperación

Compruebe un miembro con sesión iniciada, un miembro de otro workspace, una sesión cerrada y el modo avión: los datos del miembro aparecen, los datos ajenos se deniegan, un dispositivo cerrado vuelve al inicio de sesión y la copia sin conexión solo se sirve en un error de red.

[Caché de lectura sin conexión](https://supastack.dev/es/docs/mobile/offline.md)

[Lista de verificación de seguridad de Mobile](https://supastack.dev/es/docs/mobile/security.md)


## Pulir los estados

Dé a la pantalla estados de carga, vacío y error a través de los primitives compartidos, agregue cada nueva cadena a los cuatro catálogos i18n y conecte la ruta a la navegación de inicio o configuración para que un miembro pueda encontrarla.


## Siguiente

[Construye con un agente de código](https://supastack.dev/es/docs/mobile/agents.md)
