kechigon / PungPals

Offline Mahjong results management application
MIT License
2 stars 0 forks source link

アプリケーション開発とコンテナ化を具体化する #13

Closed kechigon closed 9 months ago

kechigon commented 1 year ago

Why

設計の最終段階、手を動かせるようにする。

What

やることのリスト化

kechigon commented 1 year ago

chatGPT

開発の流れは以下のような感じになるかと思います。
1. まずはローカルマシン上でそれぞれの技術スタック(Nginx, Django, Vue.js)を利用して開発を進めていきます。バージョン管理としてGitなどを利用し、ソースコードを管理してください。
2. DjangoはPythonのWebフレームワークで、APIの開発を担当します。Djangoの開発にはvirtualenvやpipenvといった環境管理ツールを利用して、ライブラリの依存性を管理していきます。
3. Vue.jsはJavaScriptフレームワークで、ユーザーインターフェースの開発を担当します。Vue CLIを利用するとプロジェクトのセットアップや開発サーバーの起動が簡単になります。
4. Nginxは静的ファイルの配信とリバースプロキシとして利用します。Djangoが動作するWSGIサーバーとVue.jsが作成する静的ファイルを適切にルーティングします。
5. 開発が一段落したらDockerを利用してアプリケーションをコンテナ化します。これには`Dockerfile`と`docker-compose.yml`を使います。Nginx, Django, Vue.jsそれぞれの`Dockerfile`を作成し、それらとDBを`docker-compose.yml`でリンクさせます。
6. ネットワーク上でシームレスに機能するかのテストを行い、調整が終わったらDockerHubなどのレジストリにプッシュします。
7. 最後にAWSまたはGCPにデプロイします。AWS ECSまたはGCP Cloud Runでコンテナを運用します。どちらを選ぶかは主に個々の開発チームの習熟度や好みによるところが大きいです。
データベースについては開発環境ではSQLiteを、本番環境ではPostgreSQLやMySQLを利用するのが一般的です。SQLiteはセットアップが不要で、軽量なため開発やテストに便利です。しかし多くのユーザーが同時にアクセスしたり、大量のデータを扱うような本番環境では、パフォーマンスや信頼性の面でPostgreSQLやMySQLのような本格的なRDBMSを使います。本番環境ではAWS RDSやGCP Cloud SQLといったマネージドサービスを利用すると便利です。
Djangoの場合、DBマイグレーションはDjangoが提供するマイグレーションツールを活用します。以下にその流れを記載します。
現行のSQLiteデータをCSVやJSONなど適切な形式でエクスポートします。Djangoの`dumpdata`コマンドはこの用途に利用できます。
python manage.py dumpdata > mydata.json
次に、新しいDB(PostgreSQLやMySQL)にマイグレーションします。初めに、新しいDBの設定をDjangoの`settings.py`ファイル(もしくは関連する設定ファイル)に記述します。
ここでは例としてPostgreSQLを例にします。
DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.postgresql_psycopg2',
        'NAME': 'mydatabase',
        'USER': 'mydatabaseuser',
        'PASSWORD': 'mypassword',
        'HOST': 'mydatabasehost',
        'PORT': '5432',
    }
}
そして、Djangoのマイグレーションコマンドを実行します。これはDBにテーブルを作成します。
python manage.py makemigrations
python manage.py migrate
後は先程エクスポートしたデータを新しいDBにインポートします。
python manage.py loaddata mydata.json
そのアプリケーションがDockerコンテナとして動作していて、それをAWS ECSやGCP Cloud Runにデプロイするのであれば、マイグレーション作業もDockerコンテナ内で行なってください。その際には、新しいDBへの接続設定をDockerの環境変数などを利用して安全に管理してください。
DBマイグレーションは非常にデリケートな作業で、事前にバックアップを取ったり、まずステージング環境で試すといった注意が必要です。
それぞれの技術スタックについて逐一説明していきますが、全体の流れとしては以下のようになります。
1. DjangoとSQLiteでバックエンド開発
2. Vue.jsでフロントエンド開発
3. DjangoとVue.js間のAPI連携
4. Nginxでデプロイ
まずは詳細な各ステップに進む前に、それぞれのパーツが何であるか説明します。
- Django: Pythonを使用したWebアプリケーションフレームワーク
- SQLite: 軽量なデータベースソフトウェア
- Vue.js: JavaScriptフレームワーク
- Nginx: 高性能なWebサーバーソフトウェア
では具体的な手順を説明します。
1. **バックエンドの設計と実装**
まずDjangoで使用するモデル(DBのテーブル)を設計します。次にそれに基づいてDjangoのモデルを作成し、それを用いてデータの取得・保存などを行うビューを作成します。Djangoではこれらは主にPythonで実装されます。
2. **フロントエンドの実装**
次にVue.jsでフロントエンドを実装します。基本的にこれはHTML, CSS, JavaScriptで実装され、Djangoから提供されるAPIを使用して必要なデータを取得・表示します。
3. **APIの設計と実装**
DjangoとVue.jsの間でデータをやり取りするために、APIを設計・実装します。DjangoにはDRF(Django Rest Framework)という強力なライブラリがあり、これを使用するとAPIの設計・実装が容易です。
4. **Nginxの設定とデプロイ**
最後に、Nginxを使用してアプリケーションをデプロイします。Nginxは静的ファイルのHosting、Reverse Proxyとして作用します。それらを設定するために、適切にnginxの設定ファイルを編集します。
一連のフローを完成させると、アウトプットとして完全に機能するWebアプリケーションが出来上がります。各パートの詳細な実装方法や設定はそれぞれの公式ドキュメンテーションやオンラインサイトを参照してください。
kechigon commented 1 year ago