Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WebComponentsで フレームワークを1ページに共存させる

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Takuya Nishio Takuya Nishio
March 08, 2024
Programming
930
0

WebComponentsで フレームワークを1ページに共存させる

エンジニアの自由研究発表会vol.9

Avatar for Takuya Nishio

Takuya Nishio

March 08, 2024

More Decks by Takuya Nishio

See All by Takuya Nishio
8年以上RailsのWebサービスをメンテしてわかったこと
Avatar for Takuya Nishio webuilder240
0
130
スタートアップでどのようにAutifyを活用しているか
Avatar for Takuya Nishio webuilder240
0
300
payjp-anti-pattern
Avatar for Takuya Nishio webuilder240
0
140

Other Decks in Programming

See All in Programming
人間の目はかわらない、だからJPEGは30年もつ
Avatar for yuzneri yuzneri
12
19k
30年振りにコンパイラの定数整数除算を改善した
Avatar for herumi herumi
9
4.1k
自動化したのに回らない テスト運用の壁 ―AI時代の品質責任と生産性
Avatar for Masahiko Funaki(舟木 将彦) mfunaki
0
430
AI Readyの正体はデータマネジメントだ メダリオン2.0の最前線
Avatar for freee freee
PRO
0
360
KotlinConf Extended South Korea 2026 Keynote
Avatar for HyunWoo Lee l2hyunwoo
0
120
片田舎のおっさん、 Swift Buildのダイアモンド問題解決の不具合修正PRを出すが、解決方法がキャッシュをしないようにすることであり、ビルド時間が伸びると言われてマージされないので高速化もする/swiftbuild
Avatar for yimajo yimajo
0
270
Pythonの実行はどこまで賢くなったのか？ CPythonとPyPyから見る最適化のしくみ
Avatar for curekoshimizu curekoshimizu
3
1.8k
[PyCon KR 2026] More Variants, More Diversity for AI Accelerators
Avatar for Joongi Kim achimnol
0
110
進化を続けるGo toolsの現在地 / The Current State of Ever-Evolving Go Tools
Avatar for hond hond0413
0
250
PostgreSQL 18で考えるUUID主キー
Avatar for Kazuhiro Seo kazuhiro1982
0
500
PyConJP2026_wat_Python × Signal Processing: How to Draw Pictures with Sound Using Spectrogram Art
Avatar for wat wat
0
290
Flow は今どうなっているか
Avatar for mizdra mizdra
PRO
0
680

Featured

See All Featured
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
57
14k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
249
1.3M
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
5.1k
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
260
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
2.1k
The browser strikes back
Avatar for Jono Alderson jonoalderson
0
1.5k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
163
24k
Mind Mapping
Avatar for Hélio Medeiros helmedeiros
PRO
1
330
Leadership Guide Workshop - DevTernity 2021
Avatar for David Neal reverentgeek
1
340
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
620
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
32
3k
End of SEO as We Know It (SMX Advanced Version)
Avatar for Michael King ipullrank
3
4.4k

Transcript

  1. 8FC$PNQPOFOUTͰ ϑϨʔϜϫʔΫΛϖʔδʹڞ ଘͤ͞Δ 1 自 vol. 9

  2. 2 西 @webuilder 24 0

  3. 3 自己 ・ SaaS ・ Web WebComponents 心

  4. Web 4

  5. 5

  6. 🥺 6

  7. 入 7

  8. 日 8

  9. 9 Web Components

  10. 10 Web Components Custom Elements 自 HTML JS HTML Vue

    React CSS GitHub Salesforce

  11. 11 Vue React CSS connectedCallback disconnectedCallback DOM

  12. 12 Web Components

  13. 13 React ・ Vue 比 WebComponents Web HTML 一 CSS

    SSR

  14. 14 行 Vue.js React 行 CustomElement WebComponents

  15. 15

  16. 16

  17. 17

  18. 18 https://ace-resolver- 39930 5 .web.app/

  19. 19 色 Vue Svelte Preact WebComponents 立

  20. 20

  21. 21 HTML

  22. 22 WebComponents Vue

  23. 23 CustomElements 行 createApp Vue React

  24. 24 Intersection Observer WebComponents 面 示 JS

  25. 25 GitHub https://github.com/webuilder 24 0 /sample-webcomponents-project

  26. 26 方 WebComponents Astro SSR

  27. 27

  28. 28 用 WebComponents 用 Vue 50 行

  29. 29 WebComponents Svelte ・ React ・ Vue 方 npm WebComponents

  30. 30 心 WebComponents 色 https://zenn.dev/p/osiro

  31. None