採用技術の深掘り
WEBクライアントアプリ開発で重要なのは「OS」ではなく「ブラウザ」と「開発ツール」です。
つまり👇
- OS → 何でもOK
- ブラウザ → 重要（実行環境）
- ツール → 開発効率を左右
👉 この3つの役割を理解するだけで、迷わなくなります。
なぜOSは何でも良いのか？
理由はシンプル
👉 プログラムは「ブラウザの中」で動くからです。
イメージで理解
-
従来のアプリ → OSの上で動く
-
WEBクライアントアプリ → ブラウザの中で動く
👉 OSよりもブラウザの影響が大きい
よくある誤解
❌「開発＝MacやLinuxが必要」 👉 不要です
✔ Windowsでも問題なし
ブラウザは何を選べばいい？
結論
👉 Chrome か Edge を使えばOK
理由
- 多くのブラウザがChromiumベース
- 動作が安定
- 開発ツールが強力
初心者におすすめ
👉 Edge（理由：最初から入っている）
Visual Studio Code は何に使う？
結論
👉 コードを書くための専用メモ帳（超強力版）
なぜ必要？
メモ帳との違い👇
- コードの自動補完
- エラー表示
- 多種多様な拡張機能により機能が追加可能
Node.js は何に使う？
結論
👉 「開発を楽にする裏方ツール」
できること
- ローカルサーバー（テスト用HTTP/HTTPSサーバー）起動
- ライブラリ管理
- ビルド処理
Volta は何に使う？
結論
👉 「Node.jsのバージョン管理」ツール
なぜ必要？
プロジェクトごとにNodeのバージョンが変わることがある。
よくある例
- Aプロジェクト → Node 18
- Bプロジェクト → Node 20
👉 Voltaで各プロジェクト毎に切り替え可能です。
Git は何に使う？
結論
👉 「やり直せる仕組み」
できること
- コードの変更履歴の保存
- 過去のコードに戻せる
- 過去のコードとの差分確認可能
よくある例
❌ 上書き保存で事故る ✔ Gitで戻せる
👉 精神的にかなり楽になります
mkcert は何に使う？
結論
👉 「ローカルでHTTPSを使うため」のツール
なぜ必要？
- 最近のブラウザはHTTPS前提
- 一部機能がHTTPだと動かない
HTTPだと動かない具体例
- PWA（Progressive Web Apps） Webサイトをネイティブアプリのように利用できるようにする仕組みや技術
- 一部のAPI（OPFSアクセス等）
OPFSとは何か？（重要ポイント）
結論
👉 ブラウザの中にある「ファイル保存領域」
特徴
- データをファイルとして保存できる
- 大容量対応
- SQLiteと相性が良い
何がすごいのか？
従来👇
- データ保存が弱い（LocalStorageなど）
現在👇
- ファイル
- SQLデータベース
👉 ブラウザだけで本格的なアプリ開発が完結できる
具体的なイメージ
- メモ帳アプリ
- 家計簿アプリ
- 本格的なオフラインDBアプリ
👉 全てブラウザで実現可能です。
まとめ
WEBクライアントアプリ開発で利用する技術選定の本質👇
- OS → 何でもいい
- ブラウザ → 主役
- ツール → 効率化
そしてなにより重要なのは👇
👉 全部そろえてから始めるのではなく、必要に応じて追加していくという考え方かも知れません。
RSSフィード
