Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
JAWSDAYS2021_LINEDC
ようかん(YosukeInoue
March 20, 2021
Programming
1
620
JAWSDAYS2021_LINEDC
イベント情報→
https://jawsdays2021.jaws-ug.jp/timetable/track-c-1420/
ようかん(YosukeInoue
March 20, 2021
Tweet
Share
More Decks by ようかん(YosukeInoue
See All by ようかん(YosukeInoue
chrome-extension-scrapbox-twitter-user
inoue2002
0
17
動的リッチメニュー
inoue2002
0
130
身近なものから作り手に回る楽しさ
inoue2002
0
15
SGGとようかん
inoue2002
0
33
IntegromatとMakeを使ってLINEAPI
inoue2002
1
30
pushプレイリスト
inoue2002
0
25
AmazonDashButton✖️LINE
inoue2002
0
780
[事例]SORACOM✖️LINEで可視化&通知
inoue2002
0
1.2k
TrendOwl
inoue2002
0
5
Other Decks in Programming
See All in Programming
ゼロから作る Protocol Buffer のパーサーとレキサー / Writing Protocol Buffer Parser/Lexer in Go from scratch
yoheimuta
1
150
확장 가능한 테라폼 코드 관리 (Scalable Terraform Code Management)
posquit0
1
290
SRE NEXT 2022: Sensible Incident Management for Software Startups
takanabe
1
200
Android入門
hn410
0
300
機能横断型チームにおける技術改善
takeshiakutsu
3
380
Language Summit 2022: WebAssembly: Python in the browser and beyond
tiran
2
300
Monadic Java
mariofusco
4
250
近況PHP / PHP in now a days
uzulla
0
500
Git Rebase
bkuhlmann
7
1k
TDX22: User-Mode DB Ops
ca_peterson
3
1.1k
WindowsコンテナDojo:準備編
oniak3ibm
PRO
0
450
クリエイティブ系のウェブサイト制作で役立つCSS技法 / CSS for develop creative website
clockmaker
1
950
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
324
54k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
151
12k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
29
4.3k
Rebuilding a faster, lazier Slack
samanthasiow
62
7.2k
From Idea to $5000 a Month in 5 Months
shpigford
372
44k
Learning to Love Humans: Emotional Interface Design
aarron
261
37k
Design by the Numbers
sachag
271
17k
We Have a Design System, Now What?
morganepeng
35
2.9k
The Language of Interfaces
destraynor
148
20k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
236
1M
Six Lessons from altMBA
skipperchong
14
1.3k
VelocityConf: Rendering Performance Case Studies
addyosmani
316
22k
Transcript
AmplifyとLINEで作るJAWSDAYS投票システムの話 / ⾼校の卒業記念に8,700枚の写真でモザイクアートに挑戦した話 ようかん(@inoue2002) #jawsdays2021 アプリケーションサポーター
#jawsdays2021_C
⾃⼰紹介 ようかん(井上陽介) - ⾼校⽣エンジニア - 未踏ジュニア2020スーパークリエータ - LINE API Expert
Open Hack U Vol.4 Happy Hacking賞受賞 LINE APIを使った事例作り - 最近の活動 - 得意なこと ⻑距離を⾛ること(1.5km ‒ 10km) LINEAPIをいじること イベントを主催したり登壇したりすること 学校の同級⽣や後輩を巻き込んでいろいろやること @inoue2002
@inoue2002 [LINEAPI]どれぐらい開発しているかというと サービス/ツールetc.. 50+
@inoue2002 [LINEAPI]どれぐらい開発しているかというと サービス/ツールetc.. 50+
@inoue2002 ようかんはLINEDCで何をしている⼈なの? ① イベント参加/登壇/主催 ② LINE APIを使ったアウトプット ③ 最年少LAEとして、僕ならではのLINEAPI事例発掘&共有
@inoue2002 アイスブレイク ① Amplify、どこのセッションでも聞くワードですね!!! ② 話して欲しいことととかツイートしてもらえると嬉しいです! ③ 我々のシステム、しっかり動いている模様です!!
@inoue2002 このセッションでは何が聞けるの? ① LINE Developers Communityがどういったものか分かる ② AWSを⽤いて短期間で開発したシステムの裏話が聞ける ③ LINEとAWSを⽤いて実際に⾏ったプロジェクトを知れる
@inoue2002 本⽇のアジェンダ ② AmplifyとLINEで作るJAWSDAYS投票システムの話 - 何を作ったの? - 特徴や拘ったところは? - 技術構成
③ ⾼校の卒業記念に8,700枚の写真でモザイクアートに挑戦した話 - 何を作ったの? - どんな過程を経たの? - 技術構成 ① LINE Developers Communityとは - コミュニティ概要 - 普段の活動
@inoue2002 本⽇のアジェンダ ② AmplifyとLINEで作るJAWSDAYS投票システムの話 - 何を作ったの? - 特徴や拘ったところは? - 技術構成
③ ⾼校の卒業記念に8,700枚の写真でモザイクアートに挑戦した話 - 何を作ったの? - どんな過程を経たの? - 技術構成 ① LINE Developers Communityとは - コミュニティ概要 - 普段の活動
@inoue2002 LINE Developers Community(LINEDC)とは ・LINE Platformを使うエンジニア・クリエータによる有志のコミュニティ ・Connpass登録メンバー3000⼈超え ・さくっとLINEで何か試したい⼈からガチガチにシステムを作る⼈まで幅広い! ・毎週のようにイベントをやっている。ハンズオンやLTが多い ・#linedc
で検索するといろいろ出てくる
@inoue2002 LINE Developers Community(LINEDC)とは
@inoue2002 LINE Developers Community(LINEDC)とは
@inoue2002 LINE API Use Case
@inoue2002 本⽇のアジェンダ ② AmplifyとLINEで作るJAWSDAYS投票システムの話 - 何を作ったの? - 特徴や拘ったところは? - 技術構成
③ ⾼校の卒業記念に8,700枚の写真でモザイクアートに挑戦した話 - 何を作ったの? - どんな過程を経たの? - 技術構成 ① LINE Developers Communityとは - コミュニティ概要 - 普段の活動
@inoue2002
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・使⽤されたセッション - クラウドパワポカラオケ選⼿権 - ピタゴラスイッチ選⼿権 - チーム対抗提案コンペ〜仮想RFPに提案してみよう!〜 ・利⽤⽤途
- 各種対抗企画の参加者投票 xxx
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・独⾃投票UI DEMO - スライダーの場所に応じて表情が変わる! - 複数⼈への投票をカルーセルで簡単にに⾏える! ・集計結果はリアルタイムで表情を⾒て確認!
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・投票UIのヒント - 昨年未踏ジュニアにてリアクション回収ツール「critica」を開発していた - 半年間、意⾒やリアクションを集めることについて考え続けてた経験を⽣かした https://critica.uno
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・投票UIのヒント - 昨年未踏ジュニアにて開発を⾏ったリアクション回収ツール「critica」に実装されていた - プロジェクトの相⽅である伊藤祐聖が発案した https://critica.uno
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・開発メンバー - 3⼈で分担して開発を進めました リーダー/バックエンド もっちゃんさん 認証周り/バックエンド ささげさん フロントエンド
ようかん
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・ AWS Amplify - フロントからバックエンドまで開発をサポート - 爆速で開発できる -
簡単に開発を進められる - 強靭なアプリが完成!
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・システム構成
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・システム構成図 ・シーケンス図 ・UI設計図 ・DB設計
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・認証 - 認証はCognitoのCustom Auth機能とLINEのAccessToken認証を組み合わせて実現 1. 3. 2. 4.
5. 6. 7. 8. API Gateway Amazon Cognit Lambda Create Auth Challenge Lambda Verify Auth Challenge Lambda Voting 1.フロントから認証要求 2.LambdaがLINEのアクセストーク ンを答えることを求めるAuth Challengeを作成 3.フロントからLIFFで作成したアクセス トークンを答える 4.CognitoからLambdaにアクセス トークンを伝搬 5.LINEにアクセストークンを問い合わ せ、Cognitoの認証と連携 6.投票リクエスト 7.API GatewayがCognitoに認証ステー タスを問い合わせ 8. 認証ステータスが付与された状態で 投票functionが動作
@inoue2002
@inoue2002 AmplifyとLINEで作るJAWSDAYS投票システムの話 ・サーバーレスすごい 使った分だけの⽀払いで開発できるので、今⽇までの開発期間でも、かなりコストを抑えることができました! ・サーバーレスアーキテクチャ! リクエスト数、まらびに処理の実⾏時間に応じた課⾦となり、実際の処理量と⾦額が⽐例する。 事前の初期投資が不要なので、コストゼロからスタートが可能!!
@inoue2002 終了しました
@inoue2002 本⽇のアジェンダ ② AmplifyとLINEで作るJAWSDAYS投票システムの話 - 何を作ったの? - 特徴や拘ったところは? - 技術構成
③ ⾼校の卒業記念に8,700枚の写真でモザイクアートに挑戦した話 - 何を作ったの? - どんな過程を経たの? - 技術構成 ① LINE Developers Communityとは - コミュニティ概要 - 普段の活動
@inoue2002 ⾼校の卒業記念に8,700枚の写真でモザイクアートに挑戦した話
@inoue2002 きっかけは懇親会(11/14) ようかんくん、⼀緒になんかやりません? わーい!ぜひぜひ! FBグループ作りますね!
@inoue2002 LINEDC ✖VoiceAppLab ✖ ようかん企画誕⽣🎂 ⾳声ユーザーインタフェース(VUI)の可能性を研究するクリエイター集 団。たくさんのスキルやアプリを開発されています。また、最近ではLINE 上で動くゲームを開発されています。
@inoue2002 ⽣徒会の⼦にも協⼒してもらい モザイクアートに挑戦する
@inoue2002 学校にも協⼒してもらい 校⻑先⽣の許可をもらいにいく 情報科の先⽣を仲間にする 学年団の先⽣と職員会議 学校の公式企画として開始
@inoue2002 投票は「Bot追加して画像をとにかく投げるだけ」
@inoue2002 学校の公式⽂章配布とともに募集開始 4⽇で⽬標の倍の数集まった
@inoue2002 上映会
@inoue2002 上映会
@inoue2002 上映会
@inoue2002 上映会
@inoue2002 上映会
@inoue2002 上映会
@inoue2002 ポストカードも作ってみた
@inoue2002
@inoue2002 技術構成 学校管理のサーバー 実はコード⾃体は2⾏
@inoue2002 みんなからものすごく褒めてもらえた🎉
@inoue2002 学校のHPで紹介された🙌(してもらった?)
@inoue2002 コミュニティやAWSの⼒ですごく良い思い出を作れた ・LINEAPIを知っていて、少し技術をしっているだけで、いろんなことができる。 ・開発者コミュニティではこんないい話も⽣まれることがある ・プロジェクトが終わった時、18年間⽣きてて⼀番楽しい1⽇でした。 ・これからも技術とコミュニティを⼤切にして、⼤学⽣活を送っていきたいと思います! 開発者コミュニティで⽣まれる可能性は無限⼤!!!
@inoue2002 本⽇のアジェンダ ② AmplifyとLINEで作るJAWSDAYS投票システムの話 - 何を作ったの? - 特徴や拘ったところは? - 技術構成
③ ⾼校の卒業記念に8,700枚の写真でモザイクアートに挑戦した話 - 何を作ったの? - どんな過程を経たの? - 技術構成 ① LINE Developers Communityとは - コミュニティ概要 - 普段の活動
@inoue2002 1つだけ宣伝! 是⾮ご参加ください! LINE APIを使い倒す⾼校⽣4⼈のセッション⼤会を3/27 19:00-21:00に開催
@inoue2002 ご清聴ありがとうございました🙇 この後はoViceでお待ちしております!
AmplifyとLINEで作るJAWSDAYS投票システムの話 / ⾼校の卒業記念に8,700枚の写真でモザイクアートに挑戦した話 ようかん #jawsdays2021 アプリケーションサポーター