Acesse a documentação em Português-Brasil

Slidy

CLI package manager and template generator for Flutter. Generate Modules, Pages, Widgets, BLoCs, Controllers and tests.

Slidy supports rxBLoC, flutter_bloc and mobx.

Why should I use?

Slidy's goal is to help you structure your project in a standardized way. Organizing your app in Modules formed by pages, repositories, widgets, BloCs, and also create unit tests automatically. The Module gives you a easier way to inject dependencies and blocs, including automatic dispose. Also helps you installing the dependencies and packages, updating and removing them. The best is that you can do all of this running a single command.

Motivations

We realized that the project pattern absence is affecting the productivity of most developers, so we're proposing a development pattern along with a tool that imitates NPM (NodeJS) functionality as well as template generation capabilities (similar to Scaffold ).

About the Proposed Pattern

The structure that slidy offers you, it's similar to MVC, where a page keeps it's own business logic classes(BloC).

We recommend you to use flutter_modular when structuring with slidy. It offers you the module structure(extending the WidgetModule) and dependency/bloc injection, or you will probably get an error.

To understand flutter_modular, take a look at the README.

We also use the Repository Pattern, so the folder structure it's organized in local modules and a global module. The dependencies(repositories, BloCs, models, etc) can be accessed throughout the application.

Sample folder structure generated by slidy:

Installation

First of all you need install the Dart:

https://dart.dev/get-dart
Activate the slidy using the pub:

 pub global activate slidy

Type slidy --version to make sure everything is working properly. This command should return the installed version.

Commands:

upgrade:

Updates slidy's version:

slidy upgrade

create:

Create a new project with same structure describe in start command.

slidy create **myproject**

start:

Create the basic structure of your project existing (make sure that your "lib" folder it's empty).

slidy start

Then choose your provider:

Then choose your State Manager:

Mobx

And you will get this Structure:

Flutter Bloc:

And you will get this Structure:

Bloc With RxDart

And you will get this Structure:

If you have the flutter_bloc or flutter_mobx package in pubspec, the generation of pages, widgets, and bloc defaults to the installed manager default.

Options

The command allows to specify provider and state manager using the following options:

Provider:

-p <provider_name>

Options:
flutter_modular / bloc_pattern

Example:
slidy start -p flutter_modular

State manager:

-s <state_manager_name>

Options:
mobx / flutter_bloc / rxdart
Example:
slidy start -s mobx

Provider and state manager:

slidy start -p flutter_modular -s mobx

This command asks for permission to erase lib folder. If you don't want to see the warning, type the -f (force) flag:

slidy start -p flutter_modular -s mobx -f

run:

Runs the scripts in pubspec.yaml:

slidy run open_folder

You can add var session to customize scripts

vars:
  runner: flutter pub run build_runner
  clean: flutter clean
  get: flutter pub get
scripts: 
    mobx_build: $clean & $get & $runner build --delete-conflicting-outputs
    mobx_watch: $clean & $get & $runner watch --delete-conflicting-outputs

slidy run mobx_build

install:

Installs or update the packages in dependencies:

slidy install rxdart dio bloc_pattern

or you can just use the i command (both are the same)

slidy i rxdart dio bloc_pattern

Install packages as dev_dependency:

slidy i mockito --dev

uninstall:

Removes a package

slidy uninstall dio

You can also remove a dev_dependency using the flag --dev

update:

Update package's version: You can update just once package

slidy update mobx

Or you can update all packages using the flag --all or -a

slidy update -a

You can also update a dev_dependency or all using the flag --dev

generate:

Creates a module, page, widget or repository including its BloC class.

NOTE: You can replace "g" with "generate" command.

Creates a new module:

slidy g module folder_name

slidy g m folder_name

NOTE: You can create a "Complete Module" with Module, Page, Bloc/Controller, tests for Page and for Bloc/Controller using the flag -c

NOTE² : You can create a "Repository" with your Module using the flag -r

slidy g m modules/my_module -c -r

NOTE³ : You can create a "Interface" for your repository with your Module using the flag -i

slidy g m modules/my_module -c -r -i

Creates a new page + BloC:

slidy g page folder_name/pages

slidy g p folder_name/pages

Creates a new widget + BloC:

slidy g widget folder_name/widgets

slidy g w folder_name/widgets

NOTE: You can create a page or widget using its respective BLoC using the flag -b

Create a new repository

slidy g r folder_name/repositories

You can also use "repository" in "r"'s place, but it will have the same function.

NOTE : You can create a "Interface" for your repository using the flag -i

slidy g m modules/my_module -c -r -i

Create a new service

slidy g s folder_name/services

NOTE : You can create a "Interface" for your service using the flag -i

slidy g m modules/my_module -c -s -i

Create a new model

slidy g mm folder_name/model

NOTE : if you are using JsonSerializable (and 'json_annotation' is in Dependecy and 'json_serializable' is in dev_dependencies) this command will create using anotation

Unit Tests:

Generate unit tests on the test folder for you.

slidy test folder_name/

Localization Automation

Use slidy localization command to help in use with localization package.

This command get all .i18n() in code and trailing comments. If this key already exists, updates value in all localization files, else, inserts this key and your value in end of all localization files.

In all cases, the comment is removed to mantain clean the code.

The localization directory is defined in root of pubspec.yaml, like this:

localization_dir: assets\language

NOTE : Is recommended create this definition in file's end.

Example

Before command

pt_BR.json

{
  "login-label": "Usuário"
}

login_page.dart

import 'package:flutter/material.dart';
import 'package:localization/localization.dart';

class LoginPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Login")),
      body: Column(
        children: [
          TextField(decoration: InputDecoration(labelText: "user-label".i18n())),
          TextField(decoration: InputDecoration(labelText: "password-label".i18n())), //Senha
        ],
      ),
    );
  }
}

After command

pt_BR.json

{
  "login-label": "Usuário",
  "password-label": "Senha"
}

login_page.dart

import 'package:flutter/material.dart';
import 'package:localization/localization.dart';

class LoginPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Login")),
      body: Column(
        children: [
          TextField(decoration: InputDecoration(labelText: "user-label".i18n())),
          TextField(decoration: InputDecoration(labelText: "password-label".i18n())),
        ],
      ),
    );
  }
}