Denoでフロントエンド開発 2025年春版 / Frontend Development with Deno (Spring 2025)

Transcript

1. Denoでフロントエンド開発 2025年春版 fukuoka.ts #3 pixiv Inc. 森内建太 petamoriken 2025.3.21

2. 2 自己紹介 • Web  エンジニア • Deno コントリビューター • ECMAScript  や  Web 標準 を追うのが好き petamoriken カスタマーオペレーション

   ＆セーフティ本部 オペレーション開発部 Stage 4 

3. 3 • 権限機能（secure by default） ◦ npm 依存にマルウェアが混入した場合への防衛 • 開発者体験（DX）の向上 ◦

   TypeScript 型チェック、Lint、Formatterが付属 • まだ 100% Node.js 互換を達成しているとは言えない ◦ 所見  Deno v2.2 で結構動作するようにはなった Node.js の代わりに Deno を使う

4. 4 • 特に新規プロジェクトで Deno を採用するのがおすすめ ◦ ただし Next.js は（サポートしているが）厳しい • 弊部署では社内ツールのビルドなどに Deno を使っている Vite + React

   + TanStack Router フロントエンド開発に Deno を使う

5. 5 https://kt3k.github.io/talk_deno_frontend

6. 6 ここからライブコーディング

7. 7 （VS Code で公式の拡張を使う場合）

8. 8

9. 9

10. 10

11. 11

12. 12 🎉

13. 13 https://docs.deno.com/deploy/tutorials/vite/

14. 14 • 権限機能（secure by default） ◦ npm 依存にマルウェアが混入した場合への防衛 • 開発者体験（DX）の向上 ◦

    TypeScript 型チェック、Lint、Formatterが付属 • まだ 100% Node.js 互換を達成しているとは言えない ◦ 所見  Deno v2.2 で結構動作するようにはなった Node.js の代わりに Deno を使う（再掲）