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

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

Avatar for Takuya Nishio Takuya Nishio
March 08, 2024
Programming
0
690

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

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

Takuya Nishio

March 08, 2024
Tweet

More Decks by Takuya Nishio

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

Other Decks in Programming

See All in Programming
なぜ「共通化」を考え、失敗を繰り返すのか
Avatar for Rinchoku rinchoku
1
510
AIエージェントはこう育てる - GitHub Copilot Agentとチームの共進化サイクル
Avatar for Akira Kobori koboriakira
0
380
5つのアンチパターンから学ぶLT設計
Avatar for Narihara narihara
1
110
エラーって何種類あるの？
Avatar for Takuma Kajikawa kajitack
5
310
今ならAmazon ECSのサービス間通信をどう選ぶか / Selection of ECS Interservice Communication 2025
Avatar for Tetsuya Kikuchi tkikuc
20
3.6k
プロダクト志向ってなんなんだろうね
Avatar for RightTouch righttouch
PRO
0
160
既存デザインを変更せずにタップ領域を広げる方法
Avatar for Tiphaine tahia910
1
240
なんとなくわかった気になるブロックテーマ入門/contents.nagoya 2025 6.28
Avatar for Chiaki Okamoto chiilog
1
210
ニーリーにおけるプロダクトエンジニア
Avatar for Nealle nealle
0
490
KotlinConf 2025 現地で感じたServer-Side Kotlin
Avatar for Takehata Naoto n_takehata
1
230
生成AIコーディングとの向き合い方、AIと共創するという考え方 / How to deal with generative AI coding and the concept of co-creating with AI
Avatar for shiro seike seike460
PRO
1
330
ASP.NETアプリケーションのモダナイズ インフラ編
Avatar for tomokusaba tomokusaba
1
410

Featured

See All Featured
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
32
1k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
42
7.3k
Designing Experiences People Love
Avatar for Jonathan Moore moore
142
24k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
94
14k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
179
9.8k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
36
2.8k
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
17
940
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
7
700
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
63
7.8k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
126
17k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
34
5.9k
Visualization
Avatar for Eitan Lees eitanlees
146
16k

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