# Installation

<div id="install"></div>

Tres comandos te llevan de una carpeta vacía a una aplicación Flutter en ejecución, con enrutamiento, red, temas y generación de código ya configurados.

<div class="ny-doc-strip">
<span class="ny-doc-strip-label">Antes de empezar</span>
<span class="ny-doc-strip-item">Flutter SDK instalado</span>
<span class="ny-doc-strip-dot"></span>
<span class="ny-doc-strip-item">Dart 3</span>
<span class="ny-doc-strip-dot"></span>
<a href="/es/docs/7.x/requirements">Requisitos completos →</a>
</div>

## Instalar

Ejecuta estos comandos en orden. Puedes volver a ejecutar cualquiera de ellos de forma segura.

<div class="ny-doc-steps">
<div class="ny-doc-step">
<span class="ny-doc-step-num">1</span>
<h3 class="ny-doc-step-title">Instalar Nylo CLI globalmente</h3>

Instala el comando `nylo` en tu sistema.

``` bash
dart pub global activate nylo_installer
```

</div>

<div class="ny-doc-step">
<span class="ny-doc-step-num">2</span>
<h3 class="ny-doc-step-title">Crear un nuevo proyecto</h3>

Este comando clona la plantilla de Nylo, configura el proyecto con el nombre de tu aplicación e instala todas las dependencias automáticamente.

``` bash
nylo new my_app
```

</div>

<div class="ny-doc-step">
<span class="ny-doc-step-num">3</span>
<h3 class="ny-doc-step-title">Configurar el alias de Metro</h3>

Esto configura el comando `metro` para tu proyecto, permitiéndote usar los comandos de Metro CLI sin la sintaxis completa de `dart run`.

``` bash
cd my_app
nylo init
```

Reinicia tu terminal después, o ejecuta el comando `source` que `nylo init` imprime.

</div>
</div>

<div class="ny-doc-panel">
<div class="ny-doc-panel-head">
<img src="https://nylo.dev/images/nylo_logo.png" alt="" class="ny-mark h-[16px]">
<span>Qué obtienes</span>
</div>
<div class="ny-doc-panel-body">
<div class="ny-doc-panel-grid">
<div class="ny-doc-panel-item">Enrutamiento y navegación preconfigurados</div>
<div class="ny-doc-panel-item">Plantilla de servicio API</div>
<div class="ny-doc-panel-item">Configuración de temas y localización</div>
<div class="ny-doc-panel-item">Metro CLI para generación de código</div>
</div>
</div>
</div>


<div id="running-the-project"></div>

## Ejecutar el proyecto

Los proyectos de Nylo se ejecutan como cualquier aplicación estándar de Flutter.

<div class="ny-doc-tabs" x-data="{ tab: 'Terminal' }">
<div class="ny-doc-tabbar" role="tablist">
<button type="button" role="tab" class="ny-doc-tab" @click="tab = 'Terminal'" :class="tab === 'Terminal' ? 'is-active' : ''" :aria-selected="tab === 'Terminal'">Terminal</button>
<button type="button" role="tab" class="ny-doc-tab" @click="tab = 'Android Studio'" :class="tab === 'Android Studio' ? 'is-active' : ''" :aria-selected="tab === 'Android Studio'">Android Studio</button>
<button type="button" role="tab" class="ny-doc-tab" @click="tab = 'VS Code'" :class="tab === 'VS Code' ? 'is-active' : ''" :aria-selected="tab === 'VS Code'">VS Code</button>
</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === 'Terminal'" x-cloak>

``` bash
flutter run
```

Si la compilación es exitosa, la aplicación mostrará la pantalla de inicio predeterminada de Nylo.

</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === 'Android Studio'" x-cloak>

Abre la carpeta del proyecto, elige un dispositivo en el selector de destino y pulsa **Run**.

<a href="https://docs.flutter.dev/tools/android-studio#running-and-debugging" target="_BLANK">Documentación de Flutter: ejecución y depuración ↗</a>

</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === 'VS Code'" x-cloak>

Abre la carpeta del proyecto y ejecuta **Debug: Start Without Debugging** desde la paleta de comandos.

<a href="https://docs.flutter.dev/tools/vs-code#run-app-without-breakpoints" target="_BLANK">Documentación de Flutter: ejecutar sin puntos de interrupción ↗</a>

</div>

</div>


<div id="metro-cli"></div>

## Metro CLI

Metro genera archivos del proyecto por ti. Ejecútalo sin argumentos para ver el menú o llama directamente a un comando.

``` plaintext
$ metro

Metro - Nylo's Companion to Build Flutter apps by Anthony Gordon

Usage:
    command [options] [arguments]

Options
    -h

All commands:

[Widget Commands]
  make:page
  make:stateful_widget
  make:stateless_widget
  make:state_managed_widget
  make:navigation_hub
  make:journey_widget
  make:bottom_sheet_modal
  make:button
  make:form

[Helper Commands]
  make:model
  make:provider
  make:api_service
  make:controller
  make:event
  make:route_guard
  make:config
  make:interceptor
  make:command
  make:env
```

### Referencia de comandos

Cada comando recibe un nombre, por ejemplo, `metro make:page settings_page`

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Comandos de widgets</div>
<div class="ny-doc-command">
<code>metro make:page</code>
<span>Crear una nueva página</span>
</div>
<div class="ny-doc-command">
<code>metro make:stateful_widget</code>
<span>Crear un widget con estado</span>
</div>
<div class="ny-doc-command">
<code>metro make:stateless_widget</code>
<span>Crear un widget sin estado</span>
</div>
<div class="ny-doc-command">
<code>metro make:state_managed_widget</code>
<span>Crear un widget con gestión de estado</span>
</div>
<div class="ny-doc-command">
<code>metro make:navigation_hub</code>
<span>Crear un hub de navegación (nav inferior)</span>
</div>
<div class="ny-doc-command">
<code>metro make:journey_widget</code>
<span>Crear un widget de recorrido para hub de navegación</span>
</div>
<div class="ny-doc-command">
<code>metro make:bottom_sheet_modal</code>
<span>Crear un modal de hoja inferior</span>
</div>
<div class="ny-doc-command">
<code>metro make:button</code>
<span>Crear un widget de botón personalizado</span>
</div>
<div class="ny-doc-command">
<code>metro make:form</code>
<span>Crear un formulario con validación</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Comandos auxiliares</div>
<div class="ny-doc-command">
<code>metro make:model</code>
<span>Crear una clase de modelo</span>
</div>
<div class="ny-doc-command">
<code>metro make:provider</code>
<span>Crear un proveedor</span>
</div>
<div class="ny-doc-command">
<code>metro make:api_service</code>
<span>Crear un servicio API</span>
</div>
<div class="ny-doc-command">
<code>metro make:controller</code>
<span>Crear un controlador</span>
</div>
<div class="ny-doc-command">
<code>metro make:event</code>
<span>Crear un evento</span>
</div>
<div class="ny-doc-command">
<code>metro make:route_guard</code>
<span>Crear un guard de ruta</span>
</div>
<div class="ny-doc-command">
<code>metro make:config</code>
<span>Crear un archivo de configuración</span>
</div>
<div class="ny-doc-command">
<code>metro make:interceptor</code>
<span>Crear un interceptor de red</span>
</div>
<div class="ny-doc-command">
<code>metro make:command</code>
<span>Crear un comando personalizado de Metro</span>
</div>
<div class="ny-doc-command">
<code>metro make:env</code>
<span>Generar configuración de entorno desde .env</span>
</div>
</div>

### Ejemplo de uso

``` bash
# Crear una nueva página
metro make:page settings_page

# Crear un modelo
metro make:model User

# Crear un servicio API
metro make:api_service user_api_service
```


<div id="nylo-cli"></div>

## Nylo CLI

<!-- uncertain: la etiqueta "Requires" del x-doc-strip no tiene una traducción establecida en esta locale -->
<div class="ny-doc-strip">
<span class="ny-doc-strip-label">Requiere</span>
<span class="ny-doc-strip-item">nylo_installer 1.8.0+</span>
<span class="ny-doc-strip-dot"></span>
<a href="#nylo-self-update">Actualizar la CLI →</a>
</div>

El comando `nylo` del paso 1 hace más que crear proyectos. Ejecútalo desde el directorio de tu proyecto para limpiar builds, actualizar los pods de iOS, ejecutar pruebas y verificar tus traducciones.

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Comandos de proyecto</div>
<div class="ny-doc-command">
<code>nylo new</code>
<span>Crear un nuevo proyecto</span>
</div>
<div class="ny-doc-command">
<code>nylo init</code>
<span>Configurar el alias de metro en tu shell</span>
</div>
<div class="ny-doc-command">
<code>nylo clean</code>
<span>Ejecutar flutter clean y flutter pub get</span>
</div>
<div class="ny-doc-command">
<code>nylo ios:pod-refresh</code>
<span>Reinstalar tus pods de iOS</span>
</div>
<div class="ny-doc-command">
<code>nylo metro</code>
<span>Ejecutar un comando de Metro sin el alias</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Pruebas y traducciones</div>
<div class="ny-doc-command">
<code>nylo test</code>
<span>Formatear y ejecutar tus pruebas</span>
</div>
<div class="ny-doc-command">
<code>nylo locale:find-untranslated</code>
<span>Encontrar texto que no está envuelto en .tr()</span>
</div>
<div class="ny-doc-command">
<code>nylo locale:check-missing-keys</code>
<span>Encontrar claves que faltan en tus archivos de idioma</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">La CLI en sí misma</div>
<div class="ny-doc-command">
<code>nylo self-update</code>
<span>Actualizar nylo a la última versión</span>
</div>
<div class="ny-doc-command">
<code>nylo --version</code>
<span>Mostrar la versión instalada</span>
</div>
</div>

Los comandos que aceptan opciones las listan con `-h`, por ejemplo `nylo test -h`. Las pruebas se explican en [Ejecutar pruebas](/docs/7.x/testing#running-tests), y los comandos `locale:` en [Auditar traducciones](/docs/7.x/localization#auditing-translations).

<div id="nylo-clean"></div>

### Limpiar un proyecto

`nylo clean` ejecuta `flutter clean` y luego `flutter pub get`. Agrega un flag de plataforma cuando una limpieza normal no sea suficiente:

``` bash
# flutter clean, luego flutter pub get
nylo clean

# También elimina ios/Pods, ios/.symlinks y ios/Podfile.lock, luego ejecuta pod install --repo-update
nylo clean --ios

# También ejecuta gradlew clean en android/
nylo clean --android

# Ambas cosas anteriores
nylo clean --all
```

Si un proyecto no tiene carpeta `ios/` o `android/`, esa plataforma se omite con una advertencia. `pod install` solo se ejecuta en macOS.

<div id="nylo-ios-pod-refresh"></div>

### Actualizar los pods de iOS

Cuando CocoaPods se desincroniza, `nylo ios:pod-refresh` elimina `ios/Pods`, `ios/.symlinks` y `ios/Podfile.lock`, y luego ejecuta `pod install --repo-update` en la carpeta `ios/`:

``` bash
nylo ios:pod-refresh
```

Ejecútalo desde la raíz de tu proyecto en macOS. A diferencia de `nylo clean --ios`, no ejecuta `flutter clean` ni `flutter pub get`.

<div id="nylo-metro"></div>

### Ejecutar Metro sin el alias

`nylo metro` pasa todo lo que sigue a Metro (`dart run nylo_framework:main`). Úsalo antes de haber ejecutado `nylo init`, o en Windows, donde `nylo init` no puede agregar el alias `metro` por ti:

``` bash
nylo metro make:page settings_page
nylo metro make:model User
```

<div id="nylo-self-update"></div>

### Actualizar la CLI

``` bash
nylo self-update
```

Esto verifica pub.dev y reinstala `nylo_installer` si hay una versión más reciente disponible. Al finalizar un comando, `nylo` también te avisa cuando hay una actualización disponible. Permanece en silencio cuando la salida no va a una terminal, para que el aviso nunca termine en logs de CI o en informes redirigidos.

Para ver qué versión tienes instalada:

``` bash
nylo --version
```