Flutter
माइक्रो-फ्रेमवर्क
आधुनिक ऐप्स के लिए

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

नेटवर्किंग

आसान API इंटीग्रेशन

ऑटोमैटिक JSON पार्सिंग, एरर हैंडलिंग और रिक्वेस्ट इंटरसेप्टर्स के साथ साफ, मेंटेन करने योग्य API सर्विसेज लिखें।

नेटवर्किंग के बारे में और जानें

खोजें

बनाने के लिए शक्तिशाली टूल्स

अपना अगला 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()
        ]
    );
});

अपने Flutter एप्लिकेशन के लिए जटिल रूट, इंटरफेस और UI पेज बनाएं।

अधिक जानें

रूट जोड़ना पेजों पर नेविगेट करना रूट गार्ड्स डीप लिंकिंग

चरण 1

उपयोगकर्ता को प्रमाणित करें

String userToken = "eyJhbG123...";

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

चरण 2

अब, जब आपका उपयोगकर्ता ऐप खोलेगा तो वे प्रमाणित होंगे।

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

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

चरण 3

यदि आपने अपने राउटर में authenticatedRoute सेट किया है, तो जब उपयोगकर्ता फिर से ऐप खोलेगा तो यह पेज प्रस्तुत होगा।

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

उपयोगकर्ता को लॉगआउट करें

await Auth.logout();

अपने Flutter एप्लिकेशन में उपयोगकर्ताओं को प्रमाणित करें।

अधिक जानें

Authenticated Route Authenticating Users Retrieving Auth Data लॉगआउट

चरण 1

फॉर्म बनाएं

terminal

metro make:form RegisterForm

चरण 2

अपना फॉर्म संशोधित करें

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

चरण 3

विजेट में अपना फॉर्म उपयोग करें

register_page.dart

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

Nylo Forms के साथ एक ही स्थान पर डेटा प्रबंधित, मान्य और सबमिट करें।

अधिक जानें

सत्यापन Managing Data Field Styling Initial Data

चरण 1

स्टेट मैनेज्ड विजेट बनाएं

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

चरण 2

Use CartIcon.action("clear_cart")

another widget

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

आपके Flutter एप्लिकेशन में विजेट्स के लिए शक्तिशाली स्टेट मैनेजमेंट।

अधिक जानें

जीवनचक्र स्टेट एक्शन

चरण 1

अपना इवेंट बनाएं

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

चरण 2

इवेंट डिस्पैच करें

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

अपने एप्लिकेशन में इवेंट डिस्पैच करें और उन्हें सुनें।

अधिक जानें

इवेंट डिस्पैचिंग इवेंट सुनना

एक बार चलाने के लिए टास्क शेड्यूल करें

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

किसी विशेष तारीख के बाद एक बार चलाने के लिए टास्क शेड्यूल करें

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

दैनिक एक बार चलाने के लिए टास्क शेड्यूल करें

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

अपने Flutter एप्लिकेशन में एक बार या दैनिक चलाने के लिए टास्क शेड्यूल करें।

अधिक जानें

तारीख के बाद एक बार शेड्यूल करें दैनिक एक बार शेड्यूलिंग

चरण 1

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

चरण 2

अपने पेज से API कॉल करें

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

ऑटोमैटिक JSON पार्सिंग, कैशिंग और इंटरसेप्टर्स के साथ सुंदर API सर्विसेज।

अधिक जानें

GET रिक्वेस्ट्स इंटरसेप्टर्स मॉर्फिंग JSON कैशिंग

चरण 1

डेटा सुरक्षित रूप से सेव करें

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

चरण 2

टाइप कास्टिंग के साथ पढ़ें

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

टाइप कास्टिंग, TTL एक्सपायरी और कलेक्शन के साथ सुरक्षित लोकल स्टोरेज।

अधिक जानें

डेटा सेव करें डेटा पढ़ें कलेक्शन बैकपैक

चरण 1

अपनी भाषा फाइलें जोड़ें

lang/en.json

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

चरण 2

अपने विजेट्स में टेक्स्ट का अनुवाद करें

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

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

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

JSON फाइलों, आर्गुमेंट्स और RTL के साथ बहु-भाषा समर्थन।

अधिक जानें

अनुवाद आर्गुमेंट्स भाषा बदलना RTL समर्थन

चरण 1

नेविगेशन हब बनाएं

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

चरण 2

लेआउट आसानी से बदलें

// Bottom navigation
NavigationHubLayout.bottomNav()

// Top navigation
NavigationHubLayout.topNav()

// Journey / wizard flow
NavigationHubLayout.journey()

स्टेट मेंटेनेंस के साथ बॉटम नेव, टॉप नेव या जर्नी फ्लो बनाएं।

अधिक जानें

बॉटम नेव टॉप नेव जर्नी फ्लो बैजेस

समुदाय द्वारा पसंद किया गया

डेवलपर्स क्या कह रहे हैं Nylo Website

चर्चा में शामिल हों

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 माइक्रो-फ्रेमवर्क आधुनिक ऐप्स के लिए

बनाने के लिए आपको जो कुछ भी चाहिए

राउटिंग

स्टेट मैनेजमेंट

नेटवर्किंग

फॉर्म्स

प्रमाणीकरण

Metro CLI

टर्मिनल से कुछ भी बनाएं

आसान API इंटीग्रेशन

बनाने के लिए शक्तिशाली टूल्स

समुदाय द्वारा पसंद किया गया

Flutter
माइक्रो-फ्रेमवर्क
आधुनिक ऐप्स के लिए