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
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Hiroshi TANABE
April 21, 2025
Technology
32
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
メンテされなくなったCLIをTypeScriptで開発しなおした話
kansai.ts #10 でお話しさせていただいた際のスライドです。
-
https://kansaits.connpass.com/event/348764/
Hiroshi TANABE
April 21, 2025
More Decks by Hiroshi TANABE
See All by Hiroshi TANABE
Dataモードでのデザインパターン/Design Pattern for Data Router/Loader/Action
htnabe
0
91
2025年の振り返りと2026年の展望
htnabe
0
130
Lambda Web Adapter使ってNext.jsのアプリをホストしてみた! / Tried hosting Next.js app with Lambda Web Adapter
htnabe
0
120
Openapi-fetch とOpenapi-typescriptを使ってみた! I tried openapi-fetch and openapi-typescript!
htnabe
0
47
Other Decks in Technology
See All in Technology
新規事業を牽引する技術選定 〜フルスタックTypeScript開発の実践事例〜
nullnull
3
370
AI駆動開発が変える、大規模開発の前提 ーHuman in the Loop から Human on the Loop へ / AIE2026
visional_engineering_and_design
29
21k
AWSシリコン最前線 〜AI時代のチップ選択を読み解く〜
htokoyo
1
240
ITエンジニアを取り巻く環境とキャリアパス / A career path for Japanese IT engineers
takatama
4
1.8k
Snowflakeと仲良くなる第一歩
coco_se
2
210
AI Engineering Summit Tokyo 2026 AIの前に、やることがある 〜医療データ企業の4フェーズ〜
dtaniwaki
0
2.2k
protovalidate-es を導入してみた
bengo4com
0
160
価格.comをAI駆動で全面刷新する ー 30年分の技術的負債を返し、次の30年の土台をつくる ー / AI Engineering Summit Tokyo 2026
tkyowa
50
57k
「コーディング」しない人のための Claude Code 入門 ChatGPT の次の一歩 — 業務に組み込む 育成・共有・自動化
rfdnxbro
2
1.2k
AIプラットフォームを運用し続けるための可観測性
tanimuyk
4
1.2k
Djangoユーザが知っ得なPostgreSQL機能 - 設計の選択肢を増やす / Djang-use-PostgreSQL
soudai
PRO
0
210
新アーキテクチャ「TiDB X」解説とDedicated比較 TiDB Cloud Premiumのゲーム運用活用を検証
staffrecruiter
0
120
Featured
See All Featured
Groundhog Day: Seeking Process in Gaming for Health
codingconduct
0
200
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
150
The Curious Case for Waylosing
cassininazir
1
380
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.3k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
1
250
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
450
The Pragmatic Product Professional
lauravandoore
37
7.3k
Google's AI Overviews - The New Search
badams
0
1k
Discover your Explorer Soul
emna__ayadi
2
1.1k
The AI Search Optimization Roadmap by Aleyda Solis
aleyda
1
5.9k
Optimizing for Happiness
mojombo
378
71k
[SF Ruby Conf 2025] Rails X
palkan
2
1.1k
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ライブラリを開発・保有していると将来的なキャリアでも良いこ とあるかもね! 知らんけど