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
声がかかったので即興LINEbotハンズオンやってみた
Search
ようかん(YosukeInoue
July 24, 2020
Technology
0
63
声がかかったので即興LINEbotハンズオンやってみた
非エンジニア高校生にオフラインでLINEBotを作れるようになるハンズオンを行ってきました
ようかん(YosukeInoue
July 24, 2020
Tweet
Share
More Decks by ようかん(YosukeInoue
See All by ようかん(YosukeInoue
今から始めるLINEBot入門
inoue2002
0
120
未来の投げ銭箱
inoue2002
2
87
LINEでAI占い師に相談できる “AI占いくん”の開発/改善の過程
inoue2002
0
330
LINEトークルーム広告v1
inoue2002
0
68
レシピ保存くん
inoue2002
0
500
初めてのServiceMessage
inoue2002
0
120
トーク履歴を分析してみる
inoue2002
0
21k
LINEで使えるAIチャットBot “AIチャットくん”とLINEAPI
inoue2002
0
97
謎コイン
inoue2002
0
87
Other Decks in Technology
See All in Technology
AWSアカウントのセキュリティ自動化、どこまで進める? 最適な設計と実践ポイント
yuobayashi
7
640
What's new in Go 1.24?
ciarana
1
110
いまからでも遅くない!コンテナでWebアプリを動かしてみよう!コンテナハンズオン編
nomu
0
160
偏光画像処理ライブラリを作った話
elerac
1
170
分解して理解する Aspire
nenonaninu
2
1.1k
Share my, our lessons from the road to re:Invent
naospon
0
150
ディスプレイ広告(Yahoo!広告・LINE広告)におけるバックエンド開発
lycorptech_jp
PRO
0
390
Cracking the Coding Interview 6th Edition
gdplabs
14
28k
クラウド食堂とは?
hiyanger
0
120
自分だけの仮想クラスタを高速かつ効率的に作る kubefork
donkomura
0
100
依存パッケージの更新はコツコツが勝つコツ! / phpcon_nagoya2025
blue_goheimochi
3
220
Perlの生きのこり - エンジニアがこの先生きのこるためのカンファレンス2025
kfly8
2
270
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.6k
Optimising Largest Contentful Paint
csswizardry
34
3.1k
GraphQLの誤解/rethinking-graphql
sonatard
68
10k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
7.1k
It's Worth the Effort
3n
184
28k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k
Visualization
eitanlees
146
15k
Mobile First: as difficult as doing things right
swwweet
223
9.4k
RailsConf 2023
tenderlove
29
1k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Transcript
-*/&#PUϋϯζΦϯͬͯΈͨ 即興 2020/7/24 ようかん(@inoue2002)
@inoue2002
ようかん(井上陽介) ・滋賀の普通科⾼校3年⽣(現在進⾏形) ・元陸上競技部キャプテン ・LDGKオンラインハッカソン LINE賞受賞 ・レッドハッカソン2020 奨励賞受賞 ・「⾼校⽣主催のIT勉強会」を主催(#⾼校⽣ミーティング) ⾃⼰紹介 ・Twitter(@inoue2002
) → ・11LINEBot作った ・ポートフォリオ作った!!( youkan.me ) Q . コロナ休校期間何してた?? Q .最近してることは?? ・ LINEBot布教
みんなでLINEbot知りましょう! みんなでLINEbotを作っていきましょう! :今⽇の⽬標
:教材 https://qiita.com/inoue2002/items/a87df2b520f8b6e37f42
以後補⾜資料!
2019/2にコミュニティに出会う ↓ コミュニティにϋϚΔ ↓ 2020/7時点で80近くのイベントに参加 ↓ 最近は登壇にハマって好き勝⼿喋ってる ようかんは⼀体何者??←よく⾔われる しかし残念ながら、割とその辺にいる⾼校⽣です。
得意なことはNode.jsとLINEAPIとAWS
なんでそんなLINEBot 作ってるん?? LINEが好きだから
LINEBot作ったことありますか?? まだ触った事ない⼈に朗報!いまLINEBot⼊⾨する • 無料で開発できる! • バックエンドやフロントエンドなどの触った事ないところを触れるきっかけになれる! • いろんな課題解決をできるのでみんなに褒められる! • 「LINEミニアプリ」の話題の波に乗れる!
• ようかんの記事を読めば楽チンに始められる! このLTを聞いて皆さんにLINEBot開発をしたくなっていただきます!!
過去に作ったLINEBot 並べるだけ
ようかんbot(開発期間2週間) ・これのおかげでプログラミングを始めた ・沢⼭登壇しているので詳細は去年版の登壇動画へ↓ 課題 ・⾼校⽣活の中、時間割とかをいつでも確認したい ・プリントが多すぎて管理が⼤変 特徴 ・リリース初⽇でユーザー200⼈越えの⼈気 ・先⽣から⼀⻫送信頼まれることもある 備考
料理当番Bot(開発期間1⽇) ・詳細はnoteにまとめてあります→ 課題 ・みんな家にいるようになって⺟のストレス↑ ・料理作ったりやることが増えた 特徴 ・家族グループに「当番発表」と送るだけ ・異なる家族構成版の作成依頼を受けた 備考
部活動紹介Bot(開発期間1⽇) ・過去の登壇動画(youtube)→ 課題 ・休校再開で部活オリエンテーションが中⽌ ・新⼊⽣と部員とのコミュニケーションが取れない 特徴 ・企画/構成/開発/リリースまで1⽇ ・オープンチャットを活かした匿名利⽤と荒らしに強い 備考
studyTimer(開発期間5時間) 勉強グループでのこのメッセージが由来 ・リリースツイート→ 課題 ・家で勉強するも、モチベが続きにくい ・友達の勉強時間を気軽に視覚化できたらモチベになる 特徴 ・DBやキャッシュを利⽤せず、postbackで処理 ・勉強グループに招待して利⽤可能 備考
コロナ⾷ロスbot(開発期間1⽇) ・LDGKハッカソンLINE賞 ・詳細は感想を書いたnote→ 課題 ・コロナによる⾷ロスが多発 ・SNSに慣れておらず、商売しにくい会社がある 特徴 ・Share Target PickerやIcon/Nickname
Switch APIを実装 ・リアルサービスへ実装する話が出てきている 備考
画像アップローダー(開発期間1⽇) 課題 ・画像URLを⼀瞬で発⾏したい時がある ・画像をURLで共有したい 特徴 ・写真を投げるだけで⼀瞬でURLを発⾏してくれる ・⾃分のs3バケットを使っているので他⼈には共有できない ・aws-sdkの練習に作った 備考 ・詳細ツイート→
Twitter動画ダウンローダー(開発期間3時間) ・詳細ツイート→ 課題 ・ツイッターの動画をダウンロードしたい ・サイトを使うと広告とか出てうっとしい 特徴 ・LINEで勝⼿にやってくれるのでなかなか便利 ・たまにできない動画もある(プロモーションとか) 備考 ・友達登録→
カップ麺タイマー (開発期間3ヶ⽉) ・とりあえず試してみるべし→ 課題 ・何気ないカップ麺にお湯を⼊れたあとの待ち時間 ・普段出会わない記事に出会いたい 特徴 ・1~10分までのタイマーに対応 ・DBでユーザーのタイマーを管理 備考
sosmapjapan(開発期間1ヶ⽉) ・友達登録→ 課題 ・直感的にSOSに会える ・SNSに慣れておらず、商売しにくい会社がある 特徴 ・AWSで運⽤しており素早いレスポンス ・リアルサービスで運⽤中(sosmap.pw) 備考
トラべる!(開発期間1⽇) ・レッドハッカソン奨励賞 ・コンセプトを書いたQiita→ ・諸事情により運⽤停⽌中 課題 ・コロナによる⾷ロスが多発 ・SGG3⼈で参加 特徴 ・コロナが収まった後の観光業を⽀援する ・旅⾏の計画が⽴てられる
備考
事例はわかった。 LINEBot作ればいろんな課題を解決できるんだね。 でもどうやって作り始めたらいいのかわからないよ。。 「LINEBot」で検索してもいろんな⾔語の記事が転がってたり、記事が古かったりで何がいいのかわからん!! なんやかんや⼊⾨はきついねん! 安⼼してください。おすすめの構成とLINEBotが学べる記事をご紹介します!!
AWSCDKのやつ
僕がAWSCDKを知ったきっかけ CDKを布教しているLTを聞いた TypeScriptとかCloudFormation とか知らない⾔葉が多かったけ れど、快適になるなら!と思っ て勉強を始めた
勉強始めて数時間後・・ ①TypeScriptかけなくてもNode.jsで書いて も動くので余裕で⼊⾨できた ②備忘録に記事書いた 開発で使うようになり、どんどん好きになった
#PUͷΠϯϑϥߏங$%,Ͱૣ͘ͳΔͷ͔ 検証していきます
条件 ・⾃分が書いたQiitaを⾒ながらコードはコピペ ・CDKを使って⾊々できるスキルを持っている ・ディレクトリを作るタイミングでスタート ・BotがLambdaを通して応答したらストップ
まず普通にコンソール画⾯から作ってみた
結果は15分ほど。 コンソール画⾯を久しぶりにぽちぽちした
CDKを使って作ってみた
結果 ディレクトリを作ってBotが応答するまで9分を切った! (半分くらいがインストールやデプロイ時間) インフラ構築がちょー楽になってBot開発に専念できます!!
ディレクトリやファイルを作る ↓ Qiitaからテンプレートをコピペ ↓ 必要なモジュールをインストール ↓ いくつかのエラーが出るので修正する ↓ yarn build
↓ cdk deploy やったこと
作業⼯程を⽐較してみる
例)LambdaとAPIGatwayを設定する CDKだとこのほんの20⾏くらい書いてデプロイするだけ
めちゃめちゃ⼯数がおおい! 僕の経験上、設定ミスでなかなか上⼿くいかない コンソールで操作すると
実際に⾃分の⼿で確かめてみたい⽅は
↓CDKを使って作る.ver ↓AWSコンソールを使って作る.ver ※頻繁アップデートにより動かない場合があります
CDKにハマった他の理由
構築するアーキテクチャごとコードで管理できる! ←「⾚枠にxxと⼊⼒して次に進みます」 こういう説明をしなくても済むようになる LINEBotを頻繁に作る⼈は、毎回毎回コン ソールで同じ作業をやるのがめんどくさ い!勝⼿にやってほしい! →コードをコピペすればいい GitHubで管理できる!
いらなくなったら destroy !! ハンズオンの最後にもあったようにいらなくなったら 「destroy」コマンドを⼊⼒するだけで、関係するものを 全部消してくれます!
良い点/悪い点 毎週のようにアップデートが来る先週動いてたコードが動かなくなる←本当の話 開発の回数を重ねるほどありがたみがわかる アーキテクチャ丸々GitHubで管理できるのがものすごく気持ちいいい 構成が⼤きくなっていくと、デプロイに結構時間がかかる TypeScriptわからなくてもJSでなんとかなる CDKの公式workshopが割とわかりやすい
-今後に向けて- CDK×LINEBotの記事がまだまだ少ないのでTipsをどんどんアウトプットしていく S3などとも連携してCDKでできる開発を技術をあげる! 今話題のミニアプリの開発にも使えそう →みなさんでLINEBot × AWSCDKを盛り上げていきましょう!!
休校期間のやつ
昨⽇引退試合を無事終え、陸上としばらくお別れ! ⼈⽣の3分の1くらい全⼒になってたのでちょっと寂しい 1年⽣も沢⼭⼊ってくれて、安⼼して引退できた
⼀⾒普通に、いい話に思えますが
これまでいろんな問題がありました
これまでのあらすじ
休校延⻑が発表される
・休校が再開する→部活動の新⼊⽣勧誘などが禁⽌ ・⻑期休校で新⼊⽣の部活動意欲低下のおそれ ・部活動への関⼼を休校中も維持することが⼤切。
同級⽣(各部活の部員) え!学校休み??せっかく準備してたのに部活動紹介の時間無くなった。。 私たちいつの間にか引退になりそうやけど後輩⼊ってくるかな? 妹(新⾼校⼀年⽣) 仮⼊部楽しみにしてたのに。 実際に先輩と喋ってじっくり部活決めたい。。 お互いの課題解決できないかなぁ 課題:お互いがコミュニケーション取れる場所がないこと
じゃあ作ったらええやん。
・各部活のキャプテンに賛同を求め ・LINEBotのコードをカキカキ ・怪しまれそうだったので経緯を書いたホームページ作成 ・アイコンやメニュー画⾯のデザイン…
Ver.1
実際の利⽤イメージ
その後、学校再開が発表
折⾓ならまだ使ってない⼀年⽣に使ってほしい!!! → 学校公式にすれば全員に使ってもらえるのでは??
「⽣徒会の先⽣ー!僕、こんなサービス開発したんですけど、学校公式にしません?? 」 「そうだねぇ。素晴らしいんだけど、、、、、、 責任とかどうする? 職員会議で反対が出そう。。」 先⽣のおっしゃることは理解できるけど、もうちょっと前向きに検討して欲しかった。。 話にならん!!!
学校が協⼒してくれないなら、意地でも⾃分で成功させる!!
やった事① -デザインの改案-
やった事② -QRコードとサービスの宣伝- →
やった事③ -利⽤者アンケート-
⾃由回答に寄せられた意⾒ 「⾯と向かってはきけない各部活の細かいことまできけて本当に助かりました!」(新⼊⽣) 「質問をしたりトークを⾒たりして各部活の様⼦などよく分かって⼤変助かりました」(新⼊⽣) 「先輩の⽬を気にせず質問できたのでとても良かったです!作ってくれた⽅に感謝です!」(新⼊⽣) 「部活のことを詳しく部活の内容を教えて下さり助かりました!」 (新⼊⽣) 「匿名聞けるところとかとても聞きやすくて、先輩もわかりやすく答えてくれたので満⾜です!!」(新⼊⽣) 「こういう時期だからこそこのような形で1年⽣と話す機会を作ってもらえて嬉しかったです〜」(先輩) 「とても役に⽴って部活も無事きめられました。」(新⼊⽣) 「多くの新⼊部員に⼊っていただきました!相談サービスを作ってくださったおかげです。」(先輩)
やった事⑤ -⾃⼰振り返り、報告書作成-
1⼈でも「ありがとう!」と⾔ってくれる⼈がいてよかった 僕⼈⾝が部活動⼤好き⼈間だったので真剣に相談して部活を決め てくれる⼈がいてよかった これからも⼈の⼒になれるサービス開発をしていきます! まとめ ⚠荒らしがいろんなところで発⽣するので、戦うのが⼤変だった
お疲れ様です!