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

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

Avatar for Takuya Nishio Takuya Nishio
March 08, 2024
Programming
910
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
Built Our Own Background Agent at LayerX #aidevex_findy
Avatar for LayerX layerx
PRO
9
4.3k
自動化したのに回らないテスト運用の壁ーAI時代の品質責任と生産性
Avatar for Masahiko Funaki(舟木 将彦) mfunaki
0
120
アルゴリズムは何を圧縮しているのか ─ Haskell から育った「圧縮代数」というメンタルモデル
Avatar for Naoya Ito naoya
16
3.7k
AWS DevOps AgentのAzure接続機能を検証して見えた活用法／Use Cases Verified for the AWS DevOps Agent's Azure Connectivity Feature
Avatar for モブエンジニア（Masaki Okuda） masakiokuda
1
190
変わらないものが、変わるものを決める — 意図駆動開発 × イベントソーシング × イミュータブル | What Doesn't Change Decides What Can — IDD × Event Sourcing × Immutability
Avatar for Tomohisa Takaoka tomohisa
0
970
20260722_microCMSで考える、AI時代のコンテンツ運用設計
Avatar for Yoshihisa Kaino yosh1
0
190
【SRE NEXT 2026 Lunch Session】一人目専任SREの立ち上げを加速する ― AIと進めたオンボーディングで2分を0.04秒にした話
Avatar for PKSHA Technology（パークシャテクノロジー） pkshadeck
PRO
0
3.3k
地域 SRE コミュニティ最前線 - ホンマでっかSRE勉強会
Avatar for tk3fftk tk3fftk
0
290
AI時代、エンジニアはどう育つのか -未経験エンジニアの成長を間近で見て考えたこと-
Avatar for ta-hasunuma thasu0123
0
210
2年かけて Deno に DOMMatrix を実装した話 / How I implemented DOMMatrix in Deno over two years
Avatar for petamoriken / 森建 petamoriken
0
190
コーディングルールの鮮度を保ちたい for SRE NEXT 2026 / keep-fresh-go-internal-conventions-sre-next-2026
Avatar for NAGATA Hiroaki handlename
0
160
Apache Hive: Toward a Cloud Native Lakehouse
Avatar for okumin okumin
0
170

Featured

See All Featured
The SEO identity crisis: Don't let AI make you average
Avatar for Varn varn
0
520
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.7k
Discover your Explorer Soul
Avatar for Emna emna__ayadi
2
1.2k
Kristin Tynski - Automating Marketing Tasks With AI
Avatar for Tech SEO Connect techseoconnect
PRO
0
420
The innovator’s Mindset - 
Leading Through an Era of Exponential Change - McGill University 2025
Avatar for Jean-Marc De Jonghe jdejongh
PRO
1
230
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
210k
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.2k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
2.1k
We Are The Robots
Avatar for Honza Javorek honzajavorek
0
290
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
82
6.5k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
31
6k
svc-hook: hooking system calls on ARM64 by binary rewriting
Avatar for Akira Moroo retrage
2
420

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