uhyoさんが語る、「TypeScriptエキスパートへの道しるべ」 — TypeScriptの入門、学習法から最新トレンドまで
本連載は、「 エキスパートへの道しるべ（Load to Expert） 」をテーマとして、初級者がエキスパートになるためのヒントを、日本を代表するエキスパートの方々に伺う企画です。 TypeScriptは現代のWeb開発において欠かせない言語となっています。今回は、TypeScriptのエキスパートとして知られるuhyo氏に、初学者向けのTypeScript学習法や魅力について詳しく話を伺いました。これからTypeScriptを学ぼうと考えている方に、確かな道筋を示す内容となっています。 uhyoさんをTechFeed上でフォローしよう！ TypeScriptとは？その魅力と重要性 ――自己紹介をお願いします。 uhyo: uhyoと申します。TypeScriptのTechFeed公認エキスパートとして、TypeScriptに関する情報発信を行っています。 普段はReactなどを使用した、
非同期処理のエラーがErrorBoundaryで捕捉できなかった話
この記事は「Medley (メドレー) Advent Calendar 2024」の16日目の記事となります。 はじめに こんにちは、メドレーの村上です。 今回はTanStack Query（旧React Query）を使用した非同期処理のエラーハンドリングで遭遇した問題とその解決方法について共有させて頂きます。 使用しているライブラリとバージョンはこちらです。 { "react": "^19.0.0", "@tanstack/react-query": "^5.62.7", "@sentry/react": "^8.43.0" } export const App: FC = () => { const { mutateAsync } = useMutation({ mutationFn: async () => { // APIリクエストが失敗した場合にエラーをスロー throw ne
CSS・TypeScriptの相性が抜群。vanilla-extractが最高のCSS開発体験をくれた
私はこれまで、 React ・ Next.js でのスタイリングには、CSS Modules + Sass を使っていましたが、最近は vanilla-extract を使うようになりました。TypeScript との相性が良く、長い間求めていた CSS 開発体験が実現できるためです。 vanilla-extract とは、CSS を TypeScript で型安全に書ける CSS in JS です。 State of CSS 2022 でも満足度が高く、先日は Next.js の appDir でも正式サポートされました。 本記事では、CSS Modules から vanilla-extract に移行した経緯と、そのメリットについて紹介します。 CSS Modules で限界を感じていた CSS Modules を使っていた理由はいくつかありますが、主に次のようなものです。 従来の C
【第2回】TypeScriptもウェブも仕様や原理から楽しむ | GeeklyMedia(ギークリーメディア) | Geekly（ギークリー） IT・Web・ゲーム業界専門の人材紹介会社
2022年4月に著書『プロを目指す人のためのTypeScript入門』が発売された鈴木僚太さん(https://twitter.com/uhyo_)。QiitaやTwitterでは「うひょ（uhyo）」さんとして、TypeScriptやフロントエンドの話題を中心にウェブ技術に対する踏み込んだ解説でも知られています。 著書ではあえて触れられなかったという「TypeScriptでウェブアプリケーションをどう書くか」という観点へのヒント、なぜそれを書かなかったのか、そして仕様や原理に立ち返って自ら考えることの楽しさについて、株式会社一休CTOの伊藤直也さん(https://twitter.com/naoya_ito)が聞き出します。 ・伊藤 直也さん / 株式会社 一休 執行役員 CTO 新卒入社したニフティ株式会社でブログサービス「ココログ」を立ち上げ、CTOを務めた株式会社はてなでは「はてな
TypeScript 4.9のas const satisfiesが便利。型チェックとwidening防止を同時に行う
TypeScript 4.9 から、satisfies operator が使えるようになりました。従来のas constと組み合わせ、型チェックと widening 防止を同時に行えます。筆者的には、"顧客が本当に必要だったもの"です。 本記事では satisfies とは何か？ as const とは何か？ 2つを組合わせるとどのようなメリットがあるのか？ について、実際のコードと共に解説します。 結論 TypeScriptで 定数を export する場合は、as const satisfies を設定しておくと便利です。 export const myName = "田中" as const satisfies string; export const foodList = { ramen: "ラーメン", udon: "うどん", soba: "そば" } as const sa
JavaScript／TypeScriptランタイム「Deno 1.25」が公開、npmパッケージの実験的サポートなど変更多数
「Deno 1.25」では、8月15日に開発チームが予告した通り、npmパッケージに対応し、高速なHTTPサーバーを提供している。ただしnpmパッケージへの対応については「実験的」な段階にあるため、「deno vendor」「deno info」「deno install」といったコマンドではnpmパッケージを利用できない。 HTTPサーバーについてもまだ実験的としているが、現段階でも前バージョンまでに付属していたHTTPサーバーに比べて3倍速く、Node.jsのHTTPサーバーに比べて4倍速いという。ただ、新しいHTTPサーバーはHTTP/1.1にしか対応しない。HTTP/2以降への対応は計画しているというが、時期は明らかにしていない。そして、新しいHTTPサーバーを呼び出すAPIとして「Deno.serve()」を用意した。 さらに、サンプルプログラムとそれに対応するテストプログラムを
TypeScript 4.1で密かに追加されたintrinsicキーワードとstring mapped types
TypeScript 4.1では、Mapped typesにおけるkey remappingやtemplate literal typesに付随する新機能として、標準ライブラリにUppercaseなどの型が追加されました。 上の例から分かるように、Uppercase型は一つの文字列を受け取る型関数で、文字列のリテラル型を渡すとその文字列中の小文字を全て大文字にした文字列のリテラル型が返ります。他にも、Lowercase、Capitalize, Uncapitalizeがあります。 これらの型は標準ライブラリ（lib/es5.d.ts）にその定義があります。そこで使われているのがintrinsicキーワードなのです。以下はTypeScript 4.1時点の標準ライブラリからの引用です。 /** * Convert string literal type to uppercase */ typ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Microsoft、「TypeScript」高速化のために開発した「Deopt Explorer」を一般提供／「V8」の内部構造を理解している上級ユーザー向けの「Visual Studio Code」拡張機能