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
What is Web Components
Search
takanorip
August 31, 2017
Technology
0
53
What is Web Components
takanorip
August 31, 2017
Tweet
Share
More Decks by takanorip
See All by takanorip
Webフォント選定の極意!フォントの基本から最新トレンドまで徹底解説
takanorip
5
670
効果的な管理画面を デザインをするために 避けるべき5つの罠
takanorip
14
6.1k
社内管理画面のデザインもプロダクトデザイン
takanorip
4
1.5k
早わかり W3C Community Group
takanorip
0
410
Ubieとアクセシビリティのこれからを考える
takanorip
0
390
2023年版 デザインシステム 技術選定の勘所 - フロントエンドカンファレンス沖縄
takanorip
2
3.7k
Astroで始める爆速個人サイト開発
takanorip
15
11k
後悔しないデザインシステムの始め方
takanorip
4
3.1k
デザインシステム運用とOKRの良い関係
takanorip
0
1.9k
Other Decks in Technology
See All in Technology
CDCL による厳密解法を採用した MILP ソルバー
imai448
3
210
Mastering Quickfix
daisuzu
1
300
心が動くエンジニアリング ── 私が夢中になる理由
16bitidol
0
110
アジャイルでの品質の進化 Agile in Motion vol.1/20241118 Hiroyuki Sato
shift_evolve
0
190
100 名超が参加した日経グループ横断の競技型 AWS 学習イベント「Nikkei Group AWS GameDay」の紹介/mediajaws202411
nikkei_engineer_recruiting
1
170
【Startup CTO of the Year 2024 / Audience Award】アセンド取締役CTO 丹羽健
niwatakeru
0
1.4k
【令和最新版】AWS Direct Connectと愉快なGWたちのおさらい
minorun365
PRO
5
780
強いチームと開発生産性
onk
PRO
36
12k
Oracle Cloud Infrastructureデータベース・クラウド:各バージョンのサポート期間
oracle4engineer
PRO
29
13k
開発生産性を上げながらビジネスも30倍成長させてきたチームの姿
kamina_zzz
2
1.7k
データプロダクトの定義からはじめる、データコントラクト駆動なデータ基盤
chanyou0311
3
360
マルチプロダクトな開発組織で 「開発生産性」に向き合うために試みたこと / Improving Multi-Product Dev Productivity
sugamasao
1
310
Featured
See All Featured
Imperfection Machines: The Place of Print at Facebook
scottboms
265
13k
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.2k
5 minutes of I Can Smell Your CMS
philhawksworth
202
19k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
26
2.1k
Typedesign – Prime Four
hannesfritz
40
2.4k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
900
10 Git Anti Patterns You Should be Aware of
lemiorhan
655
59k
The Invisible Side of Design
smashingmag
298
50k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
48k
Designing for humans not robots
tammielis
250
25k
Why Our Code Smells
bkeepers
PRO
334
57k
Transcript
8IBUJT 8FC $PNQPOFOUT 5BLBOPSJ0LJ
ࠂ
݄ ٕज़ॻయ!ΞΩόεΫΤΞ ࢀՃ͠·͢ʂ
None
ʮ8FC$PNQPOFOUTͰ ΣϒαΠτΛͭ͘Ζ͏ʯ Έ͍ͨͳײ͡ͷຊग़͠·͢
ങ͍ͬͯͩ͘͞ʂ
技術書典3…? • 技術書だけの同人ࢽのイベント • 技術書のൢ売が中心 • 今回で3回目の開催 • 今回初めてのサークル参加です!
8FC$PNQPOFOUT
ίϯϙʔωϯτࢦ
コンポーネント指向 • ウェブサイトをパーツ単位でデザイン、管理 していこうという考え方 • パーツを再利用することで、保守性や 開発スピードを上げる • Atomic Designなどが有名
None
実装方法
JSフレームワークや ライブラリを使う (React、Vueなど)
ΊΜͲ͍͘͞ʂʂʂ
めんどくさい理由 • フレームワーク、ライブラリごとに書き方が 違うので互換性がない • フレームワークの開発が終了する危険がある
8FC$PNQPOFOUT
Web Components • Webの標準技術 • UIのカプセル化ができる • 特定のフレームワークなどに依存しない • ブラウザの対応が進んできている
ブラウザ対応状況
None
まだ対応できていない ブラウザもある ↓ Polyfillが必要
1PMZNFS
Polymer • Google製のJSライブラリ • Web ComponentsのPolyfill • YouTubeの新しいUIはPolymerを使ってる
Web Componentsは Webフロントエンドの 銀の弾丸になれるのか…?
Έ͍ͨͳײ͡ͷຊΛग़͢ͷͰ Έͳ͞Μ ΑΖ͓͘͠ئ͍͠·͢ʂ
͓ΘΓ