Download - Y! Open Hack 2013 (London)
![Page 1: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/1.jpg)
![Page 2: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/2.jpg)
YAHOO! MOJITO
Gaurav VaishPrincipal Engineer
![Page 3: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/3.jpg)
3
COCKTAILSCocktails [kðk’tålz] (noun, plural): a Javascript-based• on-line/off-line, multi-device,• cloud-ready, Web application platformthat offers features such as• internationalization, command-line tools,• single-language code and scaling
![Page 4: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/4.jpg)
4
WHAT’S MOJITO?• A JavaScript MVC framework for web based
applications, one of the Yahoo! Cocktails
Build high-performance, device-independent HTML5 applications running on both client and
server with Node.js
![Page 5: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/5.jpg)
5
MOJITO STACK
JavaScript
Connect
Express
YUINode.js
Mojito
MustacheHandlebars
![Page 6: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/6.jpg)
6
MOJITO APPLICATION COMPONENTS
Mojit• Model• View• Controller• Binder
Proxy
Configuration• Application• Routes• Dimensions
Core Framework• View Engine• Middleware• Resource Store• CLI• Add-ons
Framework Mojits• HTMLFrame• LazyLoad
![Page 7: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/7.jpg)
7
MOJITO APPLICATION COMPONENTS
![Page 8: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/8.jpg)
8
GETTING MOJITO• Using npm
• npm install mojito –g
• From source• git clone git://github.com/yahoo/mojito.git• (cd mojito/source && npm install –g)• mojito test
![Page 9: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/9.jpg)
9
HELLO WORLD!• mojito create app HelloWorldApp• cd HelloWorldApp• mojito create mojit HelloMojit• cd ..• mojito start
• Browse tohttp://localhost:8666/@HelloMojit/index
![Page 10: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/10.jpg)
10
WHY MOJITO?• One language• Device aware• Use any library (jQuery, bootstrap, Dojo …)
• Best with YUI, since that’s the core• Context aware
• Server• Client• Universal!
![Page 11: Y! Open Hack 2013 (London)](https://reader035.vdocument.in/reader035/viewer/2022062614/546dee67b4af9f612c8b550c/html5/thumbnails/11.jpg)
11
WHAT’S WHERE• Yahoo! Developers
http://developer.yahoo.com• Yahoo! Cocktails
http://developer.yahoo.com/cocktails• Yahoo! Mojito
http://developer.yahoo.com/cocktails/mojito• This Presentation
http://slidesha.re/10HTCkD