ソフトウェアは、どんな部品でできているか

プログラミングを学び始めると、「フロントエンド」「バックエンド」「データベース」「デプロイ」といった言葉が次々に出てくる。ここは、それらがそれぞれ何をしていて、どうつながって一つのソフトウェアになるのかを、初学者向けに地図にしたサイトです。

地図には2つの軸があります。部品の役割で分けた「分野」と、道具の性質で分けた「種別」。その上に代表的なツール 53 件を置き、どのツールも「できること」だけでなく「できないこと」と「限界値」を、公式ドキュメントの出典つきで同じ形で載せています。使い方は載せません。

① 分野から学ぶ

部品の「役割」で分ける。画面、サーバー、データの保存……という12の分野が、どうつながって一つのソフトウェアになるか。

  1. 言語・実行環境 プログラムを書くための「言葉」と、それを動かす仕組み
  2. 画面・フロントエンド 利用者が見て、触る画面をつくる。ブラウザの中で動く部分
  3. サーバー・API 画面の裏側で、頼まれた処理をしてデータを返す係
  4. データの保存 データをなくさず置いておく場所。形(表・文書・ファイル)で種類が分かれる
  5. 実行基盤・ホスティング 書いたコードを、自分のパソコンの外で動かし続ける場所
  6. 開発基盤・CI/CD コードの変更を、壊さずに本番へ届ける仕組み
  7. 監視・可観測性 動いているものの様子を知り、壊れたら気づく
  8. 認証・セキュリティ 誰がアクセスできるかを決め、守る
  9. 自動化・連携 決まった作業を、人手なしで繰り返す
  10. ノーコード・SaaS コードを書かずに済ませる選択肢
  11. データ処理・分析 溜まったデータを集計・変換・可視化する
  12. AI・機械学習 文章の生成・要約・分類や、予測をアプリに組み込む

全体像の図と、学ぶ順番へ

② 種別から学ぶ

道具の「性質」で分ける。自分で書く土台か、インストールして動かすものか、借りて使うサービスか。同じ分野の中で何を比べているのかが見える。

  1. 言語 プログラムを書くための「言葉」そのもの (4件)
  2. 実行環境 書いたコードを実際に動かすプログラム (1件)
  3. フレームワーク 言語の上で「決まった作り方」を提供するライブラリのまとまり (8件)
  4. ツール 自分の環境にインストールして使うソフトウェア (13件)
  5. マネージドサービス 事業者が運用していて、借りて使うサービス (26件)
  6. プロトコル 実装ではなく、みんなが従う「約束事」そのもの (1件)

種別同士の関係へ

ツール一覧(53件)

分野ごとに、学習コストの低い順。各分野の「最初に触るなら」を太字にしている。 検索では略称(GAS、S3、PG)でも引ける。

言語・実行環境

  • Node.js 実行環境 JavaScriptをブラウザの外(サーバー・CLI)で動かす実行環境
  • Python 言語 読みやすさを優先した動的型付け言語。データ処理・自動化・AI分野の共通語
  • Go 言語 単一バイナリに固めて配布できる静的型付け言語。並行処理と配布が軽い
  • TypeScript 言語 JavaScriptに静的型を足した言語。Node.jsでブラウザとサーバーを同じ言語で書く
  • Rust 言語 メモリ安全性をコンパイル時に保証する、GCを持たない静的型付け言語

画面・フロントエンド

  • Astro フレームワーク 既定でJavaScriptを出さない静的サイト生成器。必要な部分だけ島として動かす
  • React フレームワーク コンポーネントと状態でUIを組む、ブラウザ画面向けのJavaScriptライブラリ
  • SvelteKit フレームワーク Svelteでルーティング・サーバー処理・静的出力までを完結させるフレームワーク
  • Next.js フレームワーク Reactにルーティング・サーバー描画・APIを足した、Web アプリのフレームワーク

サーバー・API

  • FastAPI フレームワーク 型ヒントからAPI仕様と検証を自動生成する、Pythonの非同期Webフレームワーク
  • Firebase マネージドサービス Google Cloud上で動く、モバイル/Web向けのドキュメント指向BaaS
  • Hono フレームワーク Web標準APIのみで書かれ、エッジからNode.jsまで同一コードで動く軽量フレームワーク
  • Supabase マネージドサービス PostgreSQLを中核に認証・ストレージ・リアルタイムをまとめたBaaS

データの保存

  • Amazon S3 マネージドサービス 容量無制限・従量課金の、AWS のオブジェクト(ファイル)ストレージ
  • Meilisearch ツール あいまい検索とタイポ許容に強い、数十ミリ秒で応答する全文検索エンジン
  • Redis ツール 全データをメモリに置く、ミリ秒未満で応答するキー・値/データ構造サーバー
  • SQLite ツール サーバー不要、単一ファイルで動く組み込み型の関係データベース
  • MongoDB ツール JSON風のドキュメントをスキーマレスに保存する、水平分散前提のNoSQL DB
  • PostgreSQL ツール 標準SQLに忠実で拡張性の高い、オープンソースの関係データベース

実行基盤・ホスティング

  • GitHub Pages マネージドサービス GitHubリポジトリから静的サイトを無料で公開するホスティング
  • Render マネージドサービス Git連携でWebサービス・常駐ワーカー・DBを運用するHeroku型のPaaS
  • Vercel マネージドサービス Gitに連携し、Next.jsなどのフロントエンドを自動デプロイするホスティング基盤
  • AWS Lambda マネージドサービス サーバー管理なしでコードをイベント駆動・従量課金で実行するAWSの基盤
  • Cloudflare Workers マネージドサービス V8アイソレートで動く、Cloudflareのエッジサーバーレス実行基盤
  • Docker ツール アプリと実行環境をイメージに固め、どこでも同じに動かすコンテナ基盤
  • Fly.io マネージドサービス Dockerイメージを世界中のリージョンにVM(Machine)として配置するPaaS

開発基盤・CI/CD

  • GitHub マネージドサービス Git リポジトリのホスティングに PR・Issue・CI を統合した開発基盤
  • GitHub Actions マネージドサービス GitHub リポジトリの push・PR・スケジュールで動く CI/CD 実行基盤
  • Git ツール 分散型バージョン管理システム。全履歴を手元に持ち、ほぼ全操作がローカル
  • GitLab マネージドサービス リポジトリ管理からCI/CDまでを一体化したDevOpsプラットフォーム
  • Playwright フレームワーク Chromium/Firefox/WebKitを1つのAPIで自動操作するE2Eテストフレームワーク
  • Terraform ツール クラウド資源を HCL で宣言し、差分を計算して適用する IaC ツール

監視・可観測性

  • Sentry マネージドサービス アプリで起きた例外をスタックトレース付きで集め、発生源を特定するエラー追跡サービス
  • Datadog マネージドサービス インフラ指標・ログ・APM・エラーを一つの画面に集約する、ホスト課金の SaaS 監視基盤
  • Prometheus + Grafana ツール 時系列メトリクスを収集する Prometheus と、可視化・通知を担う Grafana の定番の組み合わせ

認証・セキュリティ

  • Clerk マネージドサービス 作り込み済みUIコンポーネントごと導入できる開発者向け認証サービス
  • Auth0 マネージドサービス 多様なID連携に対応するエンタープライズ向け認証・認可基盤
  • Cloudflare WAF / DDoS 保護 マネージドサービス エッジでHTTPリクエストを検査し攻撃・DDoS・ボットを遮断するCDN型WAF
  • OAuth 2.0 / OpenID Connect プロトコル 認可・認証の標準仕様。実装はAuth0等の各サービスに委ねる

自動化・連携

  • cron / systemd timer ツール Linux 標準の定期実行機構。分単位の予定でコマンドを起動する
  • Google Apps Script マネージドサービス Googleの各サービスをJavaScriptで自動操作する、サーバー不要の実行環境
  • n8n ツール SaaS 連携をノードで組む自動化ツール。自己ホスト可で実行回数課金

ノーコード・SaaS

  • Airtable マネージドサービス スプレッドシートの操作感でリレーショナルなデータを扱うノーコードDB
  • Make(旧Integromat) マネージドサービス SaaS間をノーコードで繋ぐビジュアル自動化ツール。操作数(オペレーション)課金
  • Notion マネージドサービス ドキュメント・DB・Wikiを1つにまとめ、Webサイトとしても公開できるツール
  • Zapier マネージドサービス 数千のSaaSをノーコードでつなぐ自動化サービス。タスク数課金

データ処理・分析

  • DuckDB ツール 1プロセスに組み込んで動く、列指向の分析(OLAP)用 SQL エンジン
  • BigQuery マネージドサービス サーバーレスで TB 級のデータを SQL で集計する、Google Cloud のデータウェアハウス
  • pandas フレームワーク Python で表形式データをメモリ上で整形・集計・可視化する標準ライブラリ

AI・機械学習

  • Claude API(Anthropic) マネージドサービス Anthropic の Claude モデルを HTTP で呼び出す、従量課金の LLM API
  • Ollama ツール LLMを手元のPC・サーバーで動かす、OSSのローカル実行ランタイム
  • OpenAI API マネージドサービス OpenAIのGPTモデルをHTTPで呼び出す、従量課金のLLM・埋め込みAPI
  • Hugging Face マネージドサービス 機械学習モデル・データセットを共有し、推論も呼び出せるハブ兼API

種別ごとに分けた全量の一覧へ