From Realtime to Isomorphic Dart

@usethedartforce#DevFest14 #DartForce

From Realtimeto isomorphic dart

Joris Hermans

Truvo (goldenpages.be)

@usethedartforce#DevFest14 #DartForce

Schedule

1. History

2. Force MVC & Wired

3. Realtime dart with Dart Force

4. Isomorphic

5. Conclusion

@usethedartforce#DevFest14 #DartForce

At the end of 2013

@usethedartforce#DevFest14 #DartForce

So I started with …

Xmlstream (SAX parser)

RSS

@usethedartforce#DevFest14 #DartForce

But maybe…

Not possible

@usethedartforce#DevFest14 #DartForce

So I started …

Dart Force

Realtime web framework

@usethedartforce#DevFest14 #DartForce

In need of …

Not possible to use websockets in IE & Android Browser

So I need to build a polling server

…

No big web server frameworks

@usethedartforce#DevFest14 #DartForce

Familiar with …

Java spring mvc

Force MVC

@usethedartforce#DevFest14 #DartForce

Schedule

1. History

2. Force MVC & Wired

3. Realtime dart with Dart Force

4. Isomorphic

5. Conclusion

@usethedartforce#DevFest14 #DartForce

Force MVCUsed to familiar annotations @Controller,

@RequestMapping, @RequestParam, @PathVariable

@usethedartforce#DevFest14 #DartForce

Force MVC

Used to familiar annotations @ControllerAdvice,

@ModelAttribute, @ExceptionHandler

@usethedartforce#DevFest14 #DartForce

Wired

@Config, @Bean, @Autowired, @Qualifier

@usethedartforce#DevFest14 #DartForce

Wired

@Qualifier

@usethedartforce#DevFest14 #DartForce

Wired & Force MVC

Used to familiar annotations @Value

properties out of .yaml files

@usethedartforce#DevFest14 #DartForce

SMALL DEMO

@usethedartforce#DevFest14 #DartForce

What are people saying?

If you were using Spring MVC on Java you ‘ll feel at home!

@usethedartforce#DevFest14 #DartForce

Recap

Dart ForceMVC -> Web Application framework, standard http

requests

Wired -> Dependency Injection

Dart Force -> Realtime web framework

@usethedartforce#DevFest14 #DartForce

Recap – Setup dart project

Bin folder -> serverside code

Web folder -> clientside code

@usethedartforce#DevFest14 #DartForce

Tip – Setup dart project

pub serve web --port 7777

export DART_PUB_SERVE="http://localhost:7777"

pub run bin/server.dart

Instead of

pub build everytime …

@usethedartforce#DevFest14 #DartForce

Schedule

1. History

2. Force MVC & Wired

3. Realtime dart with Dart Force

4. Isomorphic

5. Conclusion

@usethedartforce#DevFest14 #DartForce

Realtime Dart with Dart Force

@usethedartforce#DevFest14 #DartForce

Realtime Dart with Dart Force

inspired

@usethedartforce#DevFest14 #DartForce

Realtime Dart with Dart Force

inspired

@usethedartforce#DevFest14 #DartForce

Communication types

Send data to all

Broadcast data directly to all the clients

@usethedartforce#DevFest14 #DartForce

Communication types

Send data to one specific Websocket, by his Id

Sending info to profiles

@usethedartforce#DevFest14 #DartForce

Profile Management

Send information to a specific group

of clients

Examples apps :

- Rooms (facebook)

- Group messaging apps

@usethedartforce#DevFest14 #DartForce

Profile Management

Clientside

Attach a profile to your communication flow

Send info to a specific profile

@usethedartforce#DevFest14 #DartForce

Authentication

Secure your messages

Add a securityStrategy to ForceServer

@usethedartforce#DevFest14 #DartForce

Annotations

You can use annotations with Dart Force

@usethedartforce#DevFest14 #DartForce

Dart Force – server to server

@usethedartforce#DevFest14 #DartForce

Dart Force – Internet Of Things

@usethedartforce#DevFest14 #DartForce

Server to Server communication

Add a ServerSocket connector to ForceServer

ForceClient in a dart:io environment

@usethedartforce#DevFest14 #DartForce

Dart Force

Realtime demo time

@usethedartforce#DevFest14 #DartForce

Schedule

1. History

2. Force MVC & Wired

3. Realtime dart with Dart Force

4. Isomorphic

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

Wat is Isomorphic?

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

ABSTRACTION ABSTRACTION ABSTRACTION

Run your code everywhere

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

WHERE?

On the server, in the browser

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

R2D2 handling device detection

The same logic only an other way to get useragent

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

Yeah but what if I want to run my code against MONGODB

and later on against REDIS or MEMCACHE?

ABSTRACTION ABSTRACTION …

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

Cargo is a great example!

Key – value storage everywhere

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

Drawing of the cargo space!

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

BountyHunterReversed Index (full text search)

Deployable on every possible environment with X persistent possibilities

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

ClientHunter …Bountyhunter in the browser

MongoHunter …Bountyhunter with mongoDB

@usethedartforce#DevFest14 #DartForce

Isomorphic Dart

ClientHunter …Bountyhunter in the browser

MongoHunter …Bountyhunter with mongoDB

@usethedartforce#DevFest14 #DartForce

Schedule

1. History

2. Force MVC & Wired

3. Realtime dart with Dart Force

4. Isomorphic

5. Conclusion

@usethedartforce#DevFest14 #DartForce

Ultimate goal

Combine Dart Force and Cargo more

+ +

like

@usethedartforce#DevFest14 #DartForce

Upcoming features – first steps

@usethedartforce#DevFest14 #DartForce

Youtube channel

@usethedartforce#DevFest14 #DartForce

More on …

ForceUniverse

http://github.com/forceuniverse

@usethedartforce#DevFest14 #DartForce

Q & A

http://github.com/forceuniverse