0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Webアプリ開発フローを『家具の組み立て』に例えて覚えてみる

0
Last updated at Posted at 2026-08-14

この記事について

はじめまして、Nと申します。現在開発中のアプリの公開に向けて学習中です。
その過程で出てくる環境移行の話や各用語が小難しく感じたので、できるだけ身近な例に例えて覚えようという試みをアウトプットする記事を書いてみました。

🤔💭ビルドってなに?デプロイとは??

エンジニアリングの勉強をしていて最もぶつかる壁といってもいいのではと思うのが「専門用語」だと私は思います。上記のような疑問から、自分なりにわかりやすい例えに置き換えて整理しようと思ったのが発端です。

特に読んでいただきたい方

  • 私と同じくエンジニアの勉強を初めて間もない皆様
  • 初学者を見守ってくださるお兄さんお姉さんの皆様

おおまかな開発フローのまとめ

Webアプリを開発して公開していく流れを調べると、下記のような工程が登場するようです。
※Webアプリ開発全般に必ず存在したり、全部がこの順番通りというわけでもないみたいです。

  1. コミット / プッシュ
  2. コンパイル
  3. リンク
  4. パッケージング
  5. ビルド
  6. テスト環境へのデプロイ
  7. ステージング環境へのデプロイ
  8. 本番環境へのデプロイ

調べてみて、初見でわかる用語は「環境」くらいでした w
そこで、各工程を組み立て式の家具に置き換えてみました。
最近、手動式の昇降デスクを購入したのでそれを例にしてみます。

昇降デスクの組み立て(DIY)で置き換えてみる

  1. コミット / プッシュ
    => 注文した昇降デスクが家に届いたので、組み立てていくぞ!と準備をします。

  2. コンパイル
    => 手元の取扱説明書を確認しながら、付属の部品たちを確認し、作業マットの上に広げます。

  3. リンク
    => ネジを埋めていったりして、脚の部品や天板の部品を作っていきます。

  4. パッケージング
    => 脚グループ、天板グループ、ハンドルグループなど作った部品ごとに仲間分けします。

  5. ビルド
    => 仲間分けした部品たちを合体して組み合わせていきます。

  6. テスト環境へのデプロイ
    => 組み立てたデスクをその場に立ち上げてみます。
    => ネジがズレていたり、天板の向きが間違っていないか、ガタつきがないかをチェックします。

  7. ステージング環境へのデプロイ
    => 実際に座ってみたり、家族にも使ってみてもらいます。

  8. 本番環境へのデプロイ
    => 自分の部屋の適切な位置に配置し、必要な物を置いたり配線を整えて使っていきます。

細かい表現の違いは抜きにして大枠を理解しようとするならばこんな具合でしょうか。
今までローカルで開発していたものは、これでいうとまだ作業マットの上にいるようです。
そしてここから先の学習で、ようやく部屋の配置を行っていくんですね。

ちなみに・・

自分のローカル環境のデータベースを確認するとこのような記載になっていました。

mysql> show databases;
+---------------------+
| Database            |
+---------------------+
| gym_log_development |
| gym_log_test        |

やっている時は気付きませんでしたがdevelopmentで作業してたようです。
そして、testというDBが存在していることもこのアウトプットに際して気付くことができました。この後、staging環境 => production環境 と続いていくんですね。

いわゆる手動テストにあたるような事はこれまで行っていたようなので、test環境とはなんぞやを今度実際に触ってみて、この記事に追記してみようと思います。

自分的に言葉だけ知ってたものが理解に繋がったポイント

これらの一連の流れを自動化できる仕組みを「CI/CD」と呼ぶそうです。
名前だけは聞いたことがあるという感じでしたが、意味をイメージできるようになった気がします。

CI(継続的インテグレーション / Continuous Integration)

この例えに倣うなら、作業を進める度に、ロボットが自動で「設計図通りか?」「コンパイルエラー(ひび割れ)はないか?」を即座にチェックし、その場で仮組み(ビルド・テスト)まで終わらせる仕組みだそうです。

CD(継続的デリバリー・デプロイメント / Continuous Delivery / Deployment)

同じくこの例えに倣うと、完成(ビルド)した家具を、自動運転ロボットが自動で自分の部屋まで運んで、指定の場所にピシッと設置(デプロイ)まで完了させる仕組みだそうです。

このように例えに置き換えてみるといかに便利で重要な仕組みかが分かった気がします。
CI/CD についてはもう少し自分の学習が進んでから改めて整理したいと思います!

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?