javascript ui architecture: be all that you can be
Post on 16-May-2015
3.747 Views
Preview:
DESCRIPTION
TRANSCRIPT
JavaScript UI Architecturebe all that you can be
kyle simpson@getifyhttp://getify.me
#jsui #hbjs
“everyone is entitled to the their own (wrong) opinion.”
--unknown
how i(we) got here
front-end (html/css)
?back-end (logic, db)
front-end (html/css)
“middle-end”
back-end (logic, db)
(ui architecture)
ui architecture:how the “server” builds & delivers the presentation layer to the “client”
+how communication happens between the presentation layer and the application
warning: highly offensive material
warning: highly offensive material
breaking news: javascript is a first-class language now.
javascript is just soking awesome!
warning: highly offensive material
javascript is better at ui archiecture than your current application.
javascript doesn’t have to run in the browser to be so awesome.
what we’re NOT talking about
javascript frameworks application
platformsall-in-one anything
css {display:cool;}<marquee>
<html>
what we ARE talking about
raw javascript (browser & server)
an alternate “design pattern” to MVC modular everything
howto: make the ui really work for you
templating
DRY
what problems do we need to solve?
MVCuh oh!
“i like ‘mvc’, I just don’t like the ‘m’…”
M + C
<?phpif ($user->IsLoggedInAndCanPublish()) { $user->publish($doc->get()); }?>
M + V<?phpif (user->IsLoggedInAndCanPublish()) {?>
Welcome back!<?php}?>
V + C<?phpif (user->IsLoggedInAndCanPublish()) {
$output = $template->create(“loggedin.tmpl”)->html();$ouput .= $template->create(“footer.tmpl”)->html();return $output;
}?>
DRY
data validation
url routing
so how can we solve these problems?
MVC (in the browser)
? MVC (on the server)
MVC (in the browser)
iPad MVC (on the server)
MVC (in the browser)
MVC (on the server)
MVC (in the browser)
CVC MVC (on the server)
CVCclient-view-controller
everything is a client of everything
else
CVC
data should only be data, not methods
or behavior
CVC
presentation templates should
not have any application logic
CVC
code should be able to run anywhere
CVC
whatever application framework you choose (.NET, Java, RoR, PHP, etc), CVC sits on top of
your application
client(s)everything is module and a
client of everything else
view(s)HandlebarJS
HandlebarJStemplating engine written in javascript that takes simple text templates and combines with json data to output presentation views.
controller(s)also javascript
url routing, data validation, etc
ask more questions about your architecture…
…be all that you can be!
more info
kyle simpson@getifyhttp://getify.me
http://github.com/getify/HandlebarJShttp://speakerrate.com/talks/2062http://www.slideshare.net/shadedecho
top related