Flutter
Mikro-framework
Modern Uygulamalar İçin

Flutter uygulamaları oluşturmak için sağlam bir temel. Yönlendirme, durum yönetimi, ağ işlemleri ve daha fazlası — hepsi zarif bir pakette.

Başlayın

Keşfet

Özellikler

İnşa etmek için ihtiyacınız olan her şey

Nylo, güvenle üretime hazır Flutter uygulamaları oluşturmak için ihtiyacınız olan tüm araçları sağlar.

Yönlendirme

Rota koruyucuları, parametreler ve derin bağlantı desteği ile basit, bildirimsel yönlendirme.

Durum Yönetimi

Kontrolörler ve kolay durum kalıcılığı ile yerleşik reaktif durum yönetimi.

Ağ İşlemleri

Otomatik model serileştirme ve interceptor'lar ile zarif API hizmet sınıfları.

Formlar

Doğrulama, dönüştürme ve otomatik veri bağlama ile güçlü form işleme.

Kimlik Doğrulama

Rota koruyucuları, token depolama ve oturum yönetimi ile güvenli kimlik doğrulama.

Metro CLI

Güçlü CLI komutları ile sayfalar, modeller, kontrolörler ve daha fazlasını oluşturun.

Tüm özellikleri keşfedin

Metro CLI

Terminalden her şeyi oluşturun

Metro, tek bir komutla sayfalar, modeller, kontrolörler, widget'lar ve daha fazlasını iskeletlemenize yardımcı olan Nylo'nun CLI aracıdır.

Metro hakkında daha fazla bilgi edinin

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

Ağ İşlemleri

Zahmetsiz API entegrasyonu

Otomatik JSON ayrıştırma, hata işleme ve istek interceptor'ları ile temiz, bakımı kolay API hizmetleri yazın.

Ağ İşlemleri hakkında daha fazla bilgi edinin

Keşfet

Oluşturmak için güçlü araçlar

Bir sonraki Flutter uygulamanızı oluşturmak için ihtiyacınız olan her şey

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

Flutter uygulamanız için karmaşık rotalar, arayüzler ve UI sayfaları oluşturun.

Daha fazla bilgi

Rota Ekleme Sayfalara gitme Rota Koruyucuları Derin bağlantı

Adım 1

Kullanıcı kimliğini doğrula

String userToken = "eyJhbG123...";

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

Adım 2

Artık kullanıcınız uygulamayı açtığında kimliği doğrulanmış olacak.

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

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

Adım 3

Router'ınızda authenticatedRoute ayarladıysanız, kullanıcı uygulamayı tekrar açtığında bu sayfa gösterilecektir.

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

Kullanıcıyı çıkış yaptır

await Auth.logout();

Flutter uygulamanızda kullanıcıları doğrulayın.

Daha fazla bilgi

Authenticated Route Authenticating Users Retrieving Auth Data Çıkış

Adım 1

Form Oluştur

terminal

metro make:form RegisterForm

Adım 2

Formunuzu değiştirin

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

Adım 3

Formunuzu bir widget'ta kullanın

register_page.dart

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

Nylo Forms ile verileri tek bir yerde yönetin, doğrulayın ve gönderin.

Daha fazla bilgi

Doğrulama Managing Data Field Styling Initial Data

Adım 1

Durum yönetimli widget oluştur

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

Adım 2

Use CartIcon.action("clear_cart")

another widget

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

Flutter uygulamanızdaki widget'lar için güçlü durum yönetimi.

Daha fazla bilgi

Yaşam Döngüsü Durum Eylemleri

Adım 1

Etkinliğinizi oluşturun

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

Adım 2

Etkinliği gönderin

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

Uygulamanızda etkinlikleri gönderin ve dinleyin.

Daha fazla bilgi

Etkinlik Gönderme Etkinlikleri Dinleme

Bir görevi bir kez çalıştırmak için zamanla

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

Belirli bir tarihten sonra bir kez çalıştırmak için görevi zamanla

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

Günde bir kez çalıştırmak için görevi zamanla

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

Flutter uygulamanızda görevleri bir kez veya günlük çalıştırmak için zamanlayın.

Daha fazla bilgi

Tarihten Sonra Bir Kez Zamanla Günlük Bir Kez Zamanlama

Adım 1

API Servisi Oluşturun

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

Adım 2

Sayfanızdan API'yi çağırın

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

Otomatik JSON ayrıştırma, önbellekleme ve interceptor'lar ile zarif API servisleri.

Daha fazla bilgi

GET İstekleri Interceptor'lar Morphing JSON Önbellekleme

Adım 1

Verileri güvenle kaydedin

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),
);

Adım 2

Tip dönüşümü ile okuyun

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

Tip dönüşümü, TTL süresi ve koleksiyonlar ile güvenli yerel depolama.

Daha fazla bilgi

Veri Kaydet Veri Oku Koleksiyonlar Sırt Çantası

Adım 1

Dil dosyalarınızı ekleyin

lang/en.json

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

Adım 2

Widget'larınızdaki metni çevirin

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

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

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

JSON dosyaları, argümanlar ve RTL ile çoklu dil desteği.

Daha fazla bilgi

Çeviriler Argümanlar Dil Değiştirme RTL Desteği

Adım 1

Navigasyon Hub'ı Oluşturun

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),
            ),
        };
    });
}

Adım 2

Düzenleri kolayca değiştirin

// Bottom navigation
NavigationHubLayout.bottomNav()

// Top navigation
NavigationHubLayout.topNav()

// Journey / wizard flow
NavigationHubLayout.journey()

Durum koruması ile alt navigasyon, üst navigasyon veya yolculuk akışları oluşturun.

Daha fazla bilgi

Alt Navigasyon Üst Navigasyon Yolculuk Akışı Rozetler

Topluluk tarafından seviliyor

Geliştiriciler ne diyor Nylo Website

Tartışmaya katılı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

Flutter Mikro-framework Modern Uygulamalar İçin

İnşa etmek için ihtiyacınız olan her şey

Yönlendirme

Durum Yönetimi

Ağ İşlemleri

Formlar

Kimlik Doğrulama

Metro CLI

Terminalden her şeyi oluşturun

Zahmetsiz API entegrasyonu

Oluşturmak için güçlü araçlar

Topluluk tarafından seviliyor

Flutter
Mikro-framework
Modern Uygulamalar İçin