昨今、フロントとバックエンドを別々のリポジトリにしてOpenApiでインターフェースを定義して進むプロジェクトが増えてきていると感じていますが、OpenApiとか全然付いていけてないので個人でNuxt.jsとRuby on Railsが別々のコンテナで立ち上がる環境を作ったのでメモしときます📝
👇Githubにリポジトリを公開して使い方とか書いているので、中身がみたいだけの場合はこちらへどうぞ
環境の構成
DBはposgresqlで、あとはRailsとNuxtの環境が別々のコンテナで立ち上がります。
| container name | memo |
|---|---|
| db | posgresql:latest |
| nuxt | Nuxt.js from Node 12.13.1 |
| rails | Rails from Ruby 2.6.5 |
※今後OpenApiのコンテナも追加したい
https://hub.docker.com/r/swaggerapi/swagger-editor/
使い方
実際に環境を立ち上げる手順を記載しておきます。
- リポジトリをクローンします。
$ git clone https://github.com/Madogiwa0124/nuxt_on_rails_on_docker.git
$ cd nuxt_on_rails_on_docker
$ cd repos
$ git clone nuxt-app-repository
$ git clone rails-app-repository
docker-compose.yml内にリポジトリ名に依存した項目(volumes、build args)を修正
nuxt:
build:
context: .
dockerfile: ./docker/nuxt/Dockerfile
args:
- APP_NAME=nuxt-app-name
volumes:
- ./repos/nuxt-app-name:/nuxt-app-name
rails:
build:
context: .
dockerfile: ./docker/rails/Dockerfile
args:
- APP_NAME=rails-app-name
volumes:
- ./repos/rails-app-name:/rails-app-name
docker-compose up -dを実行してコンテナを立ち上げます。
$ docker-compose up -d Name Command State Ports ------------------------------------------------------------------------------------- nuxt_rails_db_1 docker-entrypoint.sh postgres Up 0.0.0.0:32839->5432/tcp nuxt_rails_nuxt_1 docker-entrypoint.sh npm r ... Up 0.0.0.0:8080->3000/tcp nuxt_rails_rails_1 bin/rails s -b 0.0.0.0 -p 3000 Up 0.0.0.0:3000->3000/tcp
無事に立ち上がれば、localhost:3000にアクセスするとRailsが、localhost:8080にアクセスするとNuxt.jsの環境が立ち上がります🙌
おわりに
今回は、Nuxt.jsとRailsの環境が立ち上がるdocker環境を作ってみました。 私はモノリシックで標準的なRailsアプリケーションしかあまり扱ったことがないので、今回作った環境で色々勉強していきたいですね(・・;)
