Qmonus Value Stream Docs

Appearance

チュートリアルで利用するアプリケーションの説明 ​

こちらではチュートリアルでデプロイするアプリケーションの説明をします。 チュートリアルで利用するアプリケーションは以下のリポジトリに格納されており、以後チュートリアルではこちらのリポジトリを利用します。

リポジトリ: https://github.com/qmonus/valuestream-examples

フォルダ構成の説明 ​

アプリケーションはチュートリアルリポジトリのtodo-appのフォルダに格納されています。 フォルダには、API を提供するバックエンドアプリケーションと、バックエンドアプリケーションと連携する TODO アプリケーションであるフロントエンドアプリケーションがそれぞれ格納されています。

jsx
.
├── .valuestream
│   ├── aws  # 本チュートリアルでは利用しません
│   └── kubernetes  # 本チュートリアルでは利用しません
└── todo-app
    ├── backend  # バックエンドアプリケーション
    ├── frontend  # フロントエンドアプリケーション
    └── shared-infra  # 本チュートリアルでは利用しません

バックエンドアプリケーションのフォルダにはバックエンドアプリケーションの実行に必要なソースコード一式と各種パッケージ類、Dockerでバックエンドアプリケーションを動かすためファイル一式が格納されています。

バックエンドアプリケーションフォルダの説明は以下の通りです。

  • Dockerfile: バックエンドアプリケーションのDockerイメージの内容を定義したファイル
  • docker-compose.yml: ローカルで実行するコンテナ設定が書かれています。
  • main.go: バックエンドアプリケーションのメインプログラムファイル
  • /pkg: バックエンドアプリケーションのプログラムファイル
  • scripts: テスト用のスクリプトファイル
jsx
.
└── todo-app
    ├── backend
    │   ├── .valuestream  # 本チュートリアルでは利用しません
    │   ├── Dockerfile  # バックエンドアプリケーションのDockerイメージの内容を定義したファイル
    │   ├── Makefile
    │   ├── docker-compose.yml  # ローカルで実行するためのDocker Composeファイル
    │   ├── go.mod
    │   ├── go.sum
    │   ├── main.go  # バックエンドアプリケーションのメインプログラムファイル
    │   ├── pkg  #  バックエンドアプリケーションのプログラムファイル
    │   │   └── ...
    │   └── scripts  # テスト用のスクリプトファイル
    │       └── ...

フロントエンドアプリケーションのフォルダにはフロントエンドアプリケーションの実行に必要なソースコード一式と各種パッケージ類が格納されています。

  • /src : フロントエンドアプリケーション本体
  • /public : staticファイルとして公開されるフォルダ
jsx
.
└── todo-app
    ├── frontend
    │   ├── .env.development
    │   ├── .env.production 
    │   ├── .valuestream  # 本チュートリアルでは利用しません
    │   ├── Dockerfile
    │   ├── Makefile
    │   ├── README.md
    │   ├── babel.config.js
    │   ├── jsconfig.json
    │   ├── package.json
    │   ├── public  # staticファイルとして公開されるフォルダ
    │   │   └── ...
    │   ├── src  # フロントエンドアプリケーションのプログラムファイル
    │   │   └── ...
    │   ├── vue.config.js
    │   └── yarn.lock

Qmonus Value Streamによるバックエンドアプリケーションのデプロイ時の動作 ​

Qmonus Value Streamがこのリポジトリのバックエンドアプリケーションをデプロイする時、以下の順で処理が実行され、Azure Kubernetes Service(AKS)へバックエンドアプリケーションがデプロイされます。
  1. Qmonus Value Streamは指定したバックエンドアプリケーションのフォルダの中にあるDockerfileを探し出し、Dockerfileを元にDockerイメージを作成します。
  2. Dockerイメージを作成したら、作成したイメージを Azure Container Registry にアップロードします。
  3. アップロードしたイメージをGKEに展開し、バックエンドアプリケーションのコンテナを立ち上げます。

ユーザがオリジナルのバックエンドアプリケーションをQmonus Value Streamを利用してGKEにデプロイしたい時も、チュートリアルと同じようにDockerfileを用意しDockerイメージを作成できるファイル構成にすれば簡単にAKSに自分のアプリケーションをデプロイできます。

Qmonus Value Streamによるフロントエンドアプリケーションのデプロイ時の動作 ​

Qmonus Value Streamがこのリポジトリのアプリケーションをデプロイする時、以下の順で処理が実行され、Azure Static Web Appsへフロントエンドアプリケーションがデプロイされます。

  1. 指定したフロントエンドアプリケーションのフォルダの中でビルドコマンドを実行しアプリケーションをビルドします。
  2. ビルドしたアプリケーションのファイルをAzure Static Web Appsへアップロードします。

ユーザがオリジナルのアプリケーションをQmonus Value Streamを利用してAzure Static Web Appsにデプロイしたいときも、チュートリアルと同じようなファイル構成にしてアプリケーションをビルドできれば簡単にAzure Static Web Appsに自分のフロントエンドアプリケーションをデプロイできます。

ローカルでのテスト実行 ​

このサンプルアプリケーションはDocker Composeを利用して、ローカルでも実行可能です。

ローカルで実行する場合は以下のコマンドでアプリケーションを立ち上げた後にhttp://localhost:8080にアクセスすることでデプロイするアプリケーションの動作を確認できます。

bash
cd todo-app
docker-compose up