V7 Nylo v7 đã có mặt! Xem có gì mới →
Nylo
Micro-framework cho Flutter Giấy phép MIT

Flutter
Micro-framework
Cho ứng dụng hiện đại

Nylo mang đến cho mọi dự án cùng một nền tảng vững chắc — định tuyến, trạng thái, mạng, biểu mẫu và xác thực — để bạn bắt đầu từ tính năng đầu tiên thay vì tệp đầu tiên.

Cài đặt trong một dòng
$ dart pub global activate nylo_installer
Đọc hướng dẫn cài đặt Sau đó làm theo hướng dẫn để đặt tên cho dự án của bạn.
my_app ĐÃ TẠO
lib/
app/  — model, mạng, provider
bootstrap/  — khởi động và thiết lập
config/  — giao diện, khóa, bộ giải mã
resources/
pages/  home_page.dart
widgets/
themes/
routes/  router.dart
main.dart
Mọi dự án Nylo đều có cùng cấu trúc — dự án của đồng đội bạn cũng vậy.
864 ★ trên GitHub Tương thích Dart 3 Giấy phép MIT Được xuất bản bởi nylo.dev trên pub.dev Được duy trì tích cực từ năm 2021
>_ Metro CLI

Tạo mọi thứ từ terminal

Metro tạo trang, model, controller, widget và nhiều thứ khác — được nối thẳng vào router và cấu trúc thư mục của bạn, chứ không vứt vào một góc.

17 trình tạo bao quát widget, phần nền của ứng dụng và cấu hình
Route được đăng ký tự động khi tạo mã
Cách đặt tên và vị trí tệp nhất quán trong cả nhóm
Tìm hiểu thêm về Metro
zsh — my_app
$ metro make:page HomePage
  ✓ Created lib/resources/pages/home_page.dart
$ metro make:api_service User
  ✓ Created lib/app/networking/user_api_service.dart
$ metro make:model User
  ✓ Created lib/app/models/user.dart
$ metro make:stateful_widget FavouriteWidget
app/networking/api_service.dart
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());
Kết nối mạng

Tích hợp API dễ dàng

Viết các dịch vụ API gọn gàng, dễ bảo trì với phân tích JSON tự động, xử lý lỗi và bộ chặn yêu cầu — không còn mã Dio lặp lại trong các trang của bạn.

Tìm hiểu thêm về Kết nối mạng
Khám phá

Xem nó trong đoạn mã bạn thực sự sẽ viết

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()
        ]
    );
});

Xây dựng các tuyến đường phức tạp, giao diện và trang UI cho ứng dụng Flutter của bạn.

Tìm hiểu thêm
Bước 1

Xác thực người dùng

String userToken = "eyJhbG123...";

await Auth.authenticate(data: {"token": userToken});
Bước 2

Bây giờ, khi người dùng mở ứng dụng, họ sẽ được xác thực.

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

bool isAuthenticated = await Auth.isAuthenticated();
// true
Bước 3

Nếu bạn đã thiết lập authenticatedRoute trong bộ định tuyến, trang này sẽ được hiển thị khi người dùng mở lại ứng dụng.

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

Đăng xuất người dùng

await Auth.logout();

Xác thực người dùng trong ứng dụng Flutter của bạn.

Tìm hiểu thêm
Bước 1

Tạo biểu mẫu

terminal
metro make:form RegisterForm
Bước 2

Chỉnh sửa biểu mẫu

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");
}
Bước 3

Sử dụng biểu mẫu trong widget

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

Quản lý, xác thực và gửi dữ liệu tất cả tại một nơi với Nylo Forms.

Tìm hiểu thêm
Bước 1

Tạo widget quản lý trạng thái

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}"));
  }
}
Bước 2

Use CartIcon.action("clear_cart")

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

Quản lý trạng thái mạnh mẽ cho widget trong ứng dụng Flutter của bạn.

Tìm hiểu thêm
Bước 1

Tạo sự kiện

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
        );
    }
}
Bước 2

Phát sự kiện

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

Phát sự kiện và lắng nghe chúng trong ứng dụng của bạn.

Tìm hiểu thêm

Lên lịch chạy tác vụ một lần

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

Lên lịch chạy tác vụ một lần sau một ngày cụ thể

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

Lên lịch chạy tác vụ một lần mỗi ngày

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

Lên lịch các tác vụ chạy một lần hoặc hàng ngày trong ứng dụng Flutter của bạn.

Tìm hiểu thêm
Bước 1

Tạo dịch vụ 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);
    }
}
Bước 2

Gọi API từ trang của bạn

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

Dịch vụ API tinh gọn với phân tích JSON tự động, bộ nhớ đệm và interceptor.

Tìm hiểu thêm
Bước 1

Lưu dữ liệu an toàn

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),
);
Bước 2

Đọc với ép kiểu

// 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");

Lưu trữ cục bộ an toàn với ép kiểu, hết hạn TTL và bộ sưu tập.

Tìm hiểu thêm
Bước 1

Thêm tệp ngôn ngữ của bạn

lang/en.json
{
    "welcome": "Welcome",
    "greeting": "Hello {{name}}",
    "navigation": {
        "home": "Home",
        "profile": "Profile"
    }
}
Bước 2

Dịch văn bản trong widget của bạn

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

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

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

Hỗ trợ đa ngôn ngữ với tệp JSON, tham số và RTL.

Tìm hiểu thêm
Bước 1

Tạo trung tâm điều hướng

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),
            ),
        };
    });
}
Bước 2

Chuyển đổi bố cục dễ dàng

// Bottom navigation
NavigationHubLayout.bottomNav()

// Top navigation
NavigationHubLayout.topNav()

// Journey / wizard flow
NavigationHubLayout.journey()

Xây dựng thanh điều hướng dưới, trên hoặc luồng hành trình với duy trì trạng thái.

Tìm hiểu thêm
Cộng đồng

Phát triển công khai, dùng trong sản phẩm thật

“Tôi mới làm quen với Dart và với framework của các bạn — mà tôi rất thích.”

P
Peter
Giám đốc cấp cao, Heroku Global

“Nylo là framework tốt nhất cho Flutter — nó khiến việc phát triển trở nên dễ dàng.”

@higakijin

“Cho đến nay là framework tốt nhất. Chất lượng và tính năng tuyệt vời.”

@2kulfi

“Nó khiến công việc dễ hơn và tốn ít thời gian hơn. Làm tốt lắm.”

darkreader01

“Tôi vừa khám phá ra framework này và rất ấn tượng. Cảm ơn.”

@lepresk

“Tôi thực sự thích ý tưởng của framework này.”

@Chrisvidal

“Tôi muốn cảm ơn các bạn vì công việc tuyệt vời mà các bạn đang làm.”

@youssefKadaouiAbbassi

“Chỉ muốn nói rằng tôi rất mê trang web của @nylo_dev!”

@esfoliante_txt

“Thật tuyệt vời. Làm rất tốt!”

FireflyDaniel

Ứng dụng Flutter tiếp theo của bạn bắt đầu bằng một lệnh

Miễn phí, giấy phép MIT, và bên dưới vẫn chỉ là Flutter.

$ dart pub global activate nylo_installer