この記事では、開発業務未経験の私が CRUD Webアプリ（REST API）を作成し、Dockerでコンテナ化し、GitHub ActionsでCI（テスト→ビルド→Dockerビルド）を回せるようになるまでの学習ロードマップと使用教材をまとめます。
対象は、私と同様に未経験〜初学者で「何から学べば一連の開発がつながるのか分からない」人、または知識が断片的で実装〜CIまで通した経験がない人です。
逆に、ある程度開発経験や知識があり学び直し目的の方にとっては、この記事の内容は冗長かと思うのでおすすめではありません。
ゴール設定
以下をもってして「CRUD Webアプリを完成させ、CIを回す」のゴールとします。
- シンプルな CRUD Web アプリを作成する
- バックエンド: Spring Bootを使い、REST APIを実装
- フロントエンド: Nginx が配信する静的 HTML + JavaScript（fetch）
- DB: PostgreSQL
- バックエンド/フロントエンド/DBはコンテナ化する
- Dockerfileでマルチステージビルド
- docker-compose.ymlで複数コンテナを扱う
- DBはvolumeでデータを永続化させる
- GitHub Actions を使って CI（テスト・ビルド・Docker ビルド）を回す
このゴールには、アプリ実装だけでなく Dockerによるコンテナ化 と CI（テスト→ビルド→Dockerビルド） まで含めています。
フロントエンドは、React/Vueの学習前段階として、REST APIの挙動を素直に追える 静的HTML + 素のJavaScript（Fetch API） にしました。
なお、今回は学習量が過剰にならないよう CD（自動デプロイ）やAWSは扱いません。
学習ロードマップ & 使用した教材
以下の順番で学習を進めました。
- Git/GitHubの基本的な使い方を学ぶ
- DevOpsの全体像を理解する
- Linuxの基本的な使い方を学ぶ
- WSLのセットアップと使い方を学ぶ
- Web APIについて学ぶ
- Dockerコンテナについて学ぶ
- ここで一旦REST APIを開発してみる
- テストコードの書き方を学ぶ
- GitHub Actions（CI）の書き方を学ぶ
- OpenAPI（Swagger）を利用したスキーマ駆動開発のハンズオン
- アプリを一本完成させる
なお、本記事は Javaの基礎 / Spring Bootの基礎 / HTML・CSS・JavaScriptの基礎 を学習済みであることを前提にしています。
未学習の場合は、先に「Spring Bootで簡単なCRUDを作る」「JavaScriptでfetchを叩く」あたりまで終えてから読むとスムーズです。
1. Git/GitHubの基礎を学ぶ
開発業務未経験でしたのでGit、GitHubも勿論未使用でした。
開発業務で使うし、後述するGitHub Actions（CI/CD）でも使うので早めに使い方を覚えておきます。
以降の学習では、ハンズオンも含めてすべてGit管理に乗せ、こまめにコミット・プッシュする運用にしました。
学習ログが残り、後から振り返れるのが大きいです。
使用教材
漫画で説明されており、概念理解、全体像の理解、基本操作の学習のために使用しました。必要なところだけ読んで、後半は飛ばしました。
ある程度勘所がある人なら、書籍じゃなくてYouTubeの動画とかでハンズオン探してもいいかも。
いずれにせよ、とりあえずGitHubを使い始めることができれば以降の個人開発や学習においてはずっとGitHubを使い続けると思うので、基本的なところは自ずと覚えていくと思います。あとは、細かいところは都度検索すればOK。
2. DevOpsの全体像を理解する
さて、まだまだ本題には入りません。
最初に書いた通り、ゴールは作成したCRUD Webアプリをコンテナ化し、GitHub ActionsでCIを回すことです。
それらを学び始めるため、まずはDockerコンテナやCI/CDがなんなのか？それらを使うと何がうれしいのか？などの全体像を理解しておく必要があります。
実際に学習し始めのころ私も、用語は知っていても具体的な内容までは理解していませんでした。
色々調べたり学習していくうちに「コンテナ技術やCI/CDを理解して使えるようになることはマストなんだなあ・・・」と思っていただけです。
なので、私たちは何を学ぼうとしているのか、学んだ先に何があるのか、といった全体像を理解します。
使用教材
DevOpsの概念の理解から始まり、学習を進めるためのロードマップも学べる動画です。
全体通して2時間くらいなので、さらっと見ておくとよいでしょう。
Kubernetesとかも話題として出てきますが、そういうのもあるんだあ、くらいに思ってみてもらえればと思います。
いずれはKubernetesも使えるようになったほうが良いと思いますが、優先度低めで良いかと思います。
実際に私もKubernetesを学び始めるのはまだまだ先の予定です。
とりあえず、DevOpsとは？Dockerとは？CI/CDとは？これにより何がうれしいのか？などに着目して、全体像を俯瞰で理解するとよいと思います。
3. Linuxの基本的な使い方を学ぶ
さて、DevOpsについて何となくわかってきました。
ということでやっとDockerの学習...ではなく、まずはLinuxの基本操作を学びます。
DockerコンテナはUnix系OS（Linux/macOS）上で動作するためです。
全くの未経験ならLinux操作のハンズオンを1本行っておくのがおすすめです。
私はLinuCの資格が欲しかったので、合わせて資格勉強も進めていました。
LinuC101はDockerの基礎知識も範囲に入っているので、ついでにDockerも学べておすすめです。
Macでも基本的なシェル操作はできますが、Dockerやサーバ運用の前提として ファイル操作・権限・プロセス など最低限のLinux的な知識は役に立ちます。
Windowsの場合はWSL2を使うことで、ローカルでLinux環境を用意しやすくなります。
使用教材
講師は「ケンタロウ00」さんです。後述するDockerの講座とかでもお世話になりまくっています。実務を想定した内容を教えてくれる講師なので、個人的にかなりおすすめ。
- 資格学習：LinuC 101（基本操作だけ学ぶなら102は後回しでよいです）
資格学習として問題を解きまくればそれ自体がアクティブリコールとなるので、効率的にコマンド操作を覚えられるます。LinuC 101ならPing-tで問題が無料公開されています。
4. WSL2のセットアップと使い方を学ぶ
※使用PCがMacの場合は飛ばしてください
さて、Linuxを学んだところで次にWSL2をセットアップしておきます。
多分ですが、動画教材によるLinuxのハンズオン学習ではVirtualBoxをインストールし、その中でLinuxの仮想OSを構築したのではないでしょうか。
受講者の環境差異を考慮し、VirtualBoxが使われたはずです。
しかし、WindowsのローカルでもLinux環境は構築できます。
それがWSL2です(細かいところは少し違いがあるみたいです)。
WSLを導入することで以下のメリットがあります。
- Windowsで開発しつつ本番環境に近いLinux環境でテストできる
- VS Codeなどのエディタと連携し、Windows上でLinuxのターミナル（Bash）を直接使える
実際に私も以下のような用途でWSL2を使っています。
- WSL2内のディレクトリへのソースコードの保存
- WSL2内のディレクトリをIntelliJやVS Codeから直接開いてコーディング
- プロジェクトフォルダ内のDockerfileやDocker Composeを使い、コンテナのビルド
なお、VS CodeならWSL2のターミナルを直接操作できます。
なので、VS Codeから直接「docker container run」とか「docker compose up」とかのコマンドを打ってコンテナ起動をしています。
使用教材は特にないです。
インストール手順はネットにいっぱい転がっているので、調べて各自インストールしてください。
インストール後はLinuCの学習ついでに触っていれば色々使い勝手がわかってくるはず。
5. Web APIについて学ぶ
やっとWeb APIについて学びます。
最低でもREST APIさえ学べればよいかと思いますが、実践力を重視し、キャッシュ、認証、ページネーション、OpenAPI（Swagger）も学習していきます。
(ただ、キャッシュ、セキュリティ、ページネーションのあたりは個人的にはふわっとしか理解していません)
使用教材
これも講師は「ケンタロウ00」さんです。Web APIの基礎から始まりOpenAPI（Swagger）まで学びます。
実際にハンズオンでスキーマ駆動開発をするのもグッドポイントです。
ハンズオンの中でDockerも使うので、Dockerの予習としてもいいですね。
6. Dockerコンテナについて学ぶ
続いてDockerコンテナについて学びます。
基本的なコマンドや操作、Dockerfileの書き方、マルチステージビルド、データの永続化、ブリッジネットワーク、Docker Composeを学びます。
Docker Composeまで学ばないと後のCI/CDに繋げることができません。
使用教材
これも講師は「ケンタロウ00」さんです。もはやケンタロウ00さん信者になりつつあります。
上記の内容を一通り網羅していますし、実務を想定したDockerを活用したWebアプリ開発のハンズオンもあります。これがかなりおすすめ。
ハンズオンではCI/CDでビルド&テスト→AWSへのデプロイを行いますので、後に続くCI学習の予習になります。
7. ここで一旦REST APIを開発してみる
ここまでで一気にインプットしてきました。
このままCIまで学習していくのもいいですが、個人的には一旦アウトプットをして頭の中を整理しておいた方がよいと思います。
少なくとも私は、この頃にはもう色々と腹落ちせずによく分からなくなっていることが積み重なっていました。
なので、一回CRUD Webアプリを自力で実装してみます。
具体的には、ローカルでコンテナをビルドし、ブラウザから開けるところまでを行います。
なお、この時点ではREST APIの仕組みと実装方法の理解を重視し、OpenAPI（Swagger）を使わずに手動でAPIを実装しました。
SpringでのAPI実装の流れに自信が無い場合は以下の「使用教材」に記載しているハンズオンを挟むとよいでしょう。
私は以下のハンズオンを挟んでから自力でのREST APIを実装を行いました。
(もちろんわからないところは調べながら)
使用教材
Spring BootにてREST APIを実装するハンズオンです。Spring未学習者にはさっぱりだと思うので、Springの使い方を一通り理解している人向け。
私はREST APIの復習のため、また、実際に一からREST APIを実装するにはどうすればいいかの確認のためにこのハンズオンを挟みました。
最後の方はUnitテストとかの話が出てくるのですが、難しかったですし、さすがに多くを同時にインプットしすぎ＆目的から外れているのでここでは一旦スキップしました。
8. テストコードの書き方を学ぶ
CI を学ぶならテストについても学ぶべきと思ったので、テストコードの書き方を学習します。
CI でテストをしないのではビルド自動化ぐらいしか恩恵がないですもんね。
今回、私はバックエンドにSpring Bootを使っているので、Javaテストについての学習を行いました。
使用教材
かなりわかりやすくテストコードの書き方を学べる講座です。
テストについては、「JUnitの基本構文・アノテーションの使い方」「Mockitoによるモックデータテスト」「DBRiderによるデータベースの自動テスト」などについて学びました。
それだけではなく、テストメソッドの命名ルールについてや、遅いテストがなぜダメなのかといったテスト設計の考え方についてもレクチャーがあります。要は、テストツールの使い方だけではなく、実際の現場でのお作法についても学べます。
また、JDK21を使っていたりIDEはIntelliJを使っていたりなど、内容が色々とモダンです。
つまり講師も最新の情報を高いサイクルでインプットしている現役エンジニアと判断でき、よって、動画教材についても説得力が増します。
動画教材は全体として4時間ほどとそこまで長くないです。
ただ、JUnitについての学習が終わったら既存アプリにJUnitのテストコードを追記する、など、都度アウトプットをするようにしました。
9. GitHub Actions（CI）の書き方を学ぶ
テスト＆ビルドをCIで行えるようにします。
CIは GitHub Actions で行います。
使用教材
この動画のCI部分だけを使用しました。
解説は大変わかりやすかったです。AWS上に開発環境を作る前提で講義が進みますが、私は面倒くさかったので WSL2 + ローカルのVS Codeで開発環境を用意しました。
10. OpenAPI（Swagger）を利用したスキーマ駆動開発のハンズオン
素の状態でREST APIを実装することはできるようになったので、OpenAPI（Swagger）を利用したスキーマ駆動開発もできるようにします。
実際の現場ではOpenAPI（Swagger）を使うことが多々あるからです。
OpenAPI（Swagger）を利用したスキーマ駆動開発については前述した「ゼロから学ぶ Web API 開発：設計・実装・運用の基本」でも学びました。
ただ、正直個人的にはよくわかりませんでした。難しかったです。
なので一旦Springを使ったハンズオンを挟むことにしました。
OpenAPI（Swagger）も完璧にわかります！！！って人はこのハンズオンは飛ばしていいです。
使用教材
アプリを1本完成させる
ここまで来たら、一から考えたアプリを一本作成し、ローカルで再現可能（Compose起動＋CIが通る）な状態まで仕上げます。
使う技術はこれまでに学んできたことすべてです。
すなわち、
OpenAPI（Swagger）でREST APIを設計し、バックエンドにREST APIを実装し、フロントエンド、DBを実装し、それぞれをコンテナ化できるようにDockerfile、Docker Composeの設定ファイルを作成し、テストコードを書き、CIの設定ファイルを作成し、GitHubへプッシュし、CI(テスト・ビルド・Dockerビルド)
を行います。
余談ですが、個人的にはこの後にReactを学ぶ予定です。
なので、ここで作成したアプリのフロントエンドはReactで置き換えする予定です。
その後は認証機能を付け足したり、デザインを直していったり、DB設計を追加・編集していったりなど、どんどんアプリに機能を追加していく予定です。
なので、ここで作成するアプリは適当な学習用ToDoアプリではなく、しっかり育てていく前提のサービスにします。
学んだこと
より実務に近い形でのアプリケーション開発の流れを踏襲することができました。
やっと、やっと視界が開けてきた感じがします。
過去の私(学習し始めの私)へのアドバイス
学習段階でAIに正解のコードを丸ごと聞くのはマジでやめとけ。
学習目的なら、DB設計はすごいシンプルにしておけ。