- backend:
- go: 1.22
- air: 1.51.0
- frontend:
- node:20.12.2
- react: 18
- @reduxjs/toolkit: 1.9
- react-redux: 8
- react-router-dom: 6
- bootstrap: 5
- classnames: 2.3
- typescript: 5
- db:
- mysql: 8.3
$ docker-compose up
- backend:
http://localhost:9000 - frontend:
http://localhost:3000
でWebサーバが起動します。
初期状態で、DBから値を読み出してHello worldを表示する構成となっていますが、初回起動時にはテーブルが存在しないためWebサーバへのアクセスがエラーになります。 起動後に以下のスクリプトを実行してテーブルの作成と初期データの投入を行ってください。
host$ docker-compose exec db sh -c "mysql < /sqlscripts/create.sql"
host$ docker-compose exec db sh -c "mysql training < /sqlscripts/insert.sql"
Reactを開発する人はブラウザの拡張機能をインストールしてください。(任意)
- React Developer Tools
- Redux DevTools
host$ docker-compose exec db mysql training
host$ docker-compose exec backend bash
host$ docker-compose exec frontend bash
ライブラリをインストールする場合はdockerコンテナ側でコマンドを実行してください。
e.g.
host$ docker-compose exec backend bash
backend$ go get -u gorm.io/gorm
host$ docker-compose exec frontend bash
frontend$ npm install something
VS Codeなどで開発する場合、コンテナ側にインストールされたモジュールが参照できないために、エディター上でエラーが表示される場合があります。
その場合はお手数ですが、ホストOS側でもモジュールのインストールをお願いします。
host$ cd frontend
host$ npm install
frontend(nodejs)をDocker外で動かすための設定変更
backend/
internal/ : ソースコード
config/ : 設定類
entities/ : モデル/エンティティ
external/ : 外部環境との接続定義
interfaces/ : インターフェース
middleware/ : ginのmiddleware
repositories/ : リポジトリ - systemに近い部分の実装
usecases/ : ユースケース - ビジネスに近い部分の実装
frontend/
index.html
public/
画像などの静的ファイル
src/
main.tsx: Reactアプリケーションが起動するエントリーポイント
app/
機能横断的に使う機能をまとめる
features/
post/
ドメインごとの機能をまとめる
shared/
components/
再利用可能な小さなUIコンポーネント
services/
共有関数
hooks/
共有React Hook
models/
共有Model
store/
Redux Store関連
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent