Opal-hot-reloader

Post on 14-Apr-2017

140 views 0 download

Transcript of Opal-hot-reloader

OPAL-HOT-RELOADERFORREST CHANG

FKCHANG2000@YAHOO.COM

HOT RELOADINGAnyone heard of it?

FRONT END WEB DEVELOPMENTincrementally make small changesfaster you can see changes, the faster you can develop

WITHOUT HOT RELOADINGMake the change in your codeRefresh the page in your browserRe-add the data and push all of the same buttons, type etc.

HOW ABOUT LIVE REFRESH?Refreshing loads everythingNew code, but loses stateStarting from scratch can be life sucking

WHERE YOU MIGHT'VE HEARD OF LIVE RELOADINGReact Hot Loader

Need to use stores (typically Redux) to preserve stateWebpack hot module reloader

MODERN WEB DEVHot loading for opalReact.rb Opal version of react.js

OPAL-HOT-RELOADER

Modern web development for OpalReact.rb support built inCode and css reloading, Rails asset pipeline coming soonIntend on making it even easier to use

https://github.com/fkchang/opal-hot-reloader

DEMOWithout Hot ReloadingWith Hot Reloading

VIDEOSimilar demo to live demo, before css reloading was implemented

opal- hot-reloader quick demo

https://www.youtube.com/watch?v=NQbzL7fNOks

CONCLUSIONAll the benefits of leading edge front end Web dev w/o the pain ofJavascriptJoys of Ruby via Opal, no JS fatigue

QUESTIONS?