TypeScriptのフルスタックWebアプリケーションのAdonisJSに入門してみました。 簡単なCRUD（TODOアプリ）を実装してみました。

この記事では、Next.jsのApp RouterでTanStack Queryを使用してデータを取得する方法について詳しく解説します。特に、Server ComponentでのデータプリフェッチとHydrationの仕組みを活用し、クライアントサイドで即座にデータを利用可能にする手法を紹介します。 また、OpenAPIスキーマからTanStack Queryコードを自動生成するOpenAPI React Query Codegenツールの使用方法についても取り上げ、手動でのコード記述を省くことで実装の効率化と一貫性を保つ方法を具体的な例を交えて説明します。

ContentfulなどヘッドレスCMSを利用してMarkdownで記事本文を管理してる場合のMarkedとShikiを使ったコードハイライティングの方法を紹介します。

OpenAPIスキーマの変更を検知してTypeScriptクライアントコードを自動生成してくれるViteプラグイン(vite-plugin-openapi-typescript-codegen)を作ってみたので、導入方法を紹介します。 このプラグインを使うことにより、スキーマファイル変更によるTSコードを最新化するための生成コマンドを毎回叩かなくてもよくなります。 Viteの開発サーバーを起動しているだけで常にスキーマファイルと同期したTSクライアントを得ることができます。