今パートの目標
前回はReactとAxiosを使用してAPIのHelloControllerに向けてリクエストを送信し、取得した結果を画面に表示する、フロントエンドとバックエンドの通信を行いました。
今回はSpringBootアプリケーションをRenderにデプロイし、本番環境の構築をしていきたいと思います。
環境について
- Next.js 14.2.3
- Typescript 5
- SpringBoot 3.2.0
- java 17
- git 2.43.0
- macOS Sonoma 14.1.1
- Docker Desktop 4.18.0
作業用ブランチを作成する
下記コマンドを実行し、作業用ブランチを作成します。
share-favplace-api % git checkout develop
share-favplace-api % git pull origin develop
share-favplace-api % git checkout -b develop_20240121_render_settings
Render.comとは
様々な Web アプリケーションを簡単に Deploy 可能にする PaaS であり、静的サイトから Web アプリまで幅広いアプリケーションを簡単に運用できるサービスです。
以前はHerokuを利用していましたが無料プランが廃止されてしまったため、無料プランがありかつ勉強用としては十分な機能があるRender.comを使っていきます。
▼参考
Dockerfileを編集する
Render.comにデプロイできるようDockerfileを編集します。
#
# Build stage
#
FROM amazoncorretto:17 AS builder
ARG WORKDIR
ENV HOME=/${WORKDIR} \
LANG=C.UTF-8 \
TZ=Asia/Tokyo \
HOST=0.0.0.0
WORKDIR ${HOME}
COPY ./ ${HOME}
RUN ./gradlew build
#
# Package stage
#
FROM amazoncorretto:17-alpine
ARG WORKDIR
ENV HOME=${WORKDIR} \
LANG=C.UTF-8 \
TZ=Asia/Tokyo \
HOST=0.0.0.0
COPY --from=builder ${HOME}/build/libs/share-favplace-api-0.0.1-SNAPSHOT.jar share-favplace-api.jar
EXPOSE 8080
ENTRYPOINT ["java","-jar","share-favplace-api.jar"]
ここではDockerのマルチステージビルドを使用しています。
開発用にはアプリケーションのビルドに必要な全てが含まれるDockerfileを使用し、プロダクト用にはアプリケーションおよび実行に必要なもののみが含まれるスリム化されたDockerfileを使用するというのを一つのファイルで実現できる機能です。
ビルドステージの指定
ビルド時のコマンドにtargetを指定すると指定したステージのみをビルドすることができます。
$ docker build --target build
docker-composeから指定する場合も同じくtargetを追加します。
api:
build:
context: .
dockerfile: Dockerfile
target: builder
args:
WORKDIR: ${WORKDIR}
container_name: share-favplace-api
env_file:
- ./environment/api-variables.env
tty: true
command: ./gradlew bootRun
volumes:
- .:/${WORKDIR}
ports:
- "${API_PORT}:${API_PORT}"
- "${DEBUG_PORT}:${DEBUG_PORT}"
depends_on:
- db
▼参考
HealthCheckAPIを作成する
Render.comがアプリの監視やゼロダウンタイムのデプロイに使用するためのヘルスチェック用APIを追加します。
- src
└ main
└ java
└ {パッケージ名}
└ controller
└ HealthCheckController.java
package com.pandaman.sharefavplaceapi.controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
@RequestMapping("/api/v1")
public class HealthCheckController {
@GetMapping("/healthcheck")
public String healthcheck() {
return "health check ok";
}
}
ここまで変更できたらgithubにプッシュしておきましょう。
share-favplace-api % git add -A
share-favplace-api % git commit -m "Renderデプロイ用にDockerfileを修正"
share-favplace-api % git push origin develop_20240121_render_settings
Render.comにデプロイする
下記にアクセスし、GitHubのアカウントからRender.comに登録します。
アカウント登録し、ログインできたらデプロイの設定をしていきます。
まず下記画面からWeb Serviceを選択します。
Build and deploy from a Git repositoryを選択し、次へ進みます。
GitHubのデプロイしたいリポジトリを選択します。
アプリケーションの設定をしていきます。
フリープランを選択します。
環境変数に「WORKDIR=app」を追加します。
追加設定をします。
HealthCheckPathは先ほど作成したヘルスチェックのパスを記載します。
上記以外はデフォルトでOKです。
ここまできたら完了です
mainブランチにマージする
GitHubからmainブランチに向けてプルリクエストを作成し、アプリケーションを本番環境にデプロイします。
先ほどの設定でmainブランチを指定したので、mainブランチに変更があるたびRender.comがそれを検知してデプロイを実行してくれます。
GitHubにログインすると先ほどPushしたブランチからプルリクエストを作成するアラートが表示されていると思うので、「Compre&Pull Request」からプルリクエストを作成し、マージします。
develop_20240121_render_settings → develop → mainの順にマージします。
mainブランチまでマージすると画像のようにRender.comのダッシュボードのSTATUSが「Deploying」となりDeployが自動で走っていると思います。
STATUSが「Deployed」になれば成功です。
実際にリクエストを送信して確認してみましょう。
「https://share-favplace-api.onrender.com/api/v1/hello」にアクセスし、「Hello World」が返ってきたら成功です。
ちなみにデプロイしたアプリケーションのURLはサービストップの以下で確認できます。
まとめ
以上でSpringBootアプリケーションをRenderにDeployできました。
DBの接続に関してはまだできていないので後ほどやっていきます。
次回はフロントエンドのReactをRenderにデプロイして本番環境でフロントエンドとバックエンドの通信をやっていきたいと思います。
コメント