TypeScript入門2025年度リクルート エンジニアコース新人研修の講義資料です
Result型とESLintでエラーハンドリング漏れを検出する
こんにちは、よしこです。 この記事では、わたしの所属する株式会社ナレッジワークで最近コードベースに取り入れた「エラーハンドリング漏れ防止の仕組み」について紹介します。 背景 「通信を伴うアクションに失敗しても画面にエラーフィードバックが表示されない」という実装漏れをしてしまったことがあり、今後こういうことが起きないように仕組みで防止したいと思いました。 「忘れてしまった」という問題なので、テストで担保するのも難しいように思いました。実装するのを忘れてしまっているということは、テストを書くこともセットで忘れてしまっているはずだからです。 「気をつける」「チェックリストを作る」のような人間が注意する方向ではなく、「嫌でも気付く」「忘れていたらCIが通らない」のように、必要なハンドリングを強制する形にできないか？と思いました。 課題 実行時に通信エラーが起きる可能性があり、ユーザーフィードバック
tsx と Node.js Type Stripping の違い - mizdra's blog
tsx は TypeScript コードを事前トランスパイルすることなく、直接 Node.js で実行するためのツール。 https://github.com/privatenumber/tsx ところで最近の Node.js には Type Stripping という機能が入った。これを使うと、tsx なしで TypeScript コードを事前トランスパイルせずに実行できる。 https://nodejs.org/api/typescript.html#type-stripping 両者の違い 一見すると両者は機能的に同じものかのように思うけど、実は結構違いがある。 import specifier の指定方法が異なる 最も大きな違いは、「import specifier」の指定方法。import specifier というのは、以下の部分のこと。 import { add } './m
将来を見据えて管理画面のフロントエンドをガッと改善している - inSmartBank
こんにちは、株式会社スマートバンクでサーバーサイドエンジニアをやっています、すてにゃん (id:stefafafan) です。今回は社内で活用している管理画面に対して実施した様々な技術的な改善を紹介していきます。 背景 改善サイクルの高速化 開発者体験の向上 依存ライブラリのメンテナンス AIエージェントを意識した改善 将来を見据えたコード品質の担保 Linterルールの有効化 TypeScriptの設定を厳格化 パッケージのバージョン指定やアップデート周りの調整 今後の課題と展望 終わりに 背景 スマートバンクではお問い合わせ対応や調査をするために社内向けに管理画面を用意しています。この管理画面は以下のスライドにあるように、ユーザー向けの機能とはリポジトリを分けて運用しています。 この構成を取ることで、プレゼンテーションロジック (UI) とドメインロジックを分離することができ、認知負荷
Oxlint Type-Aware Preview
We're thrilled to announce type-aware linting in oxlint! The long-awaited no-floating-promises and related rules are here. This preview release aims to engage with the community for collaboration and discussion by documenting our decision process and technical details. Quick Start If oxlint is already configured, install oxlint-tsgolint and run oxlint with the --type-aware flag:
【TypeScript】enumを使ったっていいじゃないか
TypeScriptで定数をどのように表現するか、というのは意外に意見が分かれるテーマです。本稿では、enumの特徴とその代替手段を整理し、何を採用すべきかを考えてみます。 enumを推奨しないという意見が多いのは知っていても、何故そう言われているのか、を理解していますか？ 「使ってはダメ」と思考停止するのではなく、この記事を読むことでメリット・デメリットを理解して自分で選択できるようになる、かもしれません！ 列挙型（enum）とは enumはJavaScriptにはないTypeScript独自の構文で、定数を集合としてまとめて扱うことができます。 enum Mode { Auto = 'Auto', UDP = 'UDP', TCP = 'TCP', } const mode: Mode = Mode.Auto
Announcing TypeScript 5.9 Beta - TypeScript
Today we are excited to announce the availability of TypeScript 5.9 Beta. To get started using the beta, you can get it through npm with the following command: npm install -D typescript@beta Let’s take a look at what’s new in TypeScript 5.9! Minimal and Updated tsc --init Support for import defer Support for --module node20 Summary Descriptions in DOM APIs Expandable Hovers (Preview) Configurable
similarity-ts でAIと人間が書き散らした重複コードを見つける
Analyzing code similarity... === Function Similarity === Checking 142 files for duplicates... Found 8 duplicate pairs: ------------------------------------------------------------ Similarity: 89.09%, Score: 8.0 points (lines 9~9, avg: 9.0) src/utils/getUserById.ts:4-12 getUserById src/utils/findUserById.ts:8-16 findUserById Similarity: 88.00%, Score: 14.1 points (lines 15~17, avg: 16.0) src/servic
TypeScript 環境構築ガイドラインを書いてLLMに再現させる
TypeScript ツールチェインは多種多様で、毎回目的に沿ってプロジェクトを設定するのが非常に大変です。 なので、再現性のある環境構築手順を作って LLM に丸投げすることにしました。 (この記事の7割はAIに書かせて、自分で30分かけて書き直しました) tl;dr Claude Code に読ませる前提のTypeScriptの環境構築ガイドラインを作った docs/ts-guide/ にドキュメントを配置して、LLM（Claude）にそれを読ませる プロジェクトの要件を伝えて、LLMに適切な設定を追加させる ベースラインとなる基礎部分から始めて、対話的に必要な機能を追加していく How to use すごい雑に実態を説明すると共通セットアップとただのライブラリの使い方のドキュメントです。 # 新しいプロジェクトを作成 mkdir my-app cd my-app # ts-guide
TypeScriptの条件分岐をスマートに記述するためのTips - Nealle Developer's Blog
はじめに こんにちは、ARCH チームの立川です。 今回が初めてのテックブログになります。 先日、社内で「条件分岐をスマートに評価する」というテーマで、TypeScript（JavaScript）における条件分岐の書き方について発表する機会がありました。古いコードに触れる中で、見通しの悪い記述を多く見かけることがあったため、発表に至った経緯があります。 この記事では、その発表内容をベースにコードの可読性を高める条件分岐のテクニックをご紹介します。基礎的な内容ではありますが、少しでも役立つヒントがあれば幸いです！ 三項演算子をよりスマートに使うためのヒント 三項演算子は非常に便利ですが、状況によってはもっとシンプルで読みやすい代替手段があります。ここでは、等価な三項演算子と比較しながら、それらの方法を紹介します。 null 合体演算子（ ?? ）を活用する null 合体演算子は、左辺が n
Claude Codeを使って自分用のプロトタイプ開発環境を整理した
プロトタイプ開発環境というのは、雑に思いついたwebアプリを素早く作成するための環境のことで1年半くらい前にもこういう記事を書いた。 個人開発やサイドプロジェクトで「ちょっとしたアイデアを形にしたい」というときになんかゼロから環境構築するのは面倒だし、かといって適当に作ると後々メンテナンスが大変になる。 以前はViteを使って簡単なプロトタイプを作っていたが最近のAI Codingの進化によりプロトタイプ以上にしっかり動くものまで簡単に作れるようになってきた。そうなるとpure viteより最初からもう少し大袈裟だけども発展性のある技術スタックで作っても良いのではないかと思う。 また、転職して以来Cloudflareを触っていなかったし、最近はNext.jsも触っていなかったので、その辺りのキャッチアップも兼ねて試行錯誤してみることにした。結局RSCに慣れないおじさんなのでPages Ro
Biome v2—codename: Biotype
We are happy to announce that Biome v2 is officially out! 🍾 Biome v2—codename: Biotype, the first JavaScript and TypeScript linter that provides type-aware linting rules that doesn’t rely on the TypeScript compiler! This means that you can lint your project without necessarily installing the typescript package. With this release, the Core Contributors of the project want to show to the whole comm
判別可能なユニオン型 (discriminated union) | TypeScript入門『サバイバルTypeScript』
TypeScriptの判別可能なユニオン型は、ユニオンに属する各オブジェクトの型を区別するための「しるし」がついた特別なユニオン型です。オブジェクトの型からなるユニオン型を絞り込む際に、分岐ロジックが複雑になる場合は、判別可能なユニオン型を使うとコードの可読性と保守性がよくなります。 通常のユニオン型は絞り込みが複雑になるTypeScriptのユニオン型は自由度が高く、好きな型を組み合わせられます。次のUploadStatusはファイルアップロードの状況を表現したユニオン型です。アップロード中InProgress、アップロード成功Success、アップロード失敗Failureの組み合わせです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - unjs/jiti: Runtime TypeScript and ESM support for Node.js
oRPC - Typesafe APIs Made Simple 🪄
TypeScript 5.9リリース！ECMAScriptの新しい仕様 `import defer` が利用可能に
TypeGPU入門
TypeScript + Reactで特定の要素だけを受け付けるコンポーネントを型安全に実装する - Qiita
Node Target Mapping
GitHub - Nergie/no-barrel-file
