Fukuoka.ts #3 Online での登壇資料です. https://fukuokats.connpass.com/event/218556/ 発表中にデモをした GitHub App の ソースコードはこちら(label-police/src/index.ts) https://github.com/bake0937/label-police
Probot で学ぶ TypeScript okabeeeat 2021.8.23 / Fukuoka.ts #3 Online
View Slide
生活協同組合コープさっぽろ デジタル推進本部 システム部 AWS・エンジニアリングチーム エンジニア 岡部恭平 @okabeeeat Webアプリケーションエンジニア
さっぽろ?
4年前に福岡に住んでいました
現在
目次 ● 私の TypeScript の勉強歴(2018〜2020) ● なぜ挫折するのか? ● 作ったもの ● まとめ
TypeScript 流行ってますよね(肌感) 確かに便利そう
よし!勉強だ!
私の TypeScript の勉強歴(2018〜2020)① ● 一人で React.js + TypeScript でなんかWebアプリ作ろう ○ 仕様どうしよ...そもそも React.js がわからない... 挫折 orz ● 何人か集めて React.js + TypeScript でなんかWebアプリ作ろう ○ みんなの時間が取れない... 挫折 orz ● 一人で Vue.js + TypeScript でなんかWebアプリ作ろう ○ 仕様どうしよ...そもそも Vue.js がわからない... 挫折 orz
私の TypeScript の勉強歴(2018〜2020)② ● 何人か集めて React.js + TypeScript でなんかWebアプリ作ろう ○ みんなの時間が取れない... 挫折 orz ● 一人で TypeScript でなんかWebアプリ作ろう ○ あともうちょっとだった... 挫折 orz ● とりあえず、TypeScript の本を一冊終わらせよう ○ 最後に読んだページどこだっけ?... 挫折 orz
そんな時...
業務で TypeScript を使う機会に巡り合った Saasサービス ・・・①WebHookを飛ばす 超ざっくり図 ②CSV 出力実行 社内システム ③CSV アップロード
約3ヶ月 TypeScript に触れてみて ● 序盤はとにかくチームメンバーのコードを読んだ ● 型のチェックが想像以上に便利!!! ○ 特にお世話になったエラー ● プログラミング言語に型が欲しいと段々と思うようになった
やっぱり業務で経験する のが一番!
終わり
にはならない... ● これからも業務で TypeScript を使う ● TypeScript の力をまだ全然引き出せていない ● 今後も継続的に勉強が必要
よし!勉強だ!(n回目)
なぜ挫折するのか?🤔 ● TypeScript 以外の技術が沢山あり、勉強するものが多い ○ Vue.js, React.js など ● 自分のペースで勉強できなかった ● 壮大な仕様やデザインを考えてしまい、本末転倒気味だった ○ 途中から何の勉強をしているのか忘れる ● 本当に作りたいアプリがわからず、モチベーションが低下した
つまり... ● 使用技術はなるべく広げすぎない ○ 可能であれば Node.js + TypeScript ぐらい ● 自分のペースで勉強する ● 仕様やデザインはシンプルにする ● 普段の業務が便利になるものが作れたらモチベーションが上がる!!!
という条件で考えた結果
以下に絞られた + or or Google App Script + clasp Probot Slack bolt
色々考えた結果こうなった + or or Google App Script + clasp Probot Slack bolt
Probot とは? ● GitHub App を作るためのフレームワーク(Node.js製) ○ https://probot.github.io/ ● GitHub から WebHook を受け取り、Probot が GitHub API を実行する ○ Octokit が内包されている ● JavaScript または TypeScript で開発できる ● コマンド一発で環境構築がほぼできる ○ 要: yarn or npm
選定理由 ● 実装がシンプル ○ 例: issue を open にしたら ◯◯ する ● 元々 GitHub API を使うのが好きだった ● 環境構築が楽 ● 前々から業務で便利にしたいことがあった
業務で便利にしたいこと Label 貼り!!
こんな経験は無いだろうか... そういえば、 プルリクエストはちゃんと Label を貼ってね は、はい!すいません
こんな経験は無いだろうか... だ、大丈夫かな...うるさく思われていないかな... あぁ...いつも 忘れるんだよなぁ...
作ったもの https://github.com/bake0937/label-police label-police
できること 人間に変わってLabelを貼ってくれる
どんなコード?
デモ(時間があれば)
作ってみた結果 ● とにかく楽しい!! ○ 面倒だったことが便利になっていく感覚を得られる ● 業務で普通に使えそう ● 便利にするために TypeScript の文法を覚えたいモチベーションが生まれた ○ コードを書く ⇔ 本を読む のサイクルがやっと動き出した ● 処理がシンプル過ぎる
まとめ ● 去年まで何度か TypeScript の勉強に挑戦したが挫折していた ● やっぱり業務で経験するのが一番ではある ● 使用技術は少なく,仕様やデザインがシンプルで自分が作りたいものを作る ● 「label-police」という GitHub App を作ってみた ○ TypeScript の力を引き出すのはこれからだ!!
ご清聴ありがとうございました