こんにちは。今回は Spring Boot (Java) と Vue.js (JavaScript) を使って、超シンプルな ToDoアプリ を作成します。

目標

最小限の機能だけに縛って、フロントエンドとバックエンドを連携させる経験 をするのが目的です！

実装する機能：

✅ 完了状態切り替えなし
✅ CSSなし (デザインなし)

技術スタック

下記のようなシンプルなUIです（cssは本講座では記述しませんが、vueの初期CSSが適用され、下記のようなデザインになります）。

Spring Boot の準備と REST API の作成
Vue でフロントエンドの画面作成
- Vite で Vue プロジェクトを作成
- タスク一覧表示・追加・削除の UI を作る
- Axios で Spring Boot のAPIと通信
動作確認とまとめ
- curl や Postman でAPI確認
- フロントエンドで実際に動かしてチェック

このシリーズは、全4回で完結します：

次回は Spring Boot 側の開発に入ります。プロジェクト作成から、API の設計までやっていきましょう！

このシリーズで、Web開発の初歩を楽しんでもらえると幸いです。この記事が良かったら、ストックやいいねをしてもらえると嬉しいです！