El Flutter
Micro-framework
Para Apps Modernas

Una base sólida para construir aplicaciones Flutter. Enrutamiento, gestión de estado, redes y más — todo en un paquete elegante.

Comenzar

Explorar

Características

Todo lo que necesitas para construir

Nylo proporciona todas las herramientas que necesitas para crear aplicaciones Flutter listas para producción con confianza.

Enrutamiento

Enrutamiento simple y declarativo con guardias de ruta, parámetros y soporte de deep linking.

Gestión de estado

Gestión de estado reactiva integrada con controladores y persistencia de estado sencilla.

Redes

Clases de servicios API elegantes con serialización automática de modelos e interceptores.

Formularios

Manejo potente de formularios con validación, casting y enlace de datos automático.

Autenticación

Autenticación segura con guardias de ruta, almacenamiento de tokens y gestión de sesiones.

Metro CLI

Genera páginas, modelos, controladores y más con potentes comandos CLI.

Explorar todas las características

Metro CLI

Crea cualquier cosa desde la terminal

Metro es la herramienta CLI de Nylo que te ayuda a generar páginas, modelos, controladores, widgets y más con un solo comando.

Más información sobre Metro

metro make:page HomePage
# Creates a new page called HomePage

metro make:api_service User
# Creates a new API Service called UserApiService

metro make:model User
# Creates a new model called User

metro make:stateful_widget FavouriteWidget
# Creates a new stateful widget called FavouriteWidget

class ApiService extends NyApiService {
  @override
  String get baseUrl => "https://api.example.com/v1";

  Future<List<Post>> posts() async {
    return await network(
      request: (request) => request.get("/posts"),
    );
  }
}

// Usage in your page
final posts = await api<ApiService>((request) => request.posts());

Redes

Integración de API sin esfuerzo

Escribe servicios API limpios y mantenibles con análisis JSON automático, manejo de errores e interceptores de peticiones.

Más información sobre Redes

Explorar

Herramientas potentes para crear

Todo lo que necesitas para construir tu próxima aplicación Flutter

routes/router.dart

appRouter() => nyRoutes((router) {
    router.add(HomePage.path).initialRoute();

    router.add(DiscoverPage.path);

    router.add(LoginPage.path, 
        transitionType: TransitionType.bottomToTop());

    router.add(ProfilePage.path,
        routeGuard: [
            AuthGuard()
        ]
    );
});

Construye rutas complejas, interfaces y páginas de UI para tu aplicación Flutter.

Más información

Agregar rutas Navegar a páginas Guardias de ruta Enlaces profundos

Paso 1

Autenticar un usuario

String userToken = "eyJhbG123...";

await Auth.authenticate(data: {"token": userToken});

Paso 2

Ahora, cuando tu usuario abra la aplicación estará autenticado.

final userData = Auth.data();
// {"token": "eyJhbG123..."}

bool isAuthenticated = await Auth.isAuthenticated();
// true

Paso 3

Si has configurado una authenticatedRoute en tu enrutador, se mostrará esta página cuando el usuario abra la aplicación nuevamente.

routes/router.dart

appRouter() => nyRoutes((router) {
    ...
    router.add(LandingPage.path).initialRoute();

    router.add(DashboardPage.path).authenticatedRoute();
    // overrides the initial route when a user is authenticated

Cerrar sesión del usuario

await Auth.logout();

Autentica usuarios en tu aplicación Flutter.

Más información

Authenticated Route Authenticating Users Retrieving Auth Data Cerrar sesión

Paso 1

Crear un formulario

terminal

metro make:form RegisterForm

Paso 2

Modificar tu formulario

app/forms/register_form.dart

class RegisterForm extends NyFormWidget {

    RegisterForm({super.key, super.submitButton, super.onSubmit, super.onFailure});

    // Add your fields here
    @override
    fields() => [
        Field.capitalizeWords("name",
            label: "Name",
            validator: FormValidator.notEmpty(),
        ),
        Field.email("email_address",
            label: "Email",
            validator: FormValidator.email()
        ),
        Field.password("password",
            label: "Password",
            validator: FormValidator.password(),
        ),
    ];

    static NyFormActions get actions => const NyFormActions("RegisterForm");
}

Paso 3

Usar tu formulario en un widget

register_page.dart

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: RegisterForm(
      submitButton: Button.primary(text: "Submit"),
      onSubmit: (data) {
        printInfo(data);
      },
    ),
  );
}

Gestiona, valida y envía datos en un solo lugar con Nylo Forms.

Más información

Validación Managing Data Field Styling Initial Data

Paso 1

Crear un widget con gestión de estado

terminal

metro make:stateful_widget CartIcon

resources/cart_icon_widget.dart

class _CartIconState extends NyState<CartIcon> {
  ...

  @override
  Map<String, Function> get stateActions => {
    "clear_cart": () {
      _items = 0;
    },
    ...
  };

  @override
  Widget view(BuildContext context) {
    return Container(child: Text("Items in cart: ${_items}"));
  }
}

Paso 2

Use CartIcon.action("clear_cart")

another widget

Button.primary(text: "Add to cart",
    onPressed: () {
      CartIcon.action("clear_cart");
    }
)

Gestión de estado potente para widgets en tu aplicación Flutter.

Más información

Ciclo de vida Acciones de estado

Paso 1

Crear tu evento

terminal

metro make:event Logout

app/events/logout_event.dart

class LogoutEvent implements NyEvent {
    @override
    final listeners = {
        DefaultListener: DefaultListener(),
    };
}

class DefaultListener extends NyListener {
    @override
    handle(dynamic event) async {

        // logout user
        await Auth.logout();

        // redirect to home page
        routeTo(HomePage.path,
            navigationType: NavigationType.pushAndForgetAll
        );
    }
}

Paso 2

Despachar el evento

MaterialButton(child: Text("Logout"),
    onPressed: () {
        event<LogoutEvent>();
    },
)

Despacha eventos y escúchalos en tu aplicación.

Más información

Despacho de eventos Escucha de eventos

Programar una tarea para ejecutar una vez

Nylo.scheduleOnce("onboarding_info", () {
    print("Perform code here to run once");
});

Programar una tarea para ejecutar una vez después de una fecha específica

Nylo.scheduleOnceAfterDate("app_review_rating", () {
    print("Perform code to run once after DateTime(2025, 04, 10)");
}, date: DateTime(2025, 04, 10));

Programar una tarea para ejecutar una vez al día

Nylo.scheduleOnceDaily("free_daily_coins", () {
    print("Perform code to run once daily");
});

Programa tareas para ejecutar una vez o diariamente en tu aplicación Flutter.

Más información

Programar una vez después de una fecha Programación diaria

Paso 1

Crear un servicio API

terminal

metro make:api_service User

app/networking/user_api_service.dart

class UserApiService extends NyApiService {
    @override
    String get baseUrl => getEnv("API_BASE_URL");

    Future<User?> fetchUser(int id) async {
        return await get<User>(
            "/users/$id",
            queryParameters: {"include": "profile"},
        );
    }

    Future<User?> createUser(Map<String, dynamic> data) async {
        return await post<User>("/users", data: data);
    }
}

Paso 2

Llamar a la API desde tu página

User? user = await api<UserApiService>(
    (request) => request.fetchUser(1),
);

Servicios API elegantes con análisis JSON automático, caché e interceptores.

Más información

Peticiones GET Interceptores Morphing JSON Caché

Paso 1

Guardar datos de forma segura

saving_data.dart

// Save values to secure storage
await NyStorage.save("coins", 100);
await NyStorage.save("username", "Anthony");
await NyStorage.save("isPremium", true);

// Save with TTL (auto-expires)
await NyStorage.save("session", "abc123",
    expiry: Duration(hours: 1),
);

Paso 2

Leer con conversión de tipos

// Automatic type casting
String? username = await NyStorage.read("username");
int? coins = await NyStorage.read<int>("coins");
bool? isPremium = await NyStorage.read<bool>("isPremium");

// Delete a value
await NyStorage.delete("coins");

Almacenamiento local seguro con conversión de tipos, expiración TTL y colecciones.

Más información

Guardar datos Leer datos Colecciones Mochila

Paso 1

Agrega tus archivos de idioma

lang/en.json

{
    "welcome": "Welcome",
    "greeting": "Hello {{name}}",
    "navigation": {
        "home": "Home",
        "profile": "Profile"
    }
}

Paso 2

Traduce texto en tus widgets

// Simple translation
Text("welcome".tr())  // "Welcome"

// With arguments
Text("greeting".tr(arguments: {"name": "Anthony"}))
// "Hello Anthony"

// Nested keys
Text("navigation.home".tr())  // "Home"

Soporte multilingüe con archivos JSON, argumentos y RTL.

Más información

Traducciones Argumentos Cambio de idioma Soporte RTL

Paso 1

Crear un hub de navegación

terminal

metro make:navigation_hub base

resources/pages/base_navigation_hub.dart

class _BaseNavigationHubState extends NavigationHub<BaseNavigationHub> {

    NavigationHubLayout? layout = NavigationHubLayout.bottomNav();

    @override
    bool get maintainState => true;

    _BaseNavigationHubState() : super(() async {
        return {
            0: NavigationTab(
                title: "Home",
                page: HomeTab(),
                icon: Icon(Icons.home),
            ),
            1: NavigationTab(
                title: "Settings",
                page: SettingsTab(),
                icon: Icon(Icons.settings),
            ),
        };
    });
}

Paso 2

Cambia de diseño fácilmente

// Bottom navigation
NavigationHubLayout.bottomNav()

// Top navigation
NavigationHubLayout.topNav()

// Journey / wizard flow
NavigationHubLayout.journey()

Construye navegación inferior, superior o flujos de recorrido con mantenimiento de estado.

Más información

Navegación inferior Navegación superior Flujo de recorrido Insignias

Amado por la comunidad

Lo que dicen los desarrolladores sobre Nylo Website

Únete a la discusión

I'm new to Dart and new to your framework (which I love)

Peter Senior Director of Heroku Global

I wanted to thank you guys for the great job you are doing.

@youssefKadaouiAbbassi

Just to say that I am in love with @nylo_dev's website!! Definitely gonna explore it!

@esfoliante_txt

Really love the concept of this framework

@Chrisvidal

Nylo is the best framework for flutter, which makes developing easy

@higakijin

This is incredible. Very well done!

FireflyDaniel

Very nice Framework! Thank you so much!

@ChaoChao2509

I just discovered this framework and I'm very impressed. Thank you

@lepresk

Great work on Nylo

@dylandamsma

This is by far the best framework out there. Amazing quality and features. Thanks so much.

@2kulfi

It's interesting and very amazing. It makes the work more easier and less time consuming. Great work. Thank you

darkreader01

Salut. Je viens juste de découvrir votre outils et je le trouve vraiment super. Une belle découverte pour moi 👌🤌

ojean-01

El Flutter Micro-framework Para Apps Modernas

Todo lo que necesitas para construir

Enrutamiento

Gestión de estado

Redes

Formularios

Autenticación

Metro CLI

Crea cualquier cosa desde la terminal

Integración de API sin esfuerzo

Herramientas potentes para crear

Amado por la comunidad

El Flutter
Micro-framework
Para Apps Modernas