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
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
果物リン
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
200
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
96
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
全人類(ほぼ)AWS Organizations の上でAWSを利用している、その世界を知る話
htan
1
140
おそらく日本で唯一のDevRelインターン生として
husengs7
0
170
AI 時代の Azure エンジニアリング ~ 私たちは何を磨き、何を任せるのか ~
chack411
1
590
今さら理解するウェブフォントver.2026
takanorip
3
680
生成AIで高い生産性を求められて、 悩み、乗り越えた話
mot_techtalk
2
170
宣言型部分更新は何を解決しどこへ向かうのか
shuta13
1
310
実践!Cloud Run ハンズオン!! / Cloud Run handson
y0hgi
0
220
ブラウザとサーバーから考えるAI時代のフロントエンド監視
shogo4131
3
850
Essential architectural thinking (revised edition)
ufried
0
110
LLM機能を自作して分かるSnowflake Cortex AIの強み
nayuts
0
360
「Docker Desktop不要の時代」は 来たのか?
ueponx
0
540
子育てエンジニアの可処分時間が減っても成長を諦めない戦い方
sudoakiy
6
4.5k
Featured
See All Featured
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
3.1k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
7k
Principles of Awesome APIs and How to Build Them.
keavy
128
18k
Navigating Weather and Climate Data
rabernat
0
550
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
18k
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
560
How Software Deployment tools have changed in the past 20 years
geshan
2
35k
ラッコキーワード サービス紹介資料
rakko
1
5.3M
Building Applications with DynamoDB
mza
96
7.2k
エンジニアに許された特別な時間の終わり
watany
109
250k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
1
430
Highjacked: Video Game Concept Design
rkendrick25
PRO
1
480
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.