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を使ったウィジェット埋め込みの話
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
nabeliwo
April 24, 2023
Technology
0
410
Web Componentsを使ったウィジェット埋め込みの話
nabeliwo
April 24, 2023
Tweet
Share
More Decks by nabeliwo
See All by nabeliwo
多言語化対応における TypeScript の型定義を通して開発のしやすさについて考えた / TSKaigi TypeScript Multilingualization
nabeliwo
2
900
Dive into SmartHR UI
nabeliwo
3
1.2k
Snowpack で始めるバンドルレス開発 / about Snowpack
nabeliwo
0
200
おいでよ フロントエンドの森 / welcome-to-front-end
nabeliwo
0
110
React事始め
nabeliwo
0
550
お前もJavaScriptにしてやろうか〜アメーバピグ編〜
nabeliwo
0
500
React + flumptでイカ戦績グラフ化ツールを作ってみた
nabeliwo
0
190
Other Decks in Technology
See All in Technology
BPaaSオペレーション・kubell社内 n8n活用による効率化検証事例紹介
kentarofujii
0
320
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
1k
2人で作ったAIダッシュボードが、開発組織の次の一手を照らした話― Cursor × SpecKit × 可視化の実践 ― Qiita AI Summit
noalisaai
1
280
Digitization部 紹介資料
sansan33
PRO
1
6.7k
CodeRabbit CLI + Claude Codeの連携について
oikon48
1
690
入社1ヶ月でデータパイプライン講座を作った話
waiwai2111
1
190
Contract One Engineering Unit 紹介資料
sansan33
PRO
0
13k
みんなだいすきALB、NLBの 仕組みから最新機能まで総おさらい / Mastering ALB & NLB: Internal Mechanics and Latest Innovations
kaminashi
0
140
生成AI時代にこそ求められるSRE / SRE for Gen AI era
ymotongpoo
2
130
最速で価値を出すための プロダクトエンジニアのツッコミ術
kaacun
1
400
Riverpod3.xで実現する実践的UI実装
fumiyasac0921
2
350
Agentic Coding 実践ワークショップ
watany
41
28k
Featured
See All Featured
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
66
36k
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
61
52k
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
190
What's in a price? How to price your products and services
michaelherold
247
13k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
66k
Building Adaptive Systems
keathley
44
2.9k
GraphQLとの向き合い方2022年版
quramy
50
14k
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
3
440
Designing for Timeless Needs
cassininazir
0
120
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
196
71k
Fireside Chat
paigeccino
41
3.8k
Google's AI Overviews - The New Search
badams
0
900
Transcript
8FC$PNQPOFOUTΛͬͨ ΟδΣοτຒΊࠐΈͷ 5VF"OPUIFSXPSLTY4NBSU)3'SPOU&OE%FFQ%JWF OBCFMJXP 4NBSU)3ϓϩμΫτΤϯδχΞ
ࣗݾհ OBCFMJXP 4NBSU)3 ϓϩμΫτΤϯδχΞάϧʔϓ ϓϥοτϑΥʔϜ։ൃϢχοτ ϑϩϯτΤϯυΤϯδχΞ 5ZQF4DSJQU 3FBDU /FYUKTͳͲ
ϓϥοτϑΥʔϜࣄۀͷ͝հ
CONFIDENTIAL ͜͜ʹηΫγϣϯλΠτϧΛ ೖΕͯΈΑ͏ʂ
4NBSU)31MVTЌ൛ͱ w 4NBSU)3Λͬͱศརʹ׆༻͢ΔͨΊͷ֎෦ ΞϓϦέʔγϣϯΛಋೖͰ͖ΔΞϓϦετΞ w Ϣʔβʔͱ֎෦ΞϓϦέʔγϣϯύʔτφʔ Λͭͳ͙ͨΊͷ৽͍͠ίϛϡχέʔγϣϯ νϟωϧ
ࠓ͢͜ͱ
ࠓ͢͜ͱ w 1'ࣄۀͰ8FC$PNQPOFOUTΛ࠾༻ͨ͠ w ͳͥ8FC$PNQPOFOUTΛ࠾༻ͨ͠ͷ͔ w ࣮ࡍʹͬͯΈͯͲ͏͔ͩͬͨ w ࠓޙͷ1'ࣄۀͷٕज़తͳల
8FC$PNQPOFOUTͬͯ ͦͦͳΜ͚ͩͬͷ͓͞Β͍
8FC$PNQPOFOUTͱ w ࠶ར༻ՄೳͳΧελϜཁૉ w 4IBEPX%0.ʹΑΔΧϓηϧԽ w )5.-ςϯϓϨʔτʹΑΔϚʔΫΞοϓ w Σϒඪ४
8FC$PNQPOFOUTͷ"1*Λϥοϓͯ͠؆୯ʹѻ͑ ΔΑ͏ʹͨ͠ϥΠϒϥϦɻ 4NBSU)3Ͱ-JUΛ༻ͯ͠ΧελϜཁૉΛ࡞ͬͯ ͍·͢ɻ
1'ࣄۀͰ8FC$PNQPOFOUT Λ࠾༻ͨ͠
௨ۈܦ࿏ݕࡧ w ग़ൃɺతɺ௨ۈखஈΛೖྗ͢Δͱࣗಈ Ͱ௨ۈܦ࿏௨ۈඅΛग़ͯ͘͠ΕΔ w /"7*5*.&ͱ(PPHMF.BQͷ"1*Λ༻ͯ͠ ͍Δ w طଘͷैۀһฤूը໘Λ֦ு͢Δ
ΦϓγϣϯػೳΛΠϯετʔϧ
ैۀһ߲͕ΧελϚΠζ͞ΕΔ
௨ۈܦ࿏ݕࡧػೳͷٕज़తͳ༷ w Πϯετʔϧ͠ͳ͍ͱ͑ͳ͍ w Πϯετʔϧ͢Δͱैۀһใฤूը໘ʹ௨ ۈܦ࿏༻ͷϑΥʔϜΟδΣοτ͕֎෦͔Βຒ Ίࠐ·ΕΔ w ΟδΣοτͷ࣮4NBSU)3ʹͳ͍
ΟδΣοτͷ࣮͕֎ʹ͋Δཧ༝ w ࠓޙΦϓγϣϯػೳͰΠϯετʔϧ͞Εͨػೳ͕ 4NBSU)3ʹຒΊࠐ·Ε͍ͯ͘ w શͯ4NBSU)3ʹ࣮͍ͯ͘͠ͱΦϓγϣϯػೳ Ճͷʹ4NBSU)3Ͱ৽ن࣮͠ͳ͍ͱ͍͚ͳ͍ w ࠓޙSEύʔςΟΞϓϦΛ૿͍ͯ͘͠ w
֎ͷΞϓϦଆͰΟδΣοτΛ࡞Δܗʹ͍ͨ͠
ຒΊࠐΈΟδΣοτΛ 8FC$PNQPOFOUTͰ࣮͍ͯ͠·͢
ͳͥ8FC$PNQPOFOUTΛ ࠾༻ͨ͠ͷ͔
8FC$PNQPOFOUT࠾༻ཧ༝ w 4NBSU)3ଆͷΟδΣοτຒΊࠐΈͷهड़Λ γϯϓϧʹ͔ͨͬͨ͠ w ΟδΣοτ֎͔ΒͷӨڹΛड͚ͣɺ֎ʹӨ ڹΛ༩͑ͳ͍ܗʹ͔ͨͬͨ͠ w 4NBSU)3ͷϑϩϯτΤϯυͷෳࡶੑͷഎܠ
ΟδΣοτຒΊࠐΈΛγϯϓϧʹ w ࠓޙຒΊࠐΈ͍ͨΞϓϦͷɺΟδΣοτͷ ͲΜͲΜ૿͍͑ͯ͘ఆ w ͭͳ͗͜Έ෦Λγϯϓϧʹ͠ͱ͔ͳ͍ͱޙʑ ා͍ w 8FC$PNQPOFOUTͰ͋Ε4NBSU)3ଆ +4ΛಡΈࠐΜͰΧελϜཁૉΛݺͿ͚ͩ
ຒΊࠐΈ࣮ͷྲྀΕ w ຒΊࠐΈ͍ͨΞϓϦଆͰίϯϙʔωϯτΛ࣮ ͢Δ w ΧελϜཁૉ໊ͱϏϧυͨ͠+4ͷύεΛ 4NBSU)3ʹ͢ w 4NBSU)3ଆΒͬͨใΛઃఆϑΝΠϧͰ ཧ͢Δ
˞IBNMͰ͢ ˞આ໌͍͢͠Α͏৭ʑม͑ͯॻ͍ͯ·͢
4NBSU)3 ௨ۈܦ࿏ݕࡧ ϑΥʔϜ࣮ σʔλϕʔε 8FC$PNQPOFOUT ʹΑΔΧελϜ ϑΥʔϜ࣮ Ϗϧυͨ͠+4 ૢ࡞ Ϗϧυ
$IBOHF&WFOU %JTQBUDI 4VCTDSJCF ߋ৽
௨ۈܦ࿏ݕࡧػೳͷ8FC$PNQPOFOUTͱ 4NBSU)3ͷΓऔΓ ΠϕϯτͷEJTQBUDIͱTVCTDSJCFͷΈ
ӨڹΛ༩͑ͳ͍ܗʹ͔ͨͬͨ͠ w 8FC$PNQPOFOUTͰ͋ΕΧελϜԽ͞Εͯ ͍ΔͷͰɺ4NBSU)3ଆͷάϩʔόϧͳελΠ ϧͷӨڹΛड͚ͳ͍ w 8FC$PNQPOFOUTͷ࣮ʹΑΓ4NBSU)3 ଆͷ6*Λյ͞ͳ͍
ͦΕͬͯ3FBDUͰྑ͍ͷͰʜʁ
4NBSU)3ͷϑϩϯτΤϯυͷෳࡶੑ w ैۀһใΛมߋ͢Δํ๏ैۀһใฤूը໘ ͱਃϑΥʔϜͷ௨Γ͋Δ w ैۀһใฤूը໘IBNM K2VFSZɺਃ ϑΥʔϜ3FBDUͰಈ͍͍ͯΔ w ͲͪΒͷύλʔϯͰಉ͡ܗࣜͰѻ͏ͨΊʹ
8FC$PNQPOFOUTʹ͍ͯ͠Δ
࣮ࡍʹͬͯΈͯͲ͏͔ͩͬͨ
ྑ͔ͬͨͱ͜Ζ w બఆཧ༝ʹॻ͍࣮ͨݱ͍ͨ͜͠ͱશͯͳ͘ ࣮ݱͰ͖ͨ w 4NBSU)3ͷෳࡶͳࣄΛ8FC$PNQPOFOUT ଆྀ͕͢Δඞཁ͕ͳ͍ w γϯϓϧͳΠϯλʔϑΣʔε
͍͠ͱ͜Ζ w 4NBSU)36*͕͑ͳ͍😭 w %JTQBUDIͱ4VCTDSJCFͷΈͱ͍͏औΓܾΊ͠ ͯΔ͕ɺϧʔϧ؆୯ʹΔͿ͜ͱ͕Ͱ͖Δͷ ͰSEύʔςΟʹಉ͡ΓํΛͤ͞Δͷةͳ͍
w 4NBSU)3ͷϓϩμΫτͰ൚༻తʹ͑Δ3FBDU ίϯϙʔωϯτू w #VUUPO *OQVUͳͲͷγϯϓϧͳཁૉͪΖ Μɺ%JBMPH%SPQEPXO %BUF1JDLFSͷΑ͏ͳ ෳࡶͳͷ͋Γͱͯศར
4NBSU)36*͕͑ͳ͍😭 w 4NBSU)3ͷ6*ͷ$44Λίϐʔͯ͠͏Έ͍ͨ ͳ͜ͱΛ͍ͯͨ͠ w ෳࡶͳͷ͍͠ͷͰɺಉ͡%BUF1JDLFSͳͷ ʹϑΥʔϜ͝ͱʹݟͨҧ͏ͱ͍͏͜ͱʹͳͬͯ ͠·ͬͨ
4NBSU)36* 8FC$PNQPOFOUT
ࠓޙΛݟਾ͑ͨ੬ऑੑͷ w 8FC$PNQPOFOUTͷίʔυ͕4NBSU)3Ͱ ࣮ߦ͞ΕΔͨΊɺΖ͏ͱࢥ͑ͳΜͰͰ͖Δ w SEύʔςΟʹຒΊࠐΈΟδΣοτΛ։์͢Δ ͱ͖αϯυϘοΫεԽͷΈΛ༻ҙ͠ͳ͍ͱ ͍͚ͳ͍
ࠓޙͷ1'ࣄۀͷٕज़తͳల
w 4NBSU)36*ͷ8FC$PNQPOFOUTԽ w αϯυϘοΫεԽͷٕज़ݕ౼
4NBSU)36*ͷ8FC$PNQPOFOUTԽ w 3FBDU 7VF 7BOJMMB FUDʜͲ͔͜ΒͰ͑Δ Α͏ʹ͍ͨ͠ w 4NBSU)36*Λγϡοͱ8FC$PNQPOFOUTʹ ஔ͖͑Δͷ͍͠
w ·ͣCVUUPOͳͲͷ؆୯ͳ6*Λม͍͑ͯ͘ͳ ͲΛͯ͠ࢼ͍͖͍ͯͨ͠
αϯυϘοΫεԽͷٕज़ݕ౼ w JGSBNF w 2VJDL+4Λ8BTNԽ͢Δ w 8FC8PSLFS w 4IBEPX3FBMN"1*
ࠓޙͷϓϥοτϑΥʔϜͷల։ʹ ͝ظ͍ͩ͘͞ʂʂʂʂ
࠷ޙʹ
4NBSU)3ΤϯδχΞΛืू͍ͯ͠·͢ʂʂ 4NBSU)3ΤϯδχΞ࠾༻<ݕࡧ>
͋Γ͕ͱ͏͍͟͝·ͨ͠