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
Princess APIのAPIクライアントをTypeScriptで作ってnpmで公開してみた
Search
uutan1108
June 03, 2023
Technology
1
1.3k
Princess APIのAPIクライアントをTypeScriptで作ってnpmで公開してみた
IM@S Engineer MeetUp REBURNでLTした時のスライドです。
https://imas.connpass.com/event/256931/
uutan1108
June 03, 2023
Tweet
Share
More Decks by uutan1108
See All by uutan1108
技書博に参加したら執筆できた
ohmori_yusuke
1
68
開発終了後こそ成長のチャンス!プロダクト運用を見送った先のアクションプラン
ohmori_yusuke
2
150
学生の時に開催したPerl入学式をきっかけにエンジニアが組織に馴染むために勉強会を主催や仲間と参加して職能間の境界を越えていく
ohmori_yusuke
2
470
やりっぱなしで終わらない勉強法
ohmori_yusuke
2
360
OpenAPIにも静的解析とフォーマッターを導入して快適にスキーマ定義する
ohmori_yusuke
2
260
スクラムフェスに参加した
ohmori_yusuke
1
390
新卒エンジニアが組織に馴染むために勉強会を主催してチームの壁を越える
ohmori_yusuke
1
420
CGIプログラムを書いてみた
ohmori_yusuke
1
170
”私だけ”の技術発信から”仲間と”技術発信に変化するために
ohmori_yusuke
4
360
Other Decks in Technology
See All in Technology
Platform Engineering ことはじめ
oracle4engineer
PRO
8
800
RustとWebAssemblyを使って高速な画像処理をWebアプリで実行しよう
rebonire626
0
100
10分でわかるfreeeのQA
freee
1
3.5k
20241108_CS_LLMMT
shigashiyama
0
250
신뢰할 수 있는 AI 검색 엔진을 만들기 위한 Liner의 여정
huffon
0
540
Engineering at LY Corporation
lycorp_recruit_jp
0
300
形式手法の 10 メートル手前 #kernelvm / Kernel VM Study Hokuriku Part 7
ytaka23
5
750
データの信頼性を支える仕組みと技術
chanyou0311
5
1.6k
Terraform Stacks入門 #HashiTalks
msato
0
200
スクラムチームを立ち上げる〜チーム開発で得られたもの・得られなかったもの〜
ohnoeight
1
290
Redmine 6.0 新機能評価ガイド
vividtone
0
260
Forget efficiency – Become more productive without the stress
ufried
0
240
Featured
See All Featured
Fantastic passwords and where to find them - at NoRuKo
philnash
50
2.9k
Optimising Largest Contentful Paint
csswizardry
33
2.9k
Why Our Code Smells
bkeepers
PRO
334
57k
Thoughts on Productivity
jonyablonski
67
4.3k
StorybookのUI Testing Handbookを読んだ
zakiyama
26
5.2k
BBQ
matthewcrist
85
9.3k
How To Stay Up To Date on Web Technology
chriscoyier
788
250k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
Into the Great Unknown - MozCon
thekraken
32
1.5k
Gamification - CAS2011
davidbonilla
80
5k
Designing for Performance
lara
604
68k
The Cost Of JavaScript in 2023
addyosmani
45
6.7k
Transcript
Princess APIのAPIクライアントを TypeScriptで作ってnpmで公開し てみた IM@S Engineer MeetUp REBURN うーたん
自己紹介
うーたんです • 名前 ◦ うーたん ◦ 大森裕介 • 副業は新卒サーバーサイドエンジニア •
矢吹 可奈を担当
SNS • Twitter ◦ @uutan1108 • GitHub ◦ OHMORIYUSUKE
参加したきかけ
今回、初参加です! 大学2年のころのイベントに参加したかったが参加でき なかった。今回は、3年前よりレベルアップしたのでオフ ラインで参加!!
作ったもの
TypeScriptでAPIクライアントを作っ た • Princess — Public REST APIの TypeScriptのAPIクライアント •
ひたすら型定義をしてテストをたく さん書いた • Princess — Public REST APIは アイドルの情報が取得できる WEB API https://github.com/OHMORIYUSUKE/princess-api -sdk/tree/main
Princess — Public REST API • アイドルの情報やゲームの イベント情報が取得できる • 20個以上のエンドポイント
モチベーション 1. イベントをconpassで発見する 2. 何か作って発表したい!! 3. 前に使ったことがあるアイマス関連のAPIクライアントを作ろ う! 4. どうせならnpmに公開したい(公開するのムズそう)
5. テストも書きたいし、ドキュメントも書きたい 6. そして、自分で作ったnpmパッケージを使って満足感を感じた い!
実装
これだけでnpmにリリースできた • semantic-release ◦ パッケージ公開 ◦ バージョン管理 ◦ リリースノートの作成を自動化
テストをChatGPTに教わりな がら書いた • GPTに構造体を教えて、テ ストを書いてと頼んだら書い てくれる。 • 勝手に謎のパッケージを定 義してくるので注意してあげ た
• JSONから構造体も作ってく れる
おしゃれなドキュメント(typedoc) • READMEをおしゃれに表示してくれる • コードに書き込んだ メソッドのコメントを ドキュメントに変換
感想
感想 • 意外と簡単にnpmに公開できた • ひたすら型を定義するのは辛い • エンドポイントが多くて実装が間に合わなかった • ChatGPTにJSONを教えて型を作ってもらうとサボれる •
TestもChatGPTに質問しながら書いた(Testを書いたの初めて かも)
package.jsonに名前が入るのがいい • Node.jsのパッケージ(ライブラリ)管理ファイルに自分のパッ ケージ名が書き込まれる嬉しさ • importするたびに感じる 「npmからインストール したパッケージだぁ」感
完成させられなかったけ ど、npmにも公開できた し、テストも書けた、ド キュメントも書けたし、よ し!
次にやりたいこと
色々なところに表示してるアイドルの誕生日を自分のパッケージに変更 する • 今回、公開したパッケージでアイドルの情報を取得して 各ページに誕生日を表示したい! ホームページ GitHubトップ
ご清聴ありがとう ございました!!