Microsoftが2012年10月に発表した AltJS のひとつ。C#の設計者でもあるAnders Hejlsbergが設計した。
構文はJavaScriptの上位互換であり、オプショナルな型アノテーションやECMAScript6 (ECMA-262 6th) のクラス構文などを追加している。
はじめに 今回はHonoのRPCを利用する際に、フロント・バックエンドで厳密に型を共有する方法を紹介します。 SuperJSONで型情報をjsonに追加した上で、zod.parse()を利用して値を検証して型を付与します。 利用技術 Hono v4.7.11: Webフレームワーク SuperJSON v2.2.2: jsonに型情報を付与する Zod v3.25.56: バリデーション TypeScript 背景 HonoのRPC機能では、フロントエンドから下記のようにAPIを呼び出すことができます。 // バックエンド側のレスポンス作成部分 export const getSampleHa…
はじめに こんにちは、企業チームでフロントエンドを中心に業務を行なっている赤星です。 今回は5/23 ~ 5/24に東京にて開催されたTSKaigi 2025に現地参加してきました。私含めた4名で参加したのでレポートと感想を書いていきたいと思います! 2025.tskaigi.org はじめに TSKaigi 2025 現地の様子 印象に残ったセッション+LT 型システムを活用したESLintカスタムルール開発入門 〜固有ドメインにおけるコーディング規約を開発する〜 型パズルを好きになるために、競プロを型システムだけで解いてみることにした TypeScriptとは何であって何でなく、誰のもので…
皆様こんにちは。 S+BIMチームのコモドドラゴンです。 最近、エリッククラプトンのライブに参戦したのですが、まさに、Wonderful tonight でした! そんな私が今回ブログ記事として、執筆させていただくテーマは、TypeScript Tipsです。 昨今のフロントエンド界隈はSPAやSSRなどの技術が発達したのと同時に、 とても複雑化してきており、生のJSではランタイム時にしかエラーが分からなかったり、 JSDocでパラメータや戻り値の説明を補完していたりするケースも少なくないかと思います。(フロントエンドに限らず、js/tsはバックエンドで使用されることもあります) そんな時に役…
UnsplashのJoanna Kosinskaが撮影した写真 こんにちは。ReactエンジニアのT.C.です。 TypeScriptの型を知らなくても動作やパフォーマンスには直接影響しないので、AIなどが便利に活用できるようになった現在でも意識して学ばないと触れる機会が少ないと思います。 Mapped TypesやIndexed Access TypesなどTypeScriptにはやや高度な型定義の方法がありますが、Template Literal Typesという書き方に最近気づいたので、ご紹介します。 詳しいことや具体的な実装は公式ページやAIにお任せしますので、本記事では「こんなことも…
TypeScriptが仕事で使えるレベルになるためには、単に基本的な文法や構文を理解するだけでなく、実際のプロジェクトやチーム開発でどのように活用するか、スケーラビリティや保守性を考慮しながらコードを書く能力が求められます。この記事では、TypeScriptを実務で使うために必要な基本から、少し踏み込んだ中級レベルの知識を、コード例を交えながら丁寧に解説します。 TypeScriptとは TypeScriptは、JavaScriptのスーパーセットで、JavaScriptに静的な型を追加した言語です。静的型付けとは、変数や関数にあらかじめ「このデータはこの型でなければならない」というルールを設…
はじめに こんにちは!スタメンでエンジニアをしているhisaです。 2025年5月23日・24日に東京・ベルサール神田で開催された TSKaigi 2025 に、両日現地参加してきました! 今回は、イベントの雰囲気やセッションでの学び、参加者との交流などを中心に振り返っていきたいと思います。 ちなみにスタメンは今回のTSKaigiに Goldスポンサー として協賛し、当日はブース出展も行いました! スタメンでは主力事業のTUNAGやグループ事業のWatchyで幅広くTypeScriptを活用しています。 フロントエンドのみならず、バックエンドやReactNativeでのモバイルアプリ開発など幅…
まえがき はじめまして!カミナシでソフトウェアエンジニアをしている shimmy(@naoya7076) です。 カミナシは 2025年5月23・24日に開催された「TSKaigi 2025」にゴールドスポンサーとして協賛し、私は現地で参加しました。 各登壇の内容やトーク内容の詳細は、きっと誰かがまとめてくれていると思いますので、この記事では以下の点に絞って書いていこうと思います。 やること 自分の中でテーマごとに整理した内容と、それぞれの感想 TS Kaigiで自分が聞いたセッション全体を通じて感じたこと やらないこと 登壇の内容を網羅的に伝えること 全ての登壇について詳細に書くこと 静的解…
🧪 @hono/zod-openapi でAPI開発をネクストレベルに 前回投稿の記事、「TypeScriptとhonoで作るDI実践入門」ではHonoとTypescriptで型安全なDIを実践しました。 techblog.spiderplus.co.jp しかし、前回の実装では以下の課題がありました。 リクエスト/レスポンスの型安全性が不十分 APIドキュメントを手動で管理する必要がある バリデーションロジックが分散してしまう 今回はこの課題に対して、@hono/zod-openapiを導入し解決していきます。 @hono/zod-openapiを導入することで、ZodスキーマからOpenA…
🐾 はじめに こんにちは、砂川(@misdo_tabeyo)です。 普段は『弁護士ドットコムLIBRARY』と『BUSINESS LAWYERS LIBRARY』というサービスでフロントエンド開発を担当しています。これらのサービスでは、Orval を利用して OpenAPI からAPIクライアントやZodのバリデーションスキーマを生成しています。 そんなOrvalに最近、Model Context Protocol (MCP) サーバーの生成機能が追加された と知り、早速試してみました。 MCP は LLM(大規模言語モデル)アプリケーションと外部ツール・データソースを接続するための標準プロト…
研究開発部 システム&セキュリティ担当の松倉です。 いつもセキュリティ関係のネタを書くことが多いのですが、今回はインフラのお話です。 AWS 環境を IaC 化したい AWS CDK について CloudFormation と API リクエスト実行制限 具体例で説明 解決方法 NestedStack の利用 各 NestedStack に明示的な依存関係を設定 おわりに AWS 環境を IaC 化したい クラウド上のインフラ環境を IaC (Infrastructure as Code) により構築する組織は増えてきていると思います。近年では、大規模言語モデル (LLM) などの生成 AI …