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
Web Components: a chance to create the future
Search
Zeno Rocha
April 30, 2014
Programming
42k
310
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Web Components: a chance to create the future
April 30, 2014 @ SFHTML5
Zeno Rocha
April 30, 2014
More Decks by Zeno Rocha
See All by Zeno Rocha
The Next Generation of Developer-First Products
zenorocha
1
750
7 Habits of Highly Productive Developers
zenorocha
1
460
7 Hábitos de Desenvolvedores Altamente Produtivos
zenorocha
1
590
What's new in the Liferay Community
zenorocha
0
750
Launching Liferay Projects Faster with WeDeploy
zenorocha
1
620
How Liferay fits into the real of latest technologies
zenorocha
0
680
Estoicismo e JavaScript
zenorocha
3
1.3k
Por que ninguém se importa com seu novo projeto open source?
zenorocha
2
1.2k
Como investir em... você!
zenorocha
1
640
Other Decks in Programming
See All in Programming
FDEとは、何者なのか?
masapyon1212
0
110
AIを上手に使っていこうとしたら越境せざるを得なくなった話 〜実践1年で見えた境界を越えなければならない理由と進め方〜 / Crossing borders with AI
tomoyakitaura
2
910
FastAPI の並行処理モデルを完全に理解する
hoto17296
9
3.4k
AIエージェント時代のコードレビューを設計する
nogu66
5
1.1k
書籍「プロフェッショナルAI駆動開発」紹介スライド
juntaromatsumoto
0
870
Claude Codeを組織的に動かして月400PRを実現した話
happy_ryo
0
230
[PyCon KR 2026] More Variants, More Diversity for AI Accelerators
achimnol
0
130
in-process GraphQL のすすめ #ginzajs
izumin5210
4
1.5k
承認済みなのに差戻しできてしまうバグ、型で潰せます
shinchit
0
130
AIと壁打ちしながら進めるコスト管理
fufuhu
2
1.9k
Hono + Inertia + React で LP を構築した話
oukayuka
2
190
【DroidKaigi 2026】「アクセシビリティを利用するとき、 アクセシビリティもまたこちらを利用している」 〜マルウェアによる攻撃と防衛について〜
halunoyo
0
130
Featured
See All Featured
Site-Speed That Sticks
csswizardry
13
1.5k
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
310
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
3k
Raft: Consensus for Rubyists
vanstee
141
7.7k
Scaling GitHub
holman
464
140k
Heart Work Chapter 1 - Part 1
lfama
PRO
8
36k
What's in a price? How to price your products and services
michaelherold
247
13k
Code Reviewing Like a Champion
maltzj
528
40k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
520
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
3k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
490
Transcript
Web Components Create the future a chance to
@zenorocha
I’m from Brazil
Share! Create! Learn!
None
None
None
But there was no starter-kit =/
None
github.com/webcomponents/polymer-boilerplate
<X>
github.com/webcomponents/x-tag-boilerplate
None
github.com/webcomponents/element-boilerplate
What’s included? We encourage a series of best practices like
setting up a live demo, documenting your API, maintaining a changelog for release purposes, and sharing it in a package manager. Lifecycle Grunt tasks Bower config
None
github.com/webcomponents/generator-element
Share! Create! Learn! ✔
So people started to create elements
None
None
None
We needed a place to show these elements
Bernard De Luna Djalma Araújo Eduardo Lundgren Got some friends
together…
customelements.io
CustomElements.io 13% 24% 14% + 170 elements + 100,000 pageviews
North America South America Southern/ Western Europe Eastern/ Northern Europe 13%
How to add an element there?
bower.json
Share! Create! Learn! ✔ ✔
What’s the main reference to learn Web Components?
Addy Osmani
And a bunch of awesome people… Alex Komoroske Briza Bueno
Daniel Buchner Eric Bidelman Bernard De Luna Soledad Penadés Rob Dodson Eduardo Lundgren Sindre Sorhus Pascal Precht Bruce Lawson Mathias Bynens
None
webcomponents.github.io
Highlight great articles & talks Gather best practices Introduce useful
tools and resources Discuss API implementations
Share! Create! Learn! ✔ ✔ ✔
The best way to predict the future is to create
it.
Thank you! zenorocha.com bit.ly/wc-mailing Zeno Rocha #webcomponents @webcomponents +WebComponents
Stickers \o/