A flutter boilerplate project with GetX state management.

Overview

flutter_getx_boilerplate

Languages: English (this file), Chinese.

Introduction

During my study of Flutter, I have been using the flutter_bloc state management framework. I accidentally saw the GetX state management framework. Through ReadMe, I found that the GetX framework is very easy to get started. So I want to write a GetX Starter project while learning, which can not only help myself Learning can also help others quickly build a boilerplate. Before building this boilerplate, I searched many similar projects, and found that they were relatively simple, and none of them covered the common things that the project should have, so I sprouted the idea of ​​writing one by myself. Let me introduce them one by one below.

Technology & Project Introduction

Use Flutter 2.x to build a set of features containing predefined folder structure, style themes, API access, state management, routing & dependencies, etc. The project structure is clear and can be easily used as a Flutter template project. Technologies used include but are not limited to Flutter, Dart, GetX, etc.

Installation & Use

Step 1:

Fork this project to your own warehouse:

git clone https://github.com/KevinZhang19870314/flutter_getx_boilerplate.git

Step 2:

Open the project folder with VS Code and execute the following command to install the dependency package:

flutter pub get

Step 3:

Open the main.dart file in the lib folder, F5 or Ctrl + F5 to run the project, and then you can start developing and debugging.

Folder structure

The following is the project folder structure (only the folders under lib are introduced)

lib/
|- api - Global Restful api requests, including interceptors, etc.
   |- interceptors - Interceptors, including auth, request, and response interceptors.
   |- api.dart - Restful api export file.
|- lang - Internationalization, including translation files, translation service files, etc.
   |- lang.dart - Language export file.
|- models - Various structured entity classes, divided into request and response entities.
   |- models.dart - Entity class export file.
|- modules - Business module folder.
   |- auth - Login & Registration Module.
   |- home - Home module.
   |- splash - Splash module.
   |- modules.dart - Module export file.
|- routes - Routing module.
   |- app_pages.dart - Routing page configuration.
   |- app_routes.dart - Route names.
   |- routes.dart - Route export file.
|- Shared - Global shared folders, including static variables, global services, utils, global Widgets, etc.
   |- shared.dart - Global shared export file.
|- theme - Theme folder.
|- app_bindings.dart - Services started before the app runs, such as Restful api.
|- di.dart - Global dependency injection objects, such as SharedPreferences, etc.
|- main.dart - Main entry.

Other

In the writing process, because it involves the call of Restful api, here I used the free test api provided by REQ|RES.

Test User as below:

email: "[email protected]",
password: "pistol"
Comments
  • chore: Update readme.md for south korea users

    chore: Update readme.md for south korea users

    Thank you very much for building the best boilerplate for flutter. It would be great if Koreans could build several flutter projects through this boilerplate. So I proceeded with the translation for Korean users.

    I didn't translate the folder structure part because it was natural in English.

    Once again, thank you very much for providing a good project.

    opened by ChanhyukPark-Tech 1
  • can you help me?

    can you help me?

    i have been custom your code

    response_interceptor.dart

    void handleErrorStatus(Response response) { switch (response.statusCode) { case 400: final message = ErrorResponse.fromJson(response.body); CommonWidget.toast(message.message); break; case 403: final message = ErrorResponse.fromJson(response.body); print(message.message); //CommonWidget.toast(message.message); Get.toNamed(Routes.VERIFY_EMAIL); break; default: }

    ============================== api_repository.dart

    Future<UserResponse?> getUser() async { final res = await apiProvider.getUser('/api/user'); if (res.statusCode == 200) { return UserResponse.fromJson(res.body); } }

    when iam run, i am get this error, in file api_repository.dart

    Exception has occurred. _CastError (type 'Null' is not a subtype of type 'Response' in type cast)

    opened by hanafiahtkj 1
  • request_interceptor error when i'm uncomment

    request_interceptor error when i'm uncomment

    request_interceptor.dart

    ==============

    import 'dart:async';

    import 'package:flutter_easyloading/flutter_easyloading.dart'; import 'package:get/get_connect/http/src/request/request.dart'; import 'package:flutter_getx_boilerplate/shared/shared.dart';

    FutureOr requestInterceptor(request) async { final token = StorageService.box.pull(StorageItems.accessToken);

    request.headers['X-Requested-With'] = 'XMLHttpRequest'; request.headers['Authorization'] = 'Bearer $token';

    EasyLoading.show(status: 'loading...'); return request; }

    storage_service.dart

    import 'package:get/get.dart'; import 'package:shared_preferences/shared_preferences.dart';

    class StorageService extends GetxService { Future init() async { return await SharedPreferences.getInstance(); } }

    can you help me please

    opened by hanafiahtkj 1
  • Changing tabs makes the view keeps refreshing.

    Changing tabs makes the view keeps refreshing.

    When we change tab, the view keeps refreshing. For ex, at the first tab, you scroll the view to bottom, then switch to another tab and then get back to the first tab. This time the view refreshes and scroll up again. It should be the same state. Please fix. Thanks.

    opened by tuanbs 1
  • Dublicate Globalkey error

    Dublicate Globalkey error

    after Sign In and log off at me page. If you again try to click sign In button you get error

    Launching lib\main.dart on Chrome in debug mode... Debug service listening on ws://127.0.0.1:62522/bnQE7F-YJxU=/ws Running with sound null safety Connecting to VM Service at ws://127.0.0.1:62522/bnQE7F-YJxU=/ws [GETX] Instance "SharedPreferences" has been created [GETX] Instance "ApiProvider" has been created [GETX] Instance "ApiProvider" has been initialized [GETX] Instance "ApiRepository" has been created [GETX] Instance "GetMaterialController" has been created [GETX] Instance "GetMaterialController" has been initialized [GETX] GOING TO ROUTE / [GETX] Instance "SplashController" has been created [GETX] Instance "SplashController" has been initialized [GETX] GOING TO ROUTE /auth [GETX] Instance "AuthController" has been created [GETX] Instance "AuthController" has been initialized [GETX] GOING TO ROUTE /auth/login [GETX] GOING TO ROUTE /home [GETX] Instance "HomeController" has been created [GETX] Instance "HomeController" has been initialized [GETX] GOING TO ROUTE /auth [GETX] GOING TO ROUTE /auth/login

    ════════ Exception caught by widgets library ═══════════════════════════════════ The following assertion was thrown building Form-[LabeledGlobalKey#2aaf7](state: FormState#ba874): Assertion failed: _route == ModalRoute.of(context) is not true

    The relevant error-causing widget was Form-[LabeledGlobalKey#2aaf7] When the exception was thrown, this was the stack C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 236:49 throw_ C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 29:3 assertFailed packages/flutter/src/widgets/will_pop_scope.dart 135:36 didUpdateWidget packages/flutter/src/widgets/framework.dart 4754:57 update packages/flutter/src/widgets/framework.dart 3345:14 updateChild ... ════════════════════════════════════════════════════════════════════════════════

    ════════ Exception caught by widgets library ═══════════════════════════════════ Duplicate GlobalKey detected in widget tree. ════════════════════════════════════════════════════════════════════════════════

    opened by guyulmaz 1
Owner
Kevin Zhang
Frontend develper, focus on Angular & nodejs & graphql & Flutter development.
Kevin Zhang
MobX for the Dart language. Hassle-free, reactive state-management for your Dart and Flutter apps.

Language: English | Português | Chinese mobx.dart MobX for the Dart language. Supercharge the state-management in your Dart apps with Transparent Func

MobX 2.2k Dec 27, 2022
Flutter MVU architecture/state management package

mvu_flutter No mutability. No builders. No connectors. No reducers. No StreamControllers and subscription management. A truly declarative state manage

Yakov Karpov 7 Jul 29, 2021
Simple global state management for Flutter

Slices Slices is a minimalist state manegement, focused specifically for applications that needs a global state where different "pieces" of the applic

Erick 5 Jun 15, 2021
The modular state management solution for flutter.

The modular state management solution for flutter. Easy debugging : each event is predictable and goes into a single pipeline Centralized state : soli

Aloïs Deniel 44 Jul 6, 2022
Flutter State Management with provider :rocket:

Flutter - Gerenciamento de Estados com Provider Objetivos ao completar os estudos Aprenda a gerenciar o estado da sua aplicação com Single Source of T

Tiago Barbosa 0 Dec 6, 2021
A predictable state management library that helps implement the BLoC design pattern

A predictable state management library that helps implement the BLoC design pattern. Package Pub bloc bloc_test flutter_bloc angular_bloc hydrated_blo

Felix Angelov 9.9k Dec 31, 2022
Another state management solution

VxState VxState is a state management library built for Flutter apps with focus on simplicity. It is inspired by StoreKeeper & libraries like Redux, V

Pawan Kumar 42 Dec 24, 2022
A simple way to access state while robust and testable.

A state-management library that: catches programming errors at compile time rather than at runtime removes nesting for listening/combining objects ens

Remi Rousselet 3.9k Jan 3, 2023
A lightweight, yet powerful way to bind your application state with your business logic.

binder A lightweight, yet powerful way to bind your application state with your business logic. The vision As other state management pattern, binder a

Romain Rastel 172 Nov 16, 2022
Manage the state of your widgets using imperative programming concepts.

Imperative Flutter Manage the state of your widgets using imperative programming concepts. Setup Intall imperative_flutter package in pubspec.yaml dep

Jeovane Santos 5 Aug 20, 2022
Example of use bloc + freezed with a state that contains a list

blocfreezedlistexample A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you s

Leynier Gutiérrez González 2 Mar 21, 2022
Timer based on provider state manager

timer_provider Timer based on provider state manager Getting Started This project is a starting point for a Flutter application. A few resources to ge

Елизавета Лободина 0 Nov 6, 2021
Trip management mobile Application

HereYouGO Trip management mobile Application This app will help you Track your expense during your trips. Track your trip destinations and the sub tri

Krupali Mehta 4 Jul 7, 2022
Functional programming in Dart and Flutter. All the main functional programming types and patterns fully documented, tested, and with examples.

Fpdart Functional programming in Dart and Flutter. All the main functional programming types and patterns fully documented, tested, and with examples.

Sandro Maglione 275 Dec 26, 2022
A flutter boilerplate project with GetX state management.

flutter_getx_boilerplate Languages: English (this file), Chinese. Introduction During my study of Flutter, I have been using the flutter_bloc state ma

Kevin Zhang 234 Jan 5, 2023
A basic boilerplate template for starting a Flutter GetX project. GetX, Dio, MVVM, get CLI, Localization, Pagination etc are implemented.

Flutter GetX Template (GetX, Dio, MVVM) This Flutter Template using GetX package for State management, routing and Dependency Injection (bindings). We

Hasan Abdullah 214 Jan 9, 2023
Flutter getx template - A Flutter Template using GetX package for State management, routing and Dependency Injection

Flutter GetX Template (GetX, Dio, MVVM) This Flutter Template using GetX package

Tareq Islam 6 Aug 27, 2022
Flutter boilerplate - A boilerplate project created in flutter using MobX and Provider

Boilerplate Project A boilerplate project created in flutter using MobX and Prov

Wali Khan 0 Jan 22, 2022
Building a simple Flutter app for practicing and understanding the GetX State Management and Route Management.

GetX State Management Demo with full understanding of State Management (with GetBuiler, GetX, Obx), Route Management and SnackBar.

TAD 4 Oct 2, 2022
GetX demo Counter with full understanding of State Management, Route Management and SnackBar

GetX demo Counter with full understanding of State Management, Route Management and SnackBar

TAD 1 Apr 4, 2022