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
GASで始めるサーバーレス 頑張らない社内アプリケーション開発
Search
t-yng
August 31, 2019
Technology
1
290
GASで始めるサーバーレス 頑張らない社内アプリケーション開発
builderscon tokyo 2019 LT 登壇資料
https://builderscon.io/tokyo/2019
t-yng
August 31, 2019
Tweet
Share
More Decks by t-yng
See All by t-yng
ChatGPTを活用した英文添削アプリケーション個人開発.pdf
tyng
0
51
型からモックデータ生成コードを自動生成する
tyng
0
42
WebAssemblyでオセロを作ってみた
tyng
0
350
Other Decks in Technology
See All in Technology
Terraform Stacks入門 #HashiTalks
msato
0
360
『Firebase Dynamic Links終了に備える』 FlutterアプリでのAdjust導入とDeeplink最適化
techiro
0
130
Taming you application's environments
salaboy
0
190
リンクアンドモチベーション ソフトウェアエンジニア向け紹介資料 / Introduction to Link and Motivation for Software Engineers
lmi
4
300k
Lexical Analysis
shigashiyama
1
150
安心してください、日本語使えますよ―Ubuntu日本語Remix提供休止に寄せて― 2024-11-17
nobutomurata
1
1k
第1回 国土交通省 データコンペ参加者向け勉強会③- Snowflake x estie編 -
estie
0
130
Adopting Jetpack Compose in Your Existing Project - GDG DevFest Bangkok 2024
akexorcist
0
110
IBC 2024 動画技術関連レポート / IBC 2024 Report
cyberagentdevelopers
PRO
1
110
誰も全体を知らない ~ ロールの垣根を超えて引き上げる開発生産性 / Boosting Development Productivity Across Roles
kakehashi
1
230
SRE×AIOpsを始めよう!GuardDutyによるお手軽脅威検出
amixedcolor
0
170
Amplify Gen2 Deep Dive / バックエンドの型をいかにしてフロントエンドへ伝えるか #TSKaigi #TSKaigiKansai #AWSAmplifyJP
tacck
PRO
0
390
Featured
See All Featured
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.3k
Speed Design
sergeychernyshev
25
620
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
840
Statistics for Hackers
jakevdp
796
220k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
The Invisible Side of Design
smashingmag
298
50k
Designing for humans not robots
tammielis
250
25k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
Building Adaptive Systems
keathley
38
2.3k
Fireside Chat
paigeccino
34
3k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
665
120k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
246
1.3M
Transcript
GASͰ࢝ΊΔαʔόʔϨε ؤுΒͳ͍ࣾΞϓϦέʔγϣϯ։ൃ Builderscon Tokyo 2019 LT
ࣗݾհ • ༄ ྙߒʢͳ͗ ͱͻΖʣ • @TGreenmonkey (t-yng) • Hamee
גࣜձࣾ ɾϑϩϯτΤϯυ͕͖ ɾझຯͰ Flutter Λษڧத
ձࣾͰͷͱ͋ΔͰ͖͝ͱ...
͓ޓ͍ͷ͜ͱΛΔͨΊʹ ࣾ༻ͷࣾһͷϓϩϑΟʔϧ ϖʔδΛ࡞ͬͯ΄͍͠Ͱ͢ ͍͍Ͱ͢Α
͓ޓ͍ͷ͜ͱΛΔͨΊʹࣾһ ͷϓϩϑΟʔϧϖʔδΛ࡞ͬͯ ΄͍͠Ͱ͢ ͍͍Ͱ͢Α ࣾͷϓϩϑΟʔϧϖʔδΛ ։ൃ͢Δ͜ͱʹͳͬͨ
ϓϩϑΟʔϧϖʔδͷཁ݅ ɾࣾͷϓϩϑΟʔϧϖʔδ͕ཉ͍͠ ɾϓϩϑΟʔϧใࣾһ͕ࣗ༝ʹฤूՄೳ ɾमਖ਼݁ՌϦΞϧλΠϜʹө
None
࠷ॳͷΠϝʔδ ϓϩϑΟʔϧΛฤू Ͱ͖Δը໘ ૢ࡞ ߋ৽ ϓϩϑΟʔϧҰཡ ϓϩϑΟʔϧϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML
ੜ ΞϓϦέʔγϣϯαʔόʔ
ͪΐͬͱͬͯʂʂ
ϓϩϑΟʔϧϖʔδΛϖʔδ ࡞Δ͚ͩͩΑͶʁ
࠷ॳͷΠϝʔδ ϓϩϑΟʔϧΛฤू Ͱ͖Δը໘ ૢ࡞ ߋ৽ ϓϩϑΟʔϧҰཡ ϝϯόʔհϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML
ੜ ΞϓϦέʔγϣϯαʔόʔ
࠷ॳͷΠϝʔδ ϓϩϑΟʔϧΛฤू Ͱ͖Δը໘ ૢ࡞ ߋ৽ ϓϩϑΟʔϧҰཡ ϝϯόʔհϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML
ੜ ΞϓϦέʔγϣϯαʔόʔ ͗͢ͳ͍ʁʁ
ແବʹ͔͔࣌ؒΓͦ͏ %#ͱ͔αʔόʔͷཧΓͨ͘ͳ͍
ಇ͖ͨ͘ͳ͍ʂʂ
GASΛͬͯ ؆୯ʹղܾͰ͖ΔΜ͡Όͳ͍ʁ
GASͱʁ ɾGoogle͕։ൃͨ͠εΫϦϓτϓϥοτϑΥʔϜ ɾεϓϨουγʔτͳͲͷυΩϡϝϯτͱ࿈ܞ͕Մೳ ɾdoPost, doGet ؔͰPOSTɺGETϦΫΤετ ɹΛॲཧͰ͖Δ ɾHTMLService Λར༻ͯ͠ɺHTMLฦ͢͜ͱ͕Ͱ͖Δ
=> ؆қతͳWebαʔόʔɺAPIαʔόʔͱͯ͑͠Δ
ϓϩϑΟʔϧΛฤू Ͱ͖Δը໘ ૢ࡞ ߋ৽ ϓϩϑΟʔϧҰཡ ϓϩϑΟʔϧϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML ΞϓϦέʔγϣϯαʔόʔ
ฤूը໘ΛͲ͏ʹ͔͢Δ
ૢ࡞ ߋ৽ ϓϩϑΟʔϧҰཡ ϓϩϑΟʔϧϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML ΞϓϦέʔγϣϯαʔόʔ Google Sheets
Λར༻
ૢ࡞ ߋ৽ ϓϩϑΟʔϧҰཡ ϓϩϑΟʔϧϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML ΞϓϦέʔγϣϯαʔόʔ DBΛͲ͏ʹ͔͢Δ
ૢ࡞ ϓϩϑΟʔϧϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML ΞϓϦέʔγϣϯαʔόʔ ɾDBͱͯ͠ར༻ ɾdoPost ؔͰAPIαʔόʔͱͯ͠ಈ࡞ APIαʔόʔ
ૢ࡞ ϓϩϑΟʔϧϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML ΞϓϦέʔγϣϯαʔόʔ ϓϩϑΟʔϧҰཡ ΞϓϦέʔγϣϯαʔόʔ ΛͲ͏ʹ͔͢Δ
ૢ࡞ ϓϩϑΟʔϧϖʔδ Ӿཡ ϓϩϑΟʔϧ HTML Webαʔόʔ ϓϩϑΟʔϧҰཡ ɾdoGetؔ + HTMLService
ɹͰHTMLΛฦ͢ ɾಈతͳHTMLͷੜ͕͍͠ ɾը໘ߏஙΛͲ͏͢Δ͔ʁ
ૢ࡞ ϓϩϑΟʔϧϖʔδ ʢSPAʣ Ӿཡ ੩తHTML Webαʔόʔ APIαʔόʔ ϓϩϑΟʔϧ ʢfetchͰऔಘʣ SPAʢγϯάϧϖʔδΞϓϦέʔγϣϯʣͰ࣮ͯ͠ϑϩϯτͰը໘Λߏங
SPAͰ࣮͢ΔͳΒ React ͍͍ͨ
ਓͱͯ͠ͷ͕͞ʢஊͰ͢ʣ
ૢ࡞ ϓϩϑΟʔϧϖʔδ ʢSPAʣ Ӿཡ ੩తHTML Webαʔόʔ APIαʔόʔ ϓϩϑΟʔϧ ʢajaxͰऔಘʣ ɹ੩తͳHTML͔͠ฦͤͳ͍
React Ͳ͏Έ͜͏ʁ SPAʢγϯάϧϖʔδΞϓϦέʔγϣϯʣͰ࣮ͯ͠ϑϩϯτͰը໘Λߏங
ϏϧυࡁΈ js, css શ෦ೖΓͷ ੩తHTML Λੜ 1. js, css ΛϏϧυɺόϯυϧ
ͯ͠ bunlde.js Λੜ 2. bundle.js Λ jantimon/html-webpack-pluginΛͬͯ HTMLʹΠϯϥΠϯల։ ΠϯϥΠϯల։ Ϗϧυ Ϗϧυ bundle.js
webpack.common.js
ΠϯϥΠϯʹల։
GASͷσϓϩΠ google/clasp Ͱ GAS ʹ ੩తHTML ΛσϓϩΠ What is clasp?
Google͕ެࣜͰఏڙ͍ͯ͠ΔCLIͰGASϓϩδΣΫτΛཧͰ͖Δπʔϧ GASͷө͜Ε͚ͩͰྃ
ૢ࡞ ϓϩϑΟʔϧϖʔδ ʢSPAʣ Ӿཡ ϓϩϑΟʔϧ ʢajaxͰऔಘʣ ੩తHTML Webαʔόʔ ϓϩϑΟʔϧҰཡ ࠷ऴߏ
ϩʔΧϧϏϧυ HTMLΛσϓϩΠ/clasp ͬͨͶʂ ʌ(ˏʈ˜ʈˏ)ů
·ͱΊ ɾGAS + SPA + Clasp ɹͰ͓खܰʹαʔόʔϨεͳ։ൃΛ࣮ݱͰ͖Δ ɾ؆୯ͳ͚ࣾͷΞϓϦέʔγϣϯͳΒίϨͰे ʢͨͩ૾Ҏ্ʹ͍ =>
ରࡦ͢Εૣ͘ͳΔ͔ʣ
͓ΘΓ