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
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
AI活用を推進するために ファインディが下した、一つの小さな決断
starfish719
0
270
サイバーセキュリティ概論 / Introduction to Cybersecurity
ks91
PRO
0
170
社内 AI エージェント Synapse と セマンティックレイヤーの育て方
hiroakis
0
460
EventBridge Connection
_kensh
5
660
データ基盤をDataformで整えた話 〜 開発環境を添えて 〜
takapy
0
130
Ruby::Boxでできること、Refinementsでできること
joker1007
3
400
関西に縁あるMicrosoft MVPsが語るCopilotの未来
kasada
0
1.2k
「嘘をつくテスト」の失敗例から学ぶ 良いテストコード #frontend_phpcon_do
asumikam
0
580
MCP Appsを作ってみよう
iwamot
PRO
4
170
Dynamic Workersについて
yusukebe
2
630
React、まだ楽しくて草
uhyo
7
4.2k
2026.06.13_AI時代に事業会社が「SIer出身エンジニア」を求める理由 / Why Businesses Seek Engineers with a System Integrator Background in the AI Era
jumtech
0
920
Featured
See All Featured
Prompt Engineering for Job Search
mfonobong
0
340
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
140
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
1
160
How GitHub (no longer) Works
holman
316
150k
Designing Experiences People Love
moore
143
24k
Building a Scalable Design System with Sketch
lauravandoore
463
34k
Six Lessons from altMBA
skipperchong
29
4.3k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.1k
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
1
220
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
davidcarrasco
3
150
A Soul's Torment
seathinner
6
2.9k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.3k
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ライブラリを開発・保有していると将来的なキャリアでも良いこ とあるかもね! 知らんけど