Hono × Inertia.js が作る新しい型貫通体験に触れてみた
// サーバー側（Hono） app.get('/posts/:id', (c) => { const post = findPost(c.req.param('id')) return c.render('Posts/Show', { post }) }) // クライアント側（React） export default function Show({ post }: PageProps<'Posts/Show'>) { return <h1>{post.title}</h1> } post の型は Post として完全に推論される。間に API 定義も DTO も tRPC もスキーマ生成もない。サーバーで c.render() の第2引数に渡したオブジェクトが、そのまま React の props として、しかも完全に型付きで届く。 「API なし SPA」を謳う Inertia.j
Honoマイベストプラクティス
はじめに この記事はHono Advent Calendar 2024の2日目の記事です。 自分のやっているプロジェクトではレストランの予約システムをHonoで構築しています。 アプリ、ウェブ、管理画面（ウェブ）があり、それらのAPIを一つのHonoサーバーで捌いています。 モノレポで構成されており、ウェブのフロントはNext.jsで作られています。 自分なりのHonoのベストプラクティスや設定を紹介いたしますので、よければ最後までお付き合いください！ (うちのインフラの話はあまり面白い部分がないので省きますが、逆に面白い話があれば記事にするかXなどで話しかけてください！) ディレクトリ構成 とりあえずこんな感じに落ち着いています。 src/ ├── domain/ │ └── reservation/ # 予約ドメイン ├── lib/ ├── routes/ │ ├── admin/
AIバグ発見システム「Sashiko」をJS/TS用にカスタマイズして使ってみる - プププなテクブ
ソフトウェア開発におけるコードレビューは品質保証の要です。しかし、レビューの質はレビュアーの専門知識と集中力に大きく依存し、人間のレビューでは見落としが避けられません。 この課題に対して、Linuxカーネル開発コミュニティから生まれたのがSashikoです。 sashiko.dev 本記事では、Sashikoの仕組みを詳しく解説し、それをJavaScript/TypeScriptライブラリのレビュー向けにカスタマイズしたSashiko JSについて紹介します。 Sashikoとは何か？ Sashiko（刺し子）は、Google社員のRoman Gushchin氏が開発したAIを用いたバグ発見システムです。特にLinuxカーネルのパッチをAIで自動レビューします。名前の由来は日本の伝統的な補修刺繍技法で、「布の弱い部分を補強する」という意味が、コードの脆弱な部分を見つけ出すという使命に重ねら
Announcing TypeScript 6.0 - TypeScript
Today we are excited to announce the availability of TypeScript 6.0! If you are not familiar with TypeScript, it’s a language that builds on JavaScript by adding syntax for types, which enables type-checking to catch errors, and provide rich editor tooling. You can learn more about TypeScript and how to get started on the TypeScript website. But if you’re already familiar with the language, you ca
JavaScriptとTypeScriptのpolyglot
Polyglot とは、複数のプログラミング言語 (あるいはより一般に、何らかのファイルフォーマット) で解釈できるプログラムのことで、多言語話者にちなんでこの名前がつけられています。Polyglotはしばしば、プログラミングに関する非実用的な探求として遊ばれます。 TypeScriptはJavaScriptのスーパーセットであるため、JavaScriptコードは自然にJavaScriptとTypeScriptコードのpolyglotとみなせます。しかしこれでは面白くないので、本稿では以下の条件を満たすpolyglotを提示します。 JavaScriptとして実行したときと、TypeScriptとして実行したときで、全く異なる処理が実行されること。 TypeScriptとして型エラーが生じないこと。 答え 本稿で提示する解答例は以下のコードです。 new (f())<0>/[/*]/ fu
TypeScript 7.0の現在地と備え方
2026-03-18 TypeScript 7.0を読み解く「uhyo さんに聞く、ネイティブ化の背景とこれから」
Announcing Vite+ Alpha
We’re excited to open-source Vite+ under the MIT license. Vite+ is a new unified toolchain and entry point to web application development that manages your runtime, package manager, and frontend toolchain. Give it a try today! What is Vite+? Vite+ combines Vite, Vitest, Oxlint, Oxfmt, Rolldown, and tsdown into a single, unified web development toolchain for developing, testing, linting, formatti
生成AIでJavaScript/TypeScriptを扱うときに設定しておきたい ESLintルール - プププなテクブ
このエントリはTSKaigi Mashup Kansai 生成AIでTSを扱うときに考えたい設計&ガードレールでの発表内容です。登壇資料をブログとして読めるように再構成して公開しています。 はじめに 去年あたりは「ジュニアエンジニアレベルと思ってね」と公式各所から言われていたコーディングエージェントも、もはやそのレベルを超えてきました。 今や副操縦席に座っているのは人間の側です。しかし、AIが機長だからといって自由に飛行機を操縦してよいかというとそうではありません。決められた航路や離着陸の手順を守る必要があり、そこを外れないガードレールが必要です。 またこれはAIに限った話でもありません。AIであれ人間であれ、「開発者」はもれなく全員が決められたルールに違反しないようコードを書くべきです。またレビュワーも完璧ではありません。問題に気づかないまま変更を承認してしまうこともあるでしょう。 なの
なぜTypeScriptは成功しているのか。作者ヘイルスバーグ氏が語る7つの教訓
TypeScriptの言語設計を行い、現在も開発をリードしているアンダース・ヘルスバーグ（Anders Hejlsberg）氏は、1983年に発売され大きな人気を得たプログラミング言語であるTurbo Pascalの作者であり、その後もDelphi、C＃などの優れたプログラミング言語の開発に携わってきたことで知られています。 そのヘイルスバーグ氏が1月27日付で公開されたGitHubのブログ記事「7 learnings from Anders Hejlsberg: The architect behind C# and TypeScript」で、同氏が長年の言語設計から得た7つの学びと、それが現在のTypeScriptにどう生かされているのかが紹介されています。 Why did TypeScript work when so many languages didn't? Anders He
Electrobun v1 - Blackboard Blog
Build ultra fast, tiny, and cross-platform desktop apps with TypeScript. Two years ago I paused co(lab) to build the desktop app framework I wished existed. Now that I've shipped a stable v1, this post is me reflecting on this two-year sidequest that had me learning Zig, C, C++, and Objective-C. Why I Built This My intro to programming was Visual Basic 6 in the early 2000s, building desktop apps.
AIエージェント × knipで無駄コードを簡単に掃除
こんにちは、よしこです。すっかりAIがコードを書く日々ですね。 最近、AIエージェントでのコーディングと相性のいいワークフローを手軽に導入したので紹介します。 knipとは？ knip は、JavaScript/TypeScriptプロジェクトの不要なコードを静的解析で検出してくれるツールです。 使われていないファイルやコードはもちろん、外部から参照されていないexportや、package.jsonに載っているけど利用されていないpackageまで見つけてくれます。無駄package気付きづらいのでありがたい… AIエージェントと組み合わせて使う エージェントにコーディングを任せていると、積み重ねで端々に不要なコードが残っていっちゃうんですよね。人間がレビューしても全部は拾いきれないし。 そこでknipを静的検査プロセスに組み込んでおくと、そういう不要なコードに対して静的解析でエラーを出
Announcing TypeScript 6.0 Beta - TypeScript
Today we are announcing the beta release of TypeScript 6.0! To get started using the beta, you can get it through npm with the following command: npm install -D typescript@beta TypeScript 6.0 is a unique release in that we intend for it to be the last release based on the current JavaScript codebase. As announced last year (with recent updates here), we are working on a new codebase for the TypeSc
軽量で型安全なAPIを実現する技術比較（tRPC / Hono / Elysia）
はじめまして、_minoです！ この記事では、Next.jsをベースにした軽量で型安全なAPIを実現するためのライブラリ・フレームワークの比較をまとめています。 直近のプロジェクトで比較検討した内容なので、参考になれば幸いです💪 🚀 対象フレームワーク・ライブラリ tRPC TypeScriptの型推論を活用し、サーバーとクライアント間で型を共有するライブラリ。APIをSDKのように型安全に呼び出すことができる。 採用事例 ・Netflix（動画配信 / 公式FAQで本番利用を明記） ・Cal.com（オープンソース/ スケジュール管理） Hono Web標準APIのみを使用した高速・軽量なWebフレームワーク。Cloudflare Workers、Deno、Bun、Node.jsなど複数ランタイムで同一コードが動作する。 採用事例 ・Cloudflare（D1・Workers Log
AIエージェントとDeno + ts-morphでTypeScriptコードを安全にリファクタリング
はじめに TypeScriptプロジェクトでライブラリの移行やコードベースの大規模な変更を行う際、手作業での修正はミスが発生しやすく、規模が大きくなるほどコストがかかります。また、AIエージェントによる変更は非決定的であるため、同じ指示でも毎回異なる結果になる可能性があります。 そこで私は、AIエージェントにAST（抽象構文木）を操作するスクリプトを作成させ、決定的なリファクタリングを実現する手法を活用しています。この記事では、Denoとts-morphを使った安全で再現性の高いリファクタリングの実践方法を紹介します。 なぜASTを操作するのか 正規表現による置換だけでは、特定の条件にマッチする場合のみ変換したいといった複雑なパターンに対応できません。また、正規表現が誤っていると構文エラーを引き起こす可能性があります。 一方、AIエージェントに直接コードを修正させる方法は柔軟性がありますが
TypeScriptはなぜランタイム構文を作り、なぜ今それを取り除きつつあるのか
はじめに 「enumはツリーシェイキングができないからas constを使え。」TypeScriptプロジェクトでよく聞くアドバイスだ。リントルールで強制するチームもあれば、コードレビューで指摘されることもある。 しかし実際のところ、enum数個がバンドルサイズに与える影響は微々たるものだ。パフォーマンスの話だけでは、なぜここまで推奨されているのか説明がつかない。namespaceやparameter propertiesのように、パフォーマンスとは無関係な構文も同じ文脈で非推奨とされているのはなぜだろうか？ この記事は、その疑問から出発する。 TypeScript初期：JavaScriptにないものを独自に作っていた時代 TypeScriptが初めて登場した2012年、JavaScriptは今とはかなり違っていた。ES Modules（import/export）は標準化されておらず、ク
TUI を構築するための Typescript ライブラリ OpenTUI
AI コーディングエージェントの普及により、ターミナルベースの TUI アプリケーションの需要が高まっています。OpenTUI は Typescript で TUI アプリケーションを簡単に構築できるライブラリです。この記事では OpenTUI の特徴と基本的な使い方を紹介します。 AI コーディングエージェントの普及により、ターミナルにふれる時間が増えた開発者が多いでしょう。そんな中、ターミナルベースの TUI (Text-based User Interface) アプリケーションの需要が高まっています。OpenTUI は Typescript で TUI アプリケーションを簡単に構築できるライブラリです。OpenTUI は opencode の基盤として利用されていることもあり、今後も開発が活発に続けられることが期待されます。この記事では OpenTUI の特徴と基本的な使い方を紹介
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Honoとフロントエンドの 型安全性について
GitHub - productdevbook/hucre: Zero-dependency spreadsheet engine. Read & write XLSX, CSV, ODS. Pure TypeScript, works everywhere.
GitHub - vercel-labs/just-bash: Bash for Agents
Elysia - Ergonomic Framework for Humans
