stream2app - Flutter client

:checkered_flag: Português (Portuguese)

Framework to build servers for Flutter Apps that allows you to:

  • :handshake: perform a websocket connection to exchange data that:

    • :vibration_mode: supports streams on the client side in Flutter

    • :arrow_right_hook: perform the resending of data in case of instability of the client connection

  • :pencil2: create your own CRUD operations (Create, Read, Update and Delete)

  • :no_entry: restrict client access to CRUD operations

  • :mega: notify in real time clients who are listening for changes in a route, you can choose to notify:

    • :no_pedestrians: only specify clients will receive the data

    • :heavy_check_mark: all clients will receive the data

  • :lock: accept and deny connection attempts

This is the client side (Flutter), click here to access the server side (Node.js).

Getting Started

Alt Text

The "Getting Started" is a example of the Flutter client, an example is executed locally.

1 - First click here and follow the server instruction in the section "Getting Started"

2 - Install

pubspec.yaml:

dependencies:
  flutter:
    sdk: flutter
    
  # Add stream2app package:
  stream2app: ^1.0.0

3 - Import the package

import 'package:stream2app/stream2app.dart';

4 - Initialize the server with Stream2App.instance.init(serverUrl:"ws://<IPV4>:<PORT>") informing the IPV4 address and port (default: 3123).

5 - Perform the connection with Stream2App.instance.connect()

Example:

void main() {
  Stream2App.instance.init(serverUrl:"ws://192.168.2.1:3123");
  Stream2App.instance.connect();
  runApp(TrackingApp());
}    

6 - Copy and paste this template into build

@override
Widget build(BuildContext context) {
  return Scaffold(
      appBar: AppBar(
        title: Text("Tracking"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            //Show the status of the tracking in realtime
            // FIRST TODO

            SizedBox(height: 100,),

            //Send data to server with body as text: "I'm waiting"
            // SECOND TODO
           ],
        ),
      )
  );
}

7 - Replace FIRST TODO by a widget that listen in realtime a route in the server

Stream2App.instance
    .listenAndBuild(
        route: 'product/tracking',
        builder: (context,  snapshot) {
            if(!snapshot.hasData)
                return Container();
            return Text(snapshot.data, style: _textStyle);
        }
    ),

7 - Replace SECOND TODO by a button that send data to a route in the server

RaisedButton(
    child: Text("I'm waiting", style: _textStyle,),
    onPressed: (){
         Stream2App.instance
            .create(route: 'product/customerSaid', body: 'I\'m waiting')
            .then((res) => print(res.isSuccess ? 'Success' : res.error.code));
    },
)

Project ready! Now just run :)

Following this links, you can also check this "Getting Started" complete project of the Flutter client and of the server in Node.js.

Issues

Feel free to open a issue about:

  • :grey_question: questions

  • :bulb: suggestions

  • :page_facing_up: documentation improvements

  • :ant: potential bugs

License

MIT

Libraries

stream2app