Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Event Stage - 真面目に作ったけど 全くウケなくてクソだったアプリ/I ma...
Search
果物リン
January 23, 2022
Technology
220
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Event Stage - 真面目に作ったけど 全くウケなくてクソだったアプリ/I made new service but they say shit
成仏してくれ
果物リン
January 23, 2022
More Decks by 果物リン
See All by 果物リン
ADDF - ループエンジニアリングするフレームワークを作ったら/I Didn't Set Out to Build Loop Engineering, But ADDF Did
fruitriin
0
190
AIに与える人間らしさを(略)したら600ページの同人誌になった/I kept thinking about making AI more human, more, more, more... wait, when did this become a 600-page doujinshi?
fruitriin
0
150
記憶を高速で思い出す全文検索パフォーマンス・チューニング テクニック/How to make your AI recall, quickly
fruitriin
0
120
入社半年で作った"社内でも使える"ツール集/Everything I Built on the Side in Half a Year
fruitriin
0
140
embodied記憶の依代 聖杯問答/ Vessel of Memory: The Grail Dialogue #embodied_llm
fruitriin
2
240
ClaudeCodeと遠くへいくためのパーミッションルール/Stop Checking, Start Trusting: Claude Code Permission Rules
fruitriin
0
95
Claude Codeと物忘れ / Invitation talk about context - Why Claude Code forget?
fruitriin
0
140
Claude Codeと2つの巻き戻し戦略 / Two Rewind Strategies with Claude Code
fruitriin
0
290
Electron+Vue+Swift=真のデスクトップアプリ / How to create "Really" desktop app using Electron
fruitriin
0
160
Other Decks in Technology
See All in Technology
オンラインゲームのシステム全体像 - コロプラ 2026年度 新卒研修
colopl
0
330
カンファレンスに参加した後の浮遊感とセルフケア
pauli
0
310
営業オントロジーの作り方と、エージェントからの辿り方 ── ナレッジワークの現場から
kworkdev
PRO
1
250
形式手法を使って仕様をコーディングしよう
mikanichinose
0
170
Lambda MicroVMsが分からなすぎたので使い所を1から考えてみた
tsukuboshi
2
350
メルペイ 会計システム概要と歴史
mewuto
0
100
おそらく日本で唯一のDevRelインターン生として
husengs7
0
170
データ品質を壊しながらSnowflakeのAIに分析させてみた
kawanago
0
480
いちAWSエンジニアのAI活用を振り返る #devio2026 / devio osaka 2026 kawahara
masahirokawahara
2
360
ファミコンでPHPを動かす / PHP on the Famicom side b
tomzoh
0
130
BedrockとLambdaで作る リアルタイム進行型推理ゲーム
kawametho
0
180
Google Cloud Next Tokyo 26登壇時のスクリプト
recruitengineers
PRO
0
180
Featured
See All Featured
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
6
1.2k
Balancing Empowerment & Direction
lara
6
1.3k
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
300
The Art of Programming - Codeland 2020
erikaheidi
57
14k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
aleyda
1
1.6k
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
530
The Invisible Side of Design
smashingmag
301
52k
Fireside Chat
paigeccino
43
4k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.6k
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
New Earth Scene 8
popppiees
4
2.6k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
1
420
Transcript
!"#$%&'() +,-./,0 123&' 456 ՌϦϯ@FruitRiin גࣜձࣾελσΟετ 2022/01/22 TechCommit ΫιΞϓϦίϯςετ
ΫιΞϓϦ͡Όͳ͍ ͱ͍͏ۤΜͯ͡ ड͚ೖΕ·͢
789:*;*<=>?@A??B • ՌϦϯ@FruitRiin • GitHub, Twitter, Qiita... • Vue.js͕͖ʂReactʁ৮ͬͨ͜ͱͳ͍Ͱ͢Ͷ •
Vue3 on ElectronͰϑΝΠϥ࡞ͬͯ·͢
ࠓճΫιΞϓϦͷ
։ൃͷಈػ
ΦϯϥΠϯͷΠϕϯτ͕ ΦϑϥΠϯΑΓָ͘͠ͳ͍ʂʂ
CDEFGHIJIKJL Ԡ͕Ͱݟ͑Δ
CDEFJHIJIKJL அ͕͋Δ ଘࡏײ͕Θ͔Βͳ͍
ίϯηϓτ
MNOB@*P@QROSJT5L • LTதʹ؍٬ͷϦΞΫγϣϯ͕શ͘Θ͔Βͳ͍ɺָ͘͠ͳ͍ • ొஃதͷνϟοτʹؾ͔ͮͳ͍ɺर͑ͳ͍ • ͰͩΊͳΒԻͳΒΘ͔ΔͷͰʁ • →νϟοτͨ͠ΒԻ͕໐ΔαʔϏε •
ը໘ڞ༗ػೳͳͲͷ৴ػೳॾʑࡌͤΑ͏
σϞ
None
ࢀՃऀͷײ
UVWXYZ • ؍٬ʮൃදதʹಡΈ্͛ΒΕΔͱࢥ͏ͱνϟοτͮ͠Β͍ʯ • ొஃऀʮൃදதʹಡΈ্͛ΒΕΔͱฉ͘ํʹूதͯ͠͠·ͬͯ Γ͕ࢭ·ͬͯ͠·͏ʯ
ΫιΞϓϦͳͷͰʁ
Θ͔ͨͪ͠Β͖ͭ·ͨ͠ ͓͓ɺΏ͏͠ΌΑ ͠ΜͰ͠·͏ͱɹͳ͚͞ͳ͍
None
None
None
ٕज़ελοΫղઆ
[\]^_1 • ϑϩϯτΤϯυϑϨʔϜϫʔΫɿVue3 • αʔόʔɿnetlify • ͨ͠ϥΠϒϥϦͱ͔ • ө૾৴ɿSkyWay •
ಡΈ্͛ɿGoogle Cloud Text-to-Speech + Functions
`D • Vue3 • Vue͍͍ͧ • Netlify • Reactͱ͔Vueͱ͔ͷϦϙδτϦΛ
ಉظͨ͠ΒWebϖʔδެ։ͯ͘͠ΕΔ͍ͭͩ͢͝Α
PabcQb • ʮϏσΦɾԻ௨ͷػೳΛ͔ΜͨΜʹ࣮Ͱ͖ΔɺϚϧνϓ ϥοτϑΥʔϜͳSDKͰ͢ɻʯ • WebRTC͍ͬͯ͏ϓϩτίϧΛͬͯΔ • ͦΕʹ͍ͭͯৄ͘͠ͳͯ͘Α͍ • ௨৴ྔ͕গͳͯ͘ݸਓͳΒλμͰ͔ͭ͑Δ͔Β͓ࢼ͠ʹGood
deeRfO*gfe>h*@Oi@*@e*jkOOlm*nop • ຊޠͱ͔ಥͬࠐΉͱԻΛฦͯ͘͠ΕΔ • Cloud Functions ͰຊޠΛ͢ →͜ͷAPIͰԻʹม
qrs)tu • Text to Speech APIͷnode SDKͷΓ͕ base64͡Όͳ͍ • Unit8Array
ͬͯԿʁʁʁ
async function tts(text){ const res = await fetch(BASE_URL + `tts?text=${text}`).then((res)
=> res.json()) const u8 = new Uint8Array(res[0].audioContent.data) return arrayBufferToBase64(u8) } function arrayBufferToBase64(buffer: Uint8Array) { let binary = "" const bytes = new Uint8Array(buffer) const len = bytes.byteLength for (let i = 0; i < len; i++) { binary += String.fromCharCode(bytes[i]) } return window.btoa(binary) } ˎΠϝʔδ
vwx • νϟοτνϟοτͱͯ͠ɺΤϞʔγϣϯΛଧͯΔΑ͏ʹ͢Δ • ΤϞʔγϣϯʹ͚ͩରԠͨ͠Ի͕໐Δ • →ഥखͱ͔ͼͬ͘Γͱ͔ͷԻͰྟײΛײ͡Δ • →࣮νϟοτͷԻಡΈ্͛ඞཁͳ͔ͬͨʁʁʁ
࠷ߴͷΦϯϥΠϯΠϕϯτڥ ٻΉ Fin.