dart-fullstack icon indicating copy to clipboard operation
dart-fullstack copied to clipboard

Experimenting architectures for developing all layers of a typical application in Dart.

Fullstack with Dart

An example that uses Dart language for developing all the application layers. This experiments purpose is also to find an approach to share a maximum of logic by applying interresting architectural patterns.

schema

Server (api)

GRPC Specifications

The server is fully based on GRPC and Protocol Buffers. Basicaly, this technology allows you to specify your Services (and its messages) format through a dedicated language (proto3).

The api project contains the type and service specifications. A set of Dart classes are generated into the generated folder by executing the following command (make sure you installed protoc and the dart plugin):

> cd api/lib
> protoc --dart_out=grpc:generated --proto_path=<project-root>/api/lib   -Iprotos tasks.proto

This will generate a TaskServiceClient that will be used from the client side and a TaskServiceBase that is the abstract class in which the server must implement the actual logic.

Service implementation

A basic service implementation that keeps history in memory is provided.

Running

To start the server, execute the following command:

> dart server/bin/server.dart

Client (mobile, web)

Shared

All the application state is shared through a reactive architecture based on Stream, StreamBuilder, InheritedWidget and reactive extensions.

To learn more, watch Build reactive mobile apps with Flutter (Google I/O '18).

Basically, all the application logic is stored in a TaskBloc that exposes various input and output streams.

Mobile (Flutter)

The mobile is composed of several widgets which subscribe to the global TasksBloc container widget.

The TasksProvider allows any widget to access to the unique TasksBloc instance.

Web (Angular-Dart)

WIP