こんにちは、マイクです！今日は2025年10月24日、木曜日ですね。さて、今日も元気に「zenncast」をお届けしますよ！今日はZennでトレンドの記事をいくつか紹介しちゃいます。
それでは、早速今日の内容に入っていきましょう！
まずは、今日の最初の記事です。タイトルは「Hono CLI 爆誕」です。Hono CLIは新しいコンセプトのコマンドラインインターフェースで、人間とAIの両方をターゲットにした設計が特徴です。Hono CLIには5つのサブコマンドがあり、それぞれ異なる機能を提供しています。
その中でも注目なのは、**hono docs**です。このコマンドを使うと、指定したHonoのWebサイトからドキュメントを取得し、Markdown形式で表示できます。これにより、AIがドキュメントを直接読み取れるようになるんですよ。
次に、**hono search**では、特定のクエリに関連するドキュメントのURLやパスをJSON形式で出力します。このコマンドと`hono docs`を組み合わせれば、AIが必要な情報を自動で検索、取得できちゃいます。
そして、**hono request**は、Honoアプリにリクエストを送り、レスポンスを取得することが可能です。サーバーを立ち上げずにアプリをテストできるので、開発がとても効率的になりますね。
さらに、**hono serve**では、指定したHonoアプリをローカルでサーブできます。`--use`オプションを使うことで、アプリのコードを変更せずにミドルウェアを適用できるのも嬉しいポイントです。
最後の**hono optimize**では、Honoアプリを最適化し、特定のルーターを使用することでパフォーマンスを向上させます。これにより、アプリのファイルサイズが小さくなり、初期化も速くなるんです。
Hono CLIはエンジニアにとってとても便利なツールとなり、開発プロセスを効率化してくれます。npmを通じてインストール可能なので、ぜひ試してみてくださいね。
。...。...。...。
続いて、2つ目の記事です。「[Next.js] URL末尾に .md つけたらMarkdownをそのまま返す！」というタイトルです。Next.jsでは、URLの末尾に`.md`を付けることで、指定したページの内容を生のMarkdown形式で取得できる機能が登場しました。これにより、AIエージェントへの情報提供や他のクライアントとのデータ連携が非常に楽になります。
具体的には、Next.jsのバージョン16.0.0（App Router）とReact 19.2.0を使用して、Markdownでコンテンツを管理します。例えば、`/post/hello-world`にアクセスすると通常のHTMLが表示され、`/post/hello-world.md`ではMarkdownがそのままレスポンスされます。
シンプルな個人ブログを想定して、`content/`ディレクトリにMarkdownファイルを追加することで、HTMLページがMarkdownファイルをインポートしてレンダリングできます。この仕組みにより、エンドユーザーには理解しやすい形式で、AIエージェントには使いやすい形式で情報を提供することができるんです。
この二刀流配信は、今後の情報発信において重要な役割を果たすでしょう。ぜひ、あなたもこの機能を活用してみてくださいね。
。...。...。...。
次は、3つ目の記事です。「複数の並行開発におけるDocker Composeのポート競合を何とかする（Mac）」です。複数の開発を同時に行う際、Docker Composeのポート競合がしばしば問題になります。特に3000番や8000番ポートはWeb開発で一般的に使用されていて、頻繁に競合が起こります。
手動で`compose.yaml`のポートを変更する方法もありますが、誤ってコミットするリスクがあるため、避けたいところです。そこで、Macにおいてループバックアドレスを追加することでこの問題を解決しましょう。
ループバックアドレスとは、127.0.0.1から始まる特殊なIPアドレスで、これを利用することで同じポートを複数のプロジェクトで同時に使用できます。具体的には、`sudo ifconfig lo0 alias 127.0.0.x up`コマンドで新しいループバックアドレスを追加し、255個まで設定することが可能です。
設定後、各プロジェクトの`compose.yaml`には新しいループバックアドレスを指定しますが、誤ってコミットを防ぐために`compose.override.yaml`を利用します。このファイルは自動で読み込まれるため、ループバックアドレスに関連する設定をここに記載し、gitで無視することができます。
これにより、ブラウザや他のクライアントからは`project1:3000`のようにアクセスできるようになり、開発環境をスムーズに運用できるんです。ループバックアドレスを活用することで、並行開発でのポート競合の問題を効果的に解決できますよ。
。...。...。...。
続いて、4つ目の記事です。「増えすぎた GitHub Actions を「3 層アーキテクチャ」で整理した話」です。GitHub Actionsは便利ですが、ワークフローが増えると管理が難しくなりますよね。この記事では、3層アーキテクチャを導入してGHAのリファクタリングを行い、効率的な管理方法を提案しています。
環境ごとに似たようなワークフローが乱立し、重複コードや保守コストの増加、ロジックの不統一が課題として挙げられます。これにより、変更時に複数ファイルを修正する必要があり、作業効率が低下するという問題が発生します。
解決策として、3層アーキテクチャを導入しました。まずは、**Trigger層**です。こちらはGitHubのイベントを受け取り、環境固有のパラメータを設定します。この層はデプロイロジックを含まず、各環境のトリガーを統一して一貫性を持たせます。
次に、**Reusable Workflow層**ではビジネスロジックを実装し、差分チェックやデプロイのオーケストレーションを行います。複数の環境から共通して利用できる汎用的な実装が求められます。
最後に、**Composite Action層**では、基本的な操作を組み合わせた再利用可能なアクションを提供します。これにより、責務の明確な分離や再利用性の向上、保守性の向上、拡張性が期待されます。
この3層アーキテクチャの導入によって、GHAの管理が容易になることを目指しています。ぜひ、あなたもこの方法を試してみてくださいね。
。...。...。...。
最後に、5つ目の記事です。「Claude Code Web版 - スマホで指示、帰宅後に完成する開発の未来」です。2025年10月20日、Anthropicが「Claude Code Web版」をリリースしました。これにより、従来ターミナルでのみ利用可能だったClaude Codeが、ブラウザからもアクセス可能になりました。
このWeb版はProおよびMaxプランのユーザー向けに提供され、複数のタスクを同時に実行できるのが大きな特徴です。実際に、筆者は迷路を解く強化学習エージェントをStreamlitを用いて実装しました。Claude Code Web版に指示を出すと、自動的に環境構築や実装を進めてくれます。
ただし、CLI版と比較すると、Web版ではローカル環境での最大限のカスタマイズや複雑なデバッグが難しいというデメリットもあります。MCP設定など細かい調整が必要な場合はCLI版を使うのが望ましいとされています。
セキュリティのため、Web版は隔離されたサンドボックス環境で動作し、ネットワークやファイルシステムへのアクセスが制限されています。それでも、Claude Code Web版はスマホで指示を出し、帰宅後に開発が完了するという新しい開発スタイルを可能にする可能性を秘めています。今後も、便利な開発環境が整うことが期待されますね。
さて、今日もたくさんの記事を紹介しました。Hono CLIの便利さや、Next.jsの新機能、Docker Composeのポート競合解決法、GitHub Actionsの整理方法、そしてClaude Code Web版の未来についてお話ししました。
次回もまたお会いできるのを楽しみにしています！詳しい内容はショーノートに書いてあるので、ぜひチェックしてください。そして、番組の感想もお待ちしていますよ！それでは、またね！