Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Web IDE『Wazamono-Editor』Tech Stack List
Search
Kanata
March 24, 2026
4
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Web IDE『Wazamono-Editor』Tech Stack List
Kanata
March 24, 2026
More Decks by Kanata
See All by Kanata
Web IDE『Wazamono-Editor』Proposal
kanata_document
0
5
Web IDE『Wazamono-Editor』RDD
kanata_document
0
4
Featured
See All Featured
Speed Design
sergeychernyshev
33
2.2k
Git: the NoSQL Database
bkeepers
PRO
433
67k
Why Our Code Smells
bkeepers
PRO
340
58k
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.6k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
2.1k
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
300
Site-Speed That Sticks
csswizardry
13
1.6k
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
Test your architecture with Archunit
thirion
2
2.4k
A better future with KSS
kneath
240
18k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
590
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
Transcript
Web IDE『Wazamono-Editor』技術スタックリスト © 2026 kanata_yurufuwa All Rights Reserved.
技術スタックリスト カテゴリ テクノロジ 役割 採用の理由(根拠)
開発環境 Windows 11 開発ホストOS 標準的な開発プラットフォームとして。 Antigravity 開発エディタ 最先端の開発環境を使うため。 Git バージョン管理 実装工程での変更をさかのぼるため。 Node.js 実行ランタイム モダンなフレームワークやnpmを使うため。 npm パッケージ管理 車輪の再発明を避けるため。 フレームワーク TypeScript 開発言語 型安全性。 Vite ビルドツール 高速なHMR(Hot Module Replacement)。 vite-plugin-pwa PWA構築 インストール不要なWeb IDEを実現するため。 React UIライブラリ 複雑なUI状態をコンポーネント単位で管理するため。 react-error-boundary エラー境界 アプリ全体のクラッシュを防ぐため。 Zustand 状態管理 モード切り替え、モーダル開閉、通知ドットの管理を 軽量に行うため。 スタイリング /UI Tailwind CSS CSSフレームワーク 独自のテーマを容易に実装するため。 Radix UI UIコンポーネント ノイズのない和風UIをゼロからデザインするため。 © 2026 kanata_yurufuwa All Rights Reserved.
エディタ実装 CodeMirror 6 エディタエンジン モバイル端末向けのエディタエンジンとして最適。
esbuild-wasm バンドラ ユーザーコードをインメモリでビルド/実行するため。 データ管理 OPFS ストレージ ユーザーコードやGitデータなどを ブラウザ内で永続化するため。 IndexedDB メタデータDB タブの表示順序やユーザー設定などを ブラウザ内で永続化するため。 Dexie.js IndexedDBラッパー IndexedDBの操作を型安全かつ簡潔なコードで記述するため。 isomorphic-git Gitエンジン .gitディレクトリをOPFS内に構築し、 ブラウザ内でのバージョン管理を実現するため。 fflate 圧縮・展開 ユーザーのプロジェクトデータを ZIPにまとめて出力する処理を高速実行するため。 Buffer ポリフィル isomorphic-git等、Node.js APIに依存するライブラリを ブラウザ内で動作させるため。 ホスティング Cloudflare Pages 静的アセット配信 セキュアかつ高速にアプリを配信するため。 アセット /フォント Shippori Mincho デザイン用 フォント デザイン性が重要な部分に使用するため。 M PLUS 1 Code コーディング用 フォント 視認性が重要な部分に使用するため。 品質管理 /テスト Vitest 単体テスト 状態管理ロジックを検証するため。 © 2026 kanata_yurufuwa All Rights Reserved.
Playwright E2Eテスト 本番環境に近いシナリオで自動検証するため。 ESLint リント
プロジェクト独自のコーディング規約を自動適用するため。 © 2026 kanata_yurufuwa All Rights Reserved.