今年俺を一番幸せにしたDX最高な奴ら10選
みなさん、普段から開発者体験（DX）を気にしてますか？ DXとは、開発中に感じる“心地よさ”や“効率の良さ”を指します。 車輪の再開発のようなDXを損なう体験がなければ開発はずっと楽しいんです！ そこでこの記事では、「心から開発を楽しめる」相棒たちを10選紹介します！ 1. Convex “SQLの呪縛”からの解放 歴史のあるSQLはどうしても、歴史に引っ張られます。 Supabaseとかを使ってると、Row Level SecurityやSQL Functionsとかで、死ぬほど書きにくいSQLを書かなきゃいけなくなることありますよね。まるでFirebaseの認証ルール並み。良くも悪くも結局SQLだから、隠しきれない歴史の重み、つまりDXの悪さがでてくる。 しかしConvexは一切そういうのはありません！！！！ 全てがDXを中心に一から考えられて作られたサービス。そう、React時代のバ
サバイバルTypeScriptとは | TypeScript入門『サバイバルTypeScript』
本書の目標は、本読者がTypeScriptをすぐに実務で利用できるよう、最短ルートに読者を導く一冊になることです。本書は、TypeScriptの網羅的なドキュメントではありません。逆に、実務であまり使わないTypeScriptの機能は割愛します。扱う内容は、頻出する機能にしぼりにしぼって、「実務でTypeScriptを使うなら、ここだけはおさえておこう」「ここだけはおさえておけば、実務で死なない(=サバイバルできる)」という観点で執筆しています。 本書はTypeScriptを中心に扱いますが、実務上、必要になる知識としてJavaScriptの仕様、フロントエンドフレームワークのReactなどについても扱います。 誰に向けて書かれた本か？本書は、プログラミング経験はあるが、これからTypeScriptをはじめる人、もしくは、始めたばかりという人を対象にしています。たとえば、次のような属性の
Biome、Webのためのツールチェーン
Prettierのようにコードをフォーマット、しかも高速Biomeは JavaScript、TypeScript、JSX、JSON、CSS そして GraphQL のための高速なフォーマッタ であり、Prettier と97%の互換性を持ち、CIと開発者の時間を節約します。 Biomeは、お気に入りのエディタでコードを書く際に、不正な形式のコードさえもフォーマットできます。
遂に Cloudflare + Next.js(OpenNext) + Prisma 6.7.0(No Rust) が動く時代が来た
現状たぶんこれが一番安いと思います。(※個人開発前提のスタックです) 実現したこと opennext for cloudflare prisma (no-rust, no-engine) prisma-postgres (free plan) つまり Cloudflare 上で Next.js を動かして、現実的なビルドサイズで Prisma を動かせました。 自分の手元のビルドサイズです。 ┌ ○ / 149 B 102 kB ├ ○ /_not-found 978 B 103 kB ├ ○ /prisma-test 149 B 102 kB # ... + First Load JS shared by all 102 kB ├ chunks/770-76939705ff65587a.js 46.5 kB ├ chunks/96e220d1-21a0fdc894793ec0.js 53
TypeScript/React/Next.jsおすすめ学習資料のご紹介
はじめに 今回は、現代のWEB開発で最も使用されている言語/フレームワークであるTypeScript/React/Next.jsについて学ぶために、私がおすすめしたい学習資料についてご紹介したいと思います。 非常に有用で、初心者から中級者、上級者まで幅広い層に向けた内容が含まれていますので、時間を見つけて是非読んでみてください。 ※TypeScript/React/Next.jsって何？という方のために、簡単に以下にそれぞれご説明いたします。 TypeScript Microsoftが開発した、JavaScriptを拡張したプログラミング言語。JavaScriptに比べ、型安全性の向上によるエラーの早期発見や、型注釈でコードの意図を明確にすることによる可読性/メンテナンス性の向上が期待できる。現代のWEB開発においては、ほとんどの開発者がJavaScriptからTypeScriptへ移行し
GitHub CopilotでTypeScriptの コード生成するワザップ
バイブコーディング超えてバイブデプロイ〜CloudflareMCPで実現する、未来のアプリケーションデリバリー〜
TypeScriptで知ってコードの安全性が上がったtips集
TypeScriptを用いた開発では、その型システムを活かしてランタイムエラーを事前に防いだり、実装漏れを防いだりとコードの安全性の向上を図ることができます。 本記事では、個人的に知ったおかげでコードの安全性が増した！と感じたtipsをまとめました。 ※ なお、linterを用いたコードの安全性向上も非常に有効ですが、この記事では主にTypeScriptの型システムに焦点を当てています。 tips集 配列周りのtips まずは配列を扱う際に役立つ、tipsを紹介します。 配列からUnion型を作成する ↓のように(typeof array)[number]で配列の全要素を持つUnion型を作成できます。 const fruits = ["apple", "banana", "lemon"] as const; type Fruit = (typeof fruits)[number]; //
ナメやがってこの型ァ!!超イラつくぜぇ～～～～～ッ!!
const colors = ["赤","青"] as const; type Colors = typeof colors[number]; //"赤" | "青" typeof colors[number]･･･ってよォ～～～～～ typeofはわかる。スゲーよくわかる TypeScritの世界では、typeofで変数から型を作れるんだよなァ だがnumberってのはどういう事だああ～～～～っ!? 配列にnumberを渡せるかっつーのよ───────ッ!! ナメやがってこの型ァ!! 超イラつくぜぇ～～～～ッ!! 解説 これはよォ 「Lookup Type」ってやつらしいぜぇ たとえばよォ 👇みたいに書くとPerson型からプロパティの型を取り出せるよなァ～?? type Person = { name: string, age: number } type name = Person
TypeScript+Jestでテストを書くときに型安全にモックする方法を教えてほしかった | みどりのさるのエンジニア
この記事は タイムリープTypeScript 〜TypeScript始めたてのあの頃に知っておきたかったこと〜 5日目の記事です。 はじめに 自分がTypeScriptを書き始めた頃に苦労したのが、Jestでテストを書くときのモックの型をどう書けば良いか分からないことでした。 調べても型の指定方法が分からず、泣く泣く as any でコンパイラーを黙らせて、補完が効かなくなりモヤモヤしながらテストコードを書いていました。 TypeScriptで型を妥協してテストコードを書いていた時は次のような弊害もあったので、どう型安全にテストコードを書けば良いのか非常に知りたかったです。 補完が効かなくなるのでコーディングが面倒になる プロパティをタイポした事に気づかずに、テストが失敗しても失敗している原因に気付けず疲弊する もくじ モジュールモックの型指定 関数モックの型指定 スパイモックの型指定 モ
【Vue3+TypeScript】v-onイベントハンドラの引数のキャスト | TekRog
v-onディレクティブで紐づけた「イベントハンドラ」や「トランジションフック」の引数から要素ノードのプロパティを参照、アクセスしようとするとTypeScriptではエラーが出てしまいます。そこで引数のダウンキャストが必要なのですが、「イベントハンドラ」と「トランジションフック」でそれぞれキャストの方法が違うので順番に説明します。
TypeScriptでEventの取り扱いがめんどくさ過ぎる。。。
はじめに Nuxt.js + TypeScriptを今試し中なのだけど、TypeScriptでのイベントの取り扱いが面倒なので、とりあえずStructural Subtypingを適用してみました。 今のところ問題なさそうなんだけど、軽く探して見た限りだとあまり類似のアプローチ無いし悪手なのかな？ てか、FWとか一般的なライブラリで対応してるけど見つけれてないだけの気がしてならない。。。 TL;DR Event型を取り扱うときはtargetの型が不明なのでコンパイルエラーになる事がある event: { target: HTMLButtonElement }型を指定するのが一番手っ取り早い 求む、もっと手軽な対応方法 TypeScriptでのEvent型の取り扱いの罠 クリックイベントが発生したHTMLのノードに対して作業したい事は良くあるかと思います。 例えば下記のように 「クリックした
TypeScript のエラーハンドリングを考える - Qiita
何番煎じかわかりませんが TypeScript でのエラーハンドリングについて考えてみたいと思います。 この記事で扱う TypeScript のバージョンは 4.3 です。 エラーを型安全に扱いたい TypeScript を書いていれば誰もが一度はぶつかる問題ではないでしょうか。 TypeScript では catch した例外は any として扱われます。 これは JavaScript の仕様上どんな値でも throw できてしまうため仕方のないことなのですが、せっかく型安全性を手に入れるために TypeScript を使っているのに any をハンドリングしなければならないのは苦痛です。 次のように例外を throw し得る関数 foo() のエラーハンドリングを考えてみます。
TypeScript入門『サバイバルTypeScript』〜実務で使うなら最低限ここだけはおさえておきたいこと〜
本書『サバイバルTypeScript』は実務でTypeScriptを使う開発者のための入門書です。そして、このページはTypeScriptの特徴を最速で把握できるよう、数百ページからなる本書のコンテンツをつまみ食いした要約です。 » 本書について詳しく知る » とにかく今すぐTypeScriptを書いてみたい TypeScriptとはJavaScriptのスーパーセットとなるプログラミング言語。静的型付け言語であり、プログラムの正しさが静的に検査できる。ライブラリやIDEなどの開発環境が充実しており、大きなエコシステムを持っている。Microsoftが2012年に開発し、オープンソースで公開した。» TypeScriptの特徴について詳しく知る » TypeScript誕生の背景について詳しく知る TypeScriptはJavaScriptのスーパーセットスーパーセットとは、元の言語と
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Next.jsの考え方