Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
How to create JavaScript apps for Java portals
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Zeno Rocha
April 25, 2013
Programming
730
7
Share
How to create JavaScript apps for Java portals
JAX Conference - Mainz, 2013
Zeno Rocha
April 25, 2013
More Decks by Zeno Rocha
See All by Zeno Rocha
The Next Generation of Developer-First Products
zenorocha
1
710
7 Habits of Highly Productive Developers
zenorocha
1
440
7 Hábitos de Desenvolvedores Altamente Produtivos
zenorocha
1
570
What's new in the Liferay Community
zenorocha
0
730
Launching Liferay Projects Faster with WeDeploy
zenorocha
1
610
How Liferay fits into the real of latest technologies
zenorocha
0
680
Estoicismo e JavaScript
zenorocha
3
1.2k
Por que ninguém se importa com seu novo projeto open source?
zenorocha
2
1.2k
Como investir em... você!
zenorocha
1
620
Other Decks in Programming
See All in Programming
oxlintはeslint/typescript-eslintを置き換えられるのか
shomafujita
2
240
生成AI時代にこそ効くGo | Why Go Works in the Age of Generative AI
mom0tomo
7
2.4k
権限チェックの一貫性を型で守る TypeScript による多層防御
mnch
4
670
Oxlintはいかにしてtsgolintのlint ruleを呼び出しているのか
syumai
1
520
RTSPクライアントを自作してみた話
simotin13
0
200
Skillは並べた。動かなかった。契約で繋いだ。— 65個のSkillから、自走する開発サイクルへ
junholee
0
760
開発とはなにか、Essenceカーネルで見えるもの
ukin0k0
0
210
LLM Plugin for Node-REDの利用方法と開発について
404background
0
110
CLIであることを活かしたGitHub Copilot CLI活用術 / GitHub Copilot CLI Pro Tips & Tricks
nao_mk2
1
1.1k
運用エージェントは "作る" から "育てる" へ - 記憶と自己進化の3層設計パターン / self-evolving-agents-three-layer-agent-design
gawa
12
3k
ユニットテストの先へ:テスト技法で要求・仕様を整理するJava開発実践 / Beyond_Unit_Testing_Practical_Java_Development_Techniques_for_Organizing_Requirements_and_Specifications
shimashima35
0
220
Inside Stream API
skrb
1
210
Featured
See All Featured
Sam Torres - BigQuery for SEOs
techseoconnect
PRO
0
270
Organizational Design Perspectives: An Ontology of Organizational Design Elements
kimpetersen
PRO
1
710
BBQ
matthewcrist
89
10k
Facilitating Awesome Meetings
lara
57
6.9k
Into the Great Unknown - MozCon
thekraken
41
2.5k
Darren the Foodie - Storyboard
khoart
PRO
3
3.3k
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
1
550
Navigating Team Friction
lara
192
16k
Evolving SEO for Evolving Search Engines
ryanjones
0
200
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
150
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
0
120
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Transcript
how to create high scalable javascript apps for java portals
Mainz, 2013.
None
I’m from brazil
None
None
I ♥ opensource
I ♥ jQuery
jqueryboilerplate.com
I ♥ HTML5
html5-pro.com/wormz
today we’re going to talk about javascript...
None
just a toy language?
triggerrally.com/x/Preview/Arbusu/drive
None
what about jQuery?
None
goo.gl/rfaLs
why should I care?
because your UI suck
let’s create a high scalable javascript application
None
option #1 write everything from scratch
option #2 use existing open source solutions
Events, Selection, DOM Manipulation, Animation, Ajax requests jquery.com
mootools.net
UI components twitter.github.io/bootstrap
jqueryui.com
Templates mustache.github.io
handlebarsjs.com
Module loader requirejs.org
headjs.com
MV* backbonejs.org
knockoutjs.com
angularjs.org
emberjs.com
Tests BDD TDD pivotal.github.io/jasmine
qunitjs.com
None
None
we build java portals
our solution has more than 4,000,000 downloads
and over 500,000 deployments worldwide
so how can we create an easy-to-maintain UI architeture?
None
yuilibrary.com
and we created our own superset of components
AlloyUI
alloyui.com
YUI = effects DOM ajax events ... MVC
YUI = effects DOM ajax events ... MVC
YUI = effects DOM ajax events ... MVC
YUI = effects DOM ajax events ... MVC
YUI = effects DOM ajax events ... MVC
YUI = effects DOM ajax events ... MVC
YUI = effects DOM ajax events ... MVC
AlloyUI = calendar tabs buttons carousel ... audio
AlloyUI = calendar tabs buttons carousel ... audio
AlloyUI = calendar tabs buttons carousel ... audio
AlloyUI = calendar tabs buttons carousel ... audio
AlloyUI = calendar tabs buttons carousel ... audio
AlloyUI = calendar tabs buttons carousel ... audio
AlloyUI = calendar tabs buttons carousel ... audio
None
JavaScript
None
YUI
None
AlloyUI
alloyui.com/examples/carousel
alloyui.com/examples/diagram-builder
alloyui.com/examples/image-cropper
alloyui.com/examples/viewport
but I’m a java guy!
<taglibs> \o/
everything you need
everything you need + single api
everything you need + single api + good performance
who uses it?
developer.cisco.com
lufthansa-flight-training.com
bosch-sicherheitssysteme.de
more than 300,000 downloads
wanna know more?
find me on room Watfordsaal B at 2pm
None
“HTML5 is the future”
wanna see the future?
None
None
HTML5 is today!
Content Consumer Devices
Content Consumer Devices
old browsers are like B&W TVs
new browsers are like HD TVs
TV already solved that problem
so why developers keep doing this?
it’s up to you!
dank :)