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.7k
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
勉強会から始まった僕のDevRel~新卒エンジニアがつないだ2年間の軌跡~
ohmori_yusuke
1
230
WebエンジニアがSwiftをブラウザで動かすプレイグラウンドを作ってみた
ohmori_yusuke
0
170
アニメがエンジニアをつなぐ!「エンジニアニメ」勉強会が巻き起こすCo-Creationの波
ohmori_yusuke
0
140
組織が大きく変わろうとするとき、自分はどうありたいかを考えている
ohmori_yusuke
19
6.5k
技術以外をきっかけに交流するエンジニア向け勉強会
ohmori_yusuke
0
56
デザインって“感覚”だけじゃないVibe Codingからの気づき
ohmori_yusuke
3
88
MDN Web Docs に日本語翻訳でコントリビュートしたくなる
ohmori_yusuke
1
150
PHPで始める振る舞い駆動開発(Behaviour-Driven Development)
ohmori_yusuke
1
570
市町村のオープンデータを使って「公園・トイレの口コミマップ」を作ってみた
ohmori_yusuke
0
370
Other Decks in Technology
See All in Technology
from Sakichi Toyoda to Agile
kawaguti
PRO
1
120
LLM時代にデータエンジニアの役割はどう変わるか?
ikkimiyazaki
6
1.3k
能登半島地震で見えた災害対応の課題と組織変革の重要性
ditccsugii
0
660
AWS IoT 超入門 2025
hattori
0
330
M5製品で作るポン置きセルラー対応カメラ
sayacom
0
180
速習AGENTS.md:5分で精度を上げる "3ブロック" テンプレ
ismk
6
1.1k
Escaping_the_Kraken_-_October_2025.pdf
mdalmijn
0
170
Performance Insights 廃止から Database Insights 利用へ/transition-from-performance-insights-to-database-insights
emiki
0
240
成長自己責任時代のあるきかた/How to navigate the era of personal responsibility for growth
kwappa
4
320
サイバーエージェント流クラウドコスト削減施策「みんなで金塊堀太郎」
kurochan
0
270
Geospatialの世界最前線を探る [2025年版]
dayjournal
1
220
いまからでも遅くない!SSL/TLS証明書超入門(It's not too late to start! SSL/TLS Certificates: The Absolute Beginner's Guide)
norimuraz
0
200
Featured
See All Featured
Scaling GitHub
holman
463
140k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
189
55k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
31
2.7k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
How to Think Like a Performance Engineer
csswizardry
27
2k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Embracing the Ebb and Flow
colly
88
4.8k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
Optimizing for Happiness
mojombo
379
70k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
Faster Mobile Websites
deanohume
310
31k
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トップ
ご清聴ありがとう ございました!!