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
メンテされなくなったCLIをTypeScriptで開発しなおした話
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Hiroshi TANABE
April 21, 2025
Technology
0
15
メンテされなくなったCLIをTypeScriptで開発しなおした話
kansai.ts #10 でお話しさせていただいた際のスライドです。
-
https://kansaits.connpass.com/event/348764/
Hiroshi TANABE
April 21, 2025
Tweet
Share
More Decks by Hiroshi TANABE
See All by Hiroshi TANABE
Dataモードでのデザインパターン/Design Pattern for Data Router/Loader/Action
htnabe
0
66
2025年の振り返りと2026年の展望
htnabe
0
120
Lambda Web Adapter使ってNext.jsのアプリをホストしてみた! / Tried hosting Next.js app with Lambda Web Adapter
htnabe
0
97
Openapi-fetch とOpenapi-typescriptを使ってみた! I tried openapi-fetch and openapi-typescript!
htnabe
0
30
Other Decks in Technology
See All in Technology
Bref でサービスを運用している話
sgash708
0
210
15年メンテしてきたdotfilesから開発トレンドを振り返る 2011 - 2026
giginet
PRO
2
230
俺の/私の最強アーキテクチャ決定戦開催 ― チームで新しいアーキテクチャに適合していくために / 20260322 Naoki Takahashi
shift_evolve
PRO
1
480
Network Firewall Proxyで 自前プロキシを消し去ることができるのか
gusandayo
0
130
Microsoft Fabricで考える非構造データのAI活用
ryomaru0825
0
520
SaaSの操作主体は人間からAIへ - 経理AIエージェントが目指す深い自動化
nishihira
0
120
来期の評価で変えようと思っていること 〜AI時代に変わること・変わらないこと〜
estie
0
120
SSoT(Single Source of Truth)で「壊して再生」する設計
kawauso
2
400
OCI技術資料 : ロード・バランサ 概要 - FLB・NLB共通
ocise
4
27k
OCI技術資料 : 証明書サービス概要
ocise
1
7.1k
Why we keep our community?
kawaguti
PRO
0
350
ブラックボックス化したMLシステムのVertex AI移行 / mlops_community_62
visional_engineering_and_design
1
240
Featured
See All Featured
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.7k
Test your architecture with Archunit
thirion
1
2.2k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
1
170
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
10k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2k
The Spectacular Lies of Maps
axbom
PRO
1
660
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
140
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.2k
Six Lessons from altMBA
skipperchong
29
4.2k
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
310
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
140
BBQ
matthewcrist
89
10k
Transcript
メンテされなくなった CLIをTypeScript で開発しなおした話 © Nabe-cyan(t-pot.me)
• オフィシャル・プライベート共に、今まで基本的に1人での開発がメインだった ので、我流な部分が含まれていると思います • トーク中でも様々なアドバイス・質問はウェルカムです! はじめに
概要 • AlgoliaというWebサイト内検索のSaaSがある • Algolia上にデータをアップロードする際に atomic-algolia という、JSベースのCLIライ ブラリがあったのですが、メンテナンスされなくなっていた • 今回はTS
+ citty, unbuildでこのライブラリを作り直した ◦ algolia-uploader • 技術選定、困った話、今も困っている話 etc. を話したい
Algoliaとは…? • Algoliaについて知っている or 使ったことのある方 ✋ • SaaS型全文検索サービス • サーバーやインフラの構築・運用が不要で、クラウド上で提供されるため、導
入や運用が非常に簡単 • リアルタイム検索と高パフォーマンス • 例:私の個人ブログのサイト内検索機能
メンテされなくなった atomic-algolia • 私も過去使っていた ライブラリ • 必要最低限の機能に絞って 開発されており、非常に素晴 らしい •
5年前の更新を最後に残念な がらストップ (貶める意図は一切ないです)
atomic-algoliaのユースケース https://upload.wikimedia.org/wikipedia/commons/6/69/Algolia-logo.svg JSONファイルの例: { "objectID": "prod_001", "name": "Wireless Headphones", "brand":
"SoundMaster", "price": 129.99, "inStock": true, "rating": 4.5, "description": "Premium sound quality with noise cancellation.", "imageUrl": "https://example.com/images/headphones.jpg" }, • ローカルにあるJSONファイルを Algoliaに登録する • 登録・削除・更新処理は公式の search clientを利用 npm run atomic-algolia
技術選定 • まず新しめのCLI開発事例を探す ◦ これを読んでUnJSが熱いっぽいという事が分かった • フレームワークの学習にそんなに時間を掛けたくない ☞ドキュメントを読めば9割は作り方が分かるフレームワークにしたい ほな citty,
unbuild, jiti の組み合わせで作ってみるか!
詳細 • 言語: TypeScript • パッケージマネージャー: yarn v4 • CLI
Builder: citty • Bundler: unbuild • デバッグ支援(生のTSをそのまま実行できる): jiti • 環境変数の処理: dotenvx • テスト: vitest
困ったこと • `yarn v4`での`Zero-Installs`関連の設定に手間取った • `yarn v4`とVSCode, `devcontainer`の組み合わせで開発してみたところエ ディターごとに追加の設定が必要という落とし穴にはまった(この対応が必 須かどうかまだ微妙に分かっていない)
◦ 別のパッケージマネージャーを使った方が良かった気がしている • 最初に`lodash`を使っていたが、CommonJSでしか動かないことを知らな かった ◦ 結局は es-toolkit を使った
困っていること • 一人で開発しているので、実際にはまだ困っていない • 今のところデバッグする際に実際のAlgoliaのアカウントを使ってデ バッグ用のアプリケーションを用意する必要があり正直手間。。。(´; ω;`)
まとめ・蛇足 • ちょっと学習すれば直観的で楽しく開発できる(特に cittyが優秀) • yarn v4 をがっつり触ったけど、パッケージマネージャとして気軽にはおす すめできないかも ◦
有識者のアドバイス・コメント求む! • 自分でOSSライブラリを開発・保有していると将来的なキャリアでも良いこ とあるかもね! 知らんけど