Reallife experience with Dart

I could show my Slack Chatbot written in Dart. It covers websockets, an API w/ redstone and a little bit AngularDart for the frontend.

Transcript

1. Reallife experience
   with Dart
   ViennaJS
   @Sgoettschkes
   https://stocksnap.io/photo/LTB7BB80VH
   

   View Slide

2. View Slide

3. View Slide

4. blitzlicht
   Improve communication by asking simple questions.
   1. Ask one question
   2. Have people answer in their own words
   3. Get insights
   

   View Slide

5. blitzlicht in Action
   

   View Slide

6. blitzlicht in Action
   

   View Slide

7. blitzlicht in Action
   

   View Slide

8. Code example
   

   View Slide

9. Code example
   Websockets
   

   View Slide

10. Code example
    void connect(String url) {
    WebSocket.connect(url).then((WebSocket websocket) {
    websocket.pingInterval = new Duration(seconds: 5);
    websocket.listen(process, onDone: reconnect, onError: reconnect);
    });
    }
    

    View Slide

11. Code example
    void connect(String url) {
    WebSocket.connect(url).then((WebSocket websocket) {
    websocket.pingInterval = new Duration(seconds: 5);
    websocket.listen(process, onDone: reconnect, onError: reconnect);
    });
    }
    

    View Slide

12. Code example
    void process(String message) {
    Map data = JSON.decode(message);
    // ... do something
    }
    

    View Slide

13. Code example
    API
    

    View Slide

14. Code example
    import 'package:redstone/redstone.dart' as app;
    void main() {
    app.start();
    }
    

    View Slide

15. Code example
    @app.Group('/api/blitzlichts')
    class BlitzlichtService {
    @app.Route('/:id')
    read(String id, @Repo() Repository repo) async {
    Blitzlicht blitzlicht =
    await repo.findOne(where.id(new ObjectId.fromHexString(id)));
    return blitzlicht.toMap();
    }
    }
    

    View Slide

16. Code example
    @app.Group('/api/blitzlichts')
    class BlitzlichtService {
    @app.Route('/:id')
    read(String id, @Repo() Repository repo) async {
    Blitzlicht blitzlicht =
    await repo.findOne(where.id(new ObjectId.fromHexString(id)));
    return blitzlicht.toMap();
    }
    }
    

    View Slide

17. Code example
    @app.Group('/api/blitzlichts')
    class BlitzlichtService {
    @app.Route('/:id')
    read(String id, @Repo() Repository repo) async {
    Blitzlicht blitzlicht =
    await repo.findOne(where.id(new ObjectId.fromHexString(id)));
    return blitzlicht.toMap();
    }
    }
    

    View Slide

18. Code example
    @app.Group('/api/blitzlichts')
    class BlitzlichtService {
    @app.Route('/:id')
    read(String id, @Repo() Repository repo) async {
    Blitzlicht blitzlicht =
    await repo.findOne(where.id(new ObjectId.fromHexString(id)));
    return blitzlicht.toMap();
    }
    }
    

    View Slide

19. Code example
    AngularDart
    

    View Slide

20. Code example
    import 'package:angular2/platform/browser.dart';
    import 'package:blitzlicht/client/app_component.dart';
    void main() {
    bootstrap(AppComponent);
    }
    

    View Slide

21. Code example
    
    
    
    >
    
    
    

    View Slide

22. Code example
    
    
    Loading ...
    
    
    

    View Slide

23. Code example
    @Component(
    directives: const [ROUTER_DIRECTIVES],
    providers: const [ROUTER_PROVIDERS],
    selector: 'blitzlicht',
    templateUrl: 'app_component.html')
    @RouteConfig(const [
    const Route(
    path: '/', name: 'Index', component: IndexComponent, useAsDefault: true),
    ])
    class AppComponent implements OnInit {
    Future ngOnInit() async {
    print('THIS IS BLITZLICHT');
    }
    }
    

    View Slide

24. Code example
    import 'package:angular2/core.dart';
    import 'package:angular2/router.dart';
    @Component(
    directives: const [ROUTER_DIRECTIVES],
    selector: 'index',
    templateUrl: 'index_component.html')
    class IndexComponent {}
    

    View Slide

25. View Slide

26. Summary
    https://pixabay.com/en/milky-way-andromeda-stars-galaxy-923801/
    

    View Slide

27. https://www.dropbox.com/s/6z5aiwa8l09g2pa/86H.jpg
    

    View Slide