Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Belka
Building desktop apps
in 2016
CHROMIUM EMBEDDED FRAMEWORK
Belka
GIOVANNI FRIGO
@john_frigo
CTO @ Belka
HELLO WORLD
GiovanniFrigo
Belka
Requests from our customer
• Fresh and usable UI/UX Design
• Multiplatform

🖼Win + 🍏OS X + 🐧Linux
• Hardware integra...
Belka
Some more detail
Carlo Gavazzi is an international group active in
designing, manufacturing and marketing electronic...
Belka
INDUSTRIAL DESIGN IS HARD
• Many features
• Convincing your clients that user testing is
useful is very hard
• How w...
Belka
SURE THING
UI/UX DESIGN IS NICE BUT…
Belka
SURE THING
UI/UX DESIGN IS NICE BUT…
Belka
WHAT COULD
WE USE?
Belka
WHAT COULD WE USE?
No custom design
JVM
CHOOSE ME!
Belka
WHAT COULD WE USE?
CHOOSE ME! CHOOSE ME!
Too expensive!No custom design
JVM
Belka
WHAT COULD WE USE?
CHOOSE ME! CHOOSE ME!
Too expensive!
CHOOSE ME!
This is interesting…No custom design
JVM
Belka
WHAT COULD WE USE?
CHOOSE ME! CHOOSE ME!
Too expensive!
CHOOSE ME!
This is interesting…No custom design
JVM
Belka
WHAT ABOUT…?
Thanks but no thanks
Belka
LAYERS
1. Web UI
2. C++
3. Modbus communication
Belka
OH NO
HOW WILL WE CONNECT C++ TO MODBUS?
Belka
Belka
WHAT IS C++ FOR?
• Running CEF
• Running V8 Javascript engine
• Talk with the hardware instruments
Belka
C++/JAVASCRIPT callbacks
HOW TO TALK TO C++
Belka
CEF-READY CALLBACKS
Belka
CEF-READY CALLBACKS
Belka
PULL vs PUSH LOGIC
All the calls are on a pull logic, meaning that Javascript has
to call the C++ layer and then exp...
Belka
PULL vs PUSH LOGIC
Belka
PULL vs PUSH LOGIC
Belka
JAVASCRIPT FRAMEWORK
TOP LAYER
Belka
The best choice in town
Belka
Seriously
Belka
ReactJS
• The V in MVC
• Component Driven
• SUCH HIP, MUCH COOL
Belka
ReactJS
Belka
HAVE I TOLD YOU THE
BEST PART?
Belka
Chrome DevTools FTW!
Belka
THAT WAS FUN!
How about real life?
Belka
DON’T TRY THIS AT HOME
Belka
DON’T TRY THIS AT HOME
• Building CEF is not the easiest thing in the world
• Updating CEF can be tricky
Belka
There are easiest paths…
Belka
…trusted by many
Belka
ADVANTAGES OVER CEF
• No need to ever compile native OS code
• Easier if you just need the “Web UI” layer
• Tons of ...
Belka
B3La
b
BELKA
Upcoming SlideShare
Loading in …5
×

Building desktop apps in 2016

643 views

Published on

Presentation by Giovanni Frigo (Belka srl) for Speck and Tech first issue.
We talk about Chromium embedded Framework (CEF), React, Electron, Native Webapps.

Published in: Software
  • Be the first to comment

Building desktop apps in 2016

  1. 1. Belka Building desktop apps in 2016 CHROMIUM EMBEDDED FRAMEWORK
  2. 2. Belka GIOVANNI FRIGO @john_frigo CTO @ Belka HELLO WORLD GiovanniFrigo
  3. 3. Belka Requests from our customer • Fresh and usable UI/UX Design • Multiplatform
 🖼Win + 🍏OS X + 🐧Linux • Hardware integration
  4. 4. Belka Some more detail Carlo Gavazzi is an international group active in designing, manufacturing and marketing electronic equipment. The group's products provide automation solutions for the global markets of industrial and building automation.
  5. 5. Belka INDUSTRIAL DESIGN IS HARD • Many features • Convincing your clients that user testing is useful is very hard • How will I implement my pretty design?
  6. 6. Belka SURE THING UI/UX DESIGN IS NICE BUT…
  7. 7. Belka SURE THING UI/UX DESIGN IS NICE BUT…
  8. 8. Belka WHAT COULD WE USE?
  9. 9. Belka WHAT COULD WE USE? No custom design JVM CHOOSE ME!
  10. 10. Belka WHAT COULD WE USE? CHOOSE ME! CHOOSE ME! Too expensive!No custom design JVM
  11. 11. Belka WHAT COULD WE USE? CHOOSE ME! CHOOSE ME! Too expensive! CHOOSE ME! This is interesting…No custom design JVM
  12. 12. Belka WHAT COULD WE USE? CHOOSE ME! CHOOSE ME! Too expensive! CHOOSE ME! This is interesting…No custom design JVM
  13. 13. Belka WHAT ABOUT…? Thanks but no thanks
  14. 14. Belka LAYERS 1. Web UI 2. C++ 3. Modbus communication
  15. 15. Belka OH NO HOW WILL WE CONNECT C++ TO MODBUS?
  16. 16. Belka
  17. 17. Belka WHAT IS C++ FOR? • Running CEF • Running V8 Javascript engine • Talk with the hardware instruments
  18. 18. Belka C++/JAVASCRIPT callbacks HOW TO TALK TO C++
  19. 19. Belka CEF-READY CALLBACKS
  20. 20. Belka CEF-READY CALLBACKS
  21. 21. Belka PULL vs PUSH LOGIC All the calls are on a pull logic, meaning that Javascript has to call the C++ layer and then expects a (short lived) response. How about C++ sending messages to Javascript? (Push- style)
  22. 22. Belka PULL vs PUSH LOGIC
  23. 23. Belka PULL vs PUSH LOGIC
  24. 24. Belka JAVASCRIPT FRAMEWORK TOP LAYER
  25. 25. Belka The best choice in town
  26. 26. Belka Seriously
  27. 27. Belka ReactJS • The V in MVC • Component Driven • SUCH HIP, MUCH COOL
  28. 28. Belka ReactJS
  29. 29. Belka HAVE I TOLD YOU THE BEST PART?
  30. 30. Belka Chrome DevTools FTW!
  31. 31. Belka THAT WAS FUN! How about real life?
  32. 32. Belka DON’T TRY THIS AT HOME
  33. 33. Belka DON’T TRY THIS AT HOME • Building CEF is not the easiest thing in the world • Updating CEF can be tricky
  34. 34. Belka There are easiest paths…
  35. 35. Belka …trusted by many
  36. 36. Belka ADVANTAGES OVER CEF • No need to ever compile native OS code • Easier if you just need the “Web UI” layer • Tons of plugins available via npm • Can be as easy as npm run package
  37. 37. Belka
  38. 38. B3La b BELKA

×