環境

Windows 10

だーら（Flamers / Memotia）2022/12/14に更新

全体像把握

公式のドキュメント

このスクラップ

本当に自分のデバッグ用のメモとしてまとめるので、外部の人が読むことを全く想定して丁寧に書いてないのでご容赦ください

だーら（Flamers / Memotia）2022/11/08に更新

EB CLIのインストール（1）

EB CLIについて

EB CLI は AWS Elastic Beanstalk のコマンドラインインターフェイスで、ローカルリポジトリからの環境の作成、更新、およびモニタリングを簡素化するインタラクティブなコマンドを提供します。

Prerequisitesのインストール

手順
GitHubで入手できるEB CLIセットアップスクリプトを利用
Prerequisites
- Python入ってないので入れる。
  - Pyenv does not officially support Windows and does not work in Windows outside the Windows Subsystem for Linux. Moreover, even there, the Pythons it installs are not native Windows versions but rather Linux versions running in a virtual machine -- so you won't get Windows-specific functionality.
    If you're in Windows, we recommend using @kirankotari's pyenv-win fork -- which does install native Windows Python versions.
    - Pyenvいれるの面倒くさそう...
    - 普通にPythonのダウンロードページからいれる。
    - Pathにチェックを入れる！（理由を「Pythonのバージョンが出てこない」にまとめた）
- virtualenvも入っていないので入れる
  - pipは既に入っている
  - https://www.python.jp/install/windows/virtualenv.html
  - py -m pip install virtualenv
  - 入った！！

$ virtualenv --version
virtualenv 20.16.6 from C:\Users\NAME\AppData\Local\Programs\Python\Python311\Lib\site-packages\virtualenv\__init__.py

Pythonのバージョンが出てこない

$ python --version
Python

https://happy-tenshoku.com/post-6679/
パスにチェックをつけ忘れてた？
bash再起動したらOK

$ python --version
Python 3.11.0

だーら（Flamers / Memotia）2022/11/08に更新

EB CLIのインストール（2）

2.1: git clone

git clone https://github.com/aws/aws-elastic-beanstalk-cli-setup.git

2.2 install/Upgrade the EB CLI

python ./aws-elastic-beanstalk-cli-setup/scripts/ebcli_installer.py

→ 出力

***********************************
1. Locating virtualenv installation
***********************************

******************************************
2. Creating exclusive virtualenv for EBCLI
******************************************

************************
3. Activating virtualenv
************************

*******************
4. Installing EBCLI
*******************

***********************
5. Creating EB wrappers
***********************

***************
6. Finishing up
***************
Success!


To complete installation, ensure `eb` is in PATH. You can ensure this by executing:


    1. CMD Prompt:

        cmd.exe /c "C:\Users\NAME\.ebcli-virtual-env\executables\path_exporter.bat"

    2. PowerShell:

        & "C:\Users\NAME\.ebcli-virtual-env\executables\path_exporter.vbs"


NOTE: Additionally, you would need to **restart this shell**

だーら（Flamers / Memotia）2022/11/09に更新

ユーザー名に半角が入っているせいでエラーに苦しむ


cmd.exe /c "C:\Users\NAME\.ebcli-virtual-env\executables\path_exporter.bat"

これがどうしてもできない！
おそらく、自分のユーザー名に半角を含むため。

パスをショートパスで置き換えても、一回コマンドは通るのだかが、結局そのあとバッチが回るところで同じエラーが発生する
- ショートパスで置き換えることについて（この記事の下の方）
このバッチファイルを回すのでは埒が明かなそうなので、別のやり方を検討する。

だーら（Flamers / Memotia）2022/11/09に更新

別の方法を検討

Windows で Python、pip、EB CLI をインストールする
記事の手順の通り以下を実行
- pythonのインストール（3.7系のインストールexeから）
- pip --versionもクリア
- pip install awsebcli --upgrade --userを実行
PATHの変更
- %USERPROFILE%\AppData\roaming\Python\Python37\scriptsを追加
- PATHの追加はこれとか参考になるかも
入った！！！！歓喜！！！

$ eb --version
EB CLI 3.20.3 (Python 3.7.9)

ちゃんと調べてないが

最初はPython3.11でやっていたが、%USERPROFILE%\AppData\roaming\Pythonディレクトリができていなかった。この辺りバージョンのずれで色々面倒くさそうだと思ったので、いったんAWSのドキュメントの通り3.7でやり直し。
自分はPythonは明るくないが（大学の研究でちょっと使ったくらい）、3.7ってやたら聞くわりに実は3.11まで出てたのか。3.7って特別な存在感あるバージョンなの？

だーら（Flamers / Memotia）2022/11/09に更新

ECSプラットフォームでのデプロイ

公式doc: 64 ビット版 Amazon Linux 2 上で動作する ECS

ソースコード変更

docker-compose.prod.yml
Dockerrun.aws.json
containers/nginx/Dockerfile（nginx用のDockerfile）
containers/nginx/nginx.conf

本番用のコンテナを立てる

本番用docker-compose

$ docker-compose -f docker-compose.prod.yml build

立った

$ docker images
REPOSITORY            TAG       IMAGE ID       CREATED          SIZE
memoria-prod-server   latest    b393a8aad5f0   8 seconds ago    133MB
memoria-prod-web      latest    0aa651810887   14 seconds ago   1.68GB
memoriaweb-web        latest    2f92b4943737   24 hours ago     1.68GB  // これは開発環境用
mysql                 8.0.28    f2ad9f23df82   6 months ago     521MB

だーら（Flamers / Memotia）2022/11/09

ECRへのプッシュ

順番的に正しいかは分からないが、ローカルでdocker imageがビルドされたのでECRに上げていく。
まずはECRでリポジトリの作成。今回でいうと、memoria-prod-webとmemoria-prod-serverの2つを作成
pushコマンドにならってpushしていく
1つ目のコマンドがまず通らない。awsコマンドが見つからないとのこと

$ aws ecr get-login-password --region ap-northeast-x | docker login --username AWS --password-stdin xxxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com
bash: aws: command not found
Error: Cannot perform an interactive login from a non TTY device

だーら（Flamers / Memotia）2022/11/09に更新

AWS CLIのインストール

参考: 公式doc
Windows 用の AWS CLI MSI インストーラ (64 ビット) をダウンロードして実行（公式ドキュメントの通り）
入った

$ aws --version
aws-cli/2.8.10 Python/3.9.11 Windows/10 exe/AMD64 prompt/off

だーら（Flamers / Memotia）2022/11/10に更新

ECRへのPush（続き）

AWS CLIが入ったので再開

$ aws ecr get-login-password --region ap-northeast-x | docker login --username AWS --password-stdin xxxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com

Unable to locate credentials. You can configure credentials by running "aws configure".
Error: Cannot perform an interactive login from a non TTY device

参考記事
- 自分の環境でやってみると？ => 何も設定されていない。

$ aws configure list
      Name                    Value             Type    Location
      ----                    -----             ----    --------
   profile                <not set>             None    None
access_key                <not set>             None    None
secret_key                <not set>             None    None
    region                <not set>             None    None

設定する
- 公式doc: AWS CLIの設定について
- 新しいIAMユーザーを作成（AWS認証情報タイプはアクセスキー）
- AmazonEC2ContainerRegistryFullAccessとIAMUserChangePasswordをアタッチ
- アクセスキー・シークレットアクセスキーを作成
- aws configureにて設定
再度ログインを試みる。

$ aws ecr get-login-password --region ap-northeast-x | docker login --username AWS --password-stdin xxxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com
Login Succeeded

ECRのpushコマンドに習って続き
ステップ2のビルドは既に済んでいるのでスキップ
イメージにタグをつける

$ docker tag memoria-prod-web:latest xxxxxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com/memoria-prod-web:latest

4のpushコマンド

$ docker push xxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com/memoria-prod-web:latest

できた！

Webの方だけじゃなくてserverの方もやっておく（nginxの方）

だーら（Flamers / Memotia）2022/11/12に更新

Elastic Beanstalkに環境作成

チュートリアル

GUIで作る

環境枠の選択: ウェブサーバー環境
プラットフォーム
- Docker
- ECS running on 64bit Amazon Linux 2
- 3.2.1 (Recommended)
アプリケーションのソースバンドルを作成してアップロード
- assets: clobberとprecompileをする（必要かは分からないが）
環境の作成 => 黒いログ画面が出力されつつ、数分間待機
動かない
フルログを出力
- マウントするvolumeのファイル名が間違っていたので修正
再デプロイ → エラー
- メモリ不足とのこと。インスタンスタイプがt2.microだから説がある。 t3.mediumにあげる → t3.mediumでもだめだったのでt3.largeにする

Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: + error_exit 'Encountered error starting new ECS task: {
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: "failures": [
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: {
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: "reason": "RESOURCE:MEMORY",
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: "arn": "arn:aws:ecs:ap-northeast-x:xxxxxx:container-instance/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"

いろいろと詰まってたのだが、docker-compose.prod.ymlに記載するパス名がDockerfileと会っていなかったことに気づく。
治してデプロイしたら、今までは「動作していません」になっていたところが、「502 Bad Gateway」になった。
別の話だが、Task失敗、REASON: MEMORYは、こちら（Dockerrun.aws.json）で指定しているメモリの量に対して、CPUのメモリが確保できないときに発生する模様

だーら（Flamers / Memotia）2022/11/17に更新

ひたすら格闘

アプリケーションの方のコンテナが立ち上がらない
EC2インスタンスの中に入りコンテナの状況を確認すると、コンテナが終了している

$ sudo docker ps
CONTAINER ID   IMAGE                            COMMAND    CREATED          STATUS                    PORTS     NAMES
e59f6af221b1   amazon/amazon-ecs-agent:latest   "/agent"   16 minutes ago   Up 16 minutes (healthy)             ecs-agent

docker ps -aをすると、大量のExited(127)のコンテナの残骸がある
コンテナのログを確認する

$ sudo docker logs c134
bash: line 1: rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0': No such file or directory

Dockerrun.aws.jsonの書き方が問題？
docker-compose.ymlと同じコマンドを書いてみる

Dockerrun.aws.json

"command": ["bash", "-c", "\"rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'\""],

[ec2-user@ip-xxx ~]$ sudo docker logs 768
bash: line 1: rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0': No such file or directory

pidの方をコマンドから消してみる

Dockerrun.aws.json

"command": ["bash", "-c", "\"bundle exec rails s -p 3000 -b '0.0.0.0'\""],

[ec2-user@ip-xxxx ~]$ sudo docker logs 4e5
bash: line 1: bundle exec rails s -p 3000 -b '0.0.0.0': command not found

この書き方って、bundle exec rails ...をひとまとまりのコマンドだととらえられている感じだな

$ aaaaaa bbb
bash: aaaaaa: command not found

だーら（Flamers / Memotia）2022/11/19に更新

フォルダ構造変える

Dockerfileを書き換え、アプリケーションのルートの位置を変えたらコンテナがすぐ死ななくなった。
もともとは/var/wwwがなく、/MemoriaWebだった

FROM ruby:3.1

RUN mkdir -p /var/www/MemoriaWeb
WORKDIR /var/www/MemoriaWeb

だーら（Flamers / Memotia）2022/12/07に更新

コンテナは死ななくなった

がしかし、ずっとロードしている
AWSに問い合わせた結果、curl -v <上記環境の URL> の結果 を打つように指示される

curl(カール)とは「client for URL」の略で、主にUNIX系OS(MacやLinux)で使用できるコマンドで、URL(http、httpsなどで始まる通信)で表現される通信をコマンドプロンプトでコマンド実行し、データを取得することができます。
普段、何気なくブラウザを利用してURLを打ち込んで画面を表示していますが、curlを利用するとhttp通信のリクエスト、レスポンスの詳細を指定、参照することができます。
またhttpを使用したAPI通信の疎通確認などにもよく使用されます。

結果の抜粋

< HTTP/1.1 301 Moved Permanently

< Server: nginx/1.18.0

方針のアドバイス

お客様の環境のロードバランサー(awseb-AWSEB-XXXXXXX)の設定を確認したところ、HTTPS リスナー(参考資料 [1])が設定されていないものと見受けられます。
この場合、HTTPS のリクエストはターゲット(i-xxxxxxxxxxxxxxx)にルーティングされません。(参考資料 [2])

以上より、当該 URL へのアクセスがタイムアウトする原因としまして、Nginx が HTTPS へリダイレクトするものの、ロードバランサー(awseb-AWSEB-xxxxxxxxxx)が HTTPS リスナーを持っていないためにターゲット(i-xxxxxxxxxxxxxx)と通信ができていないことが考えられます。

上記の場合、ロードバランサー(awseb-AWSEB-xxxxxxxxxxxxx)に HTTPS リスナーを追加していただくことで、ターゲット(i-xxxxxxxxxxxxx)との通信が可能となり、タイムアウトする事象が解決するものと考えられます。
Elastic Beanstalk で HTTPS を使用するには、環境内でロードバランサー用の HTTPS リスナーを設定する必要がございます。
必要な HTTPS リスナー、セキュリティグループの設定方法につきましては、参考資料 [3] をご確認くださいませ。

■その他ご確認いただきたい内容
上記の調査結果をもとに、「HTTPS へリダイレクトする」ことがお客様の期待値通りの動作かご確認いただけますでしょうか。

上記「HTTPS へリダイレクトする」ことを期待されない場合には、お手数をおかけいたしますが、お客様にて Nginx の設定をご確認いただき、リダイレクトされないよう変更していただければと存じます。

ご参考とはなりますが、Elastic Beanstalk を使用しての HTTPS へのリダイレクトに関する設定内容につきましては、参考資料 [4] がご参考になる可能性がございますので、よろしければご確認くださいませ。

合わせて送られてきた参考資料

■参考資料
[1]Application Load Balancer 用の HTTPS リスナー

[2]Application Load Balancer のリスナー

— [2] の抜粋 —
リスナーに対して定義したルールにより、ロードバランサーが登録済みターゲットにリクエストをルーティングする方法が決まります。
———————

[3]Elastic Beanstalk 環境で HTTPS を使用する

— [3] の抜粋 —
AWS Elastic Beanstalk 環境を更新して HTTPS を使用するには、環境内でロードバランサー用の HTTPS リスナーを設定する必要があります。
———————

[4]HTTP から HTTPS へのリダイレクトの設定

だーら（Flamers / Memotia）2022/12/07に更新

HTTPSをリスナーにいれる

HTTPSリスナーを設定するためには、SSL証明書を選択しなければならない
- まずその証明書を用意しなければならない
AWS Certificate ManagerでSSL証明書を作成
- DNSに指定されたCNAMEを追加して更新
- => ちょっと待って完了
デプロイできた！！
CSS等があたっていない
- assets:precompileをしてないからか？
- してデプロイしたが変わらなかった。

だーら（Flamers / Memotia）2022/12/09に更新

データベースの構築

RDSでデータベースを作成する

エラーがでてアクセスできない

ActiveRecord::ConnectionNotEstablished (Can't connect to local MySQL server through socket '/run/mysqld/mysqld.sock' (2)):

database,ymlを更新していないから
https://qiita.com/setsumaru1992/items/6ed0173eba3ff8aa138a

production:
  <<: *default
  database: <%= ENV['RDS_DB_NAME'] %>
  username: <%= ENV['RDS_USERNAME'] %>
  password: <%= ENV['RDS_PASSWORD'] %>
  host: <%= ENV['RDS_HOSTNAME'] %>
  port: <%= ENV['RDS_PORT'] %>

また別のエラー

ActiveRecord::StatementInvalid (Mysql2::Error: Table 'ebdb.users' doesn't exist):

これもDBを作ってないので当たり前

RDSのデータベースを覗く

DATABASE自体はできている
TABLEができていない => migrationの必要性がありそう

MySQL [ebdb]> SELECT DATABASE();
+------------+
| DATABASE() |
+------------+
| ebdb       |
+------------+
1 row in set (0.000 sec)

MySQL [ebdb]> SHOW TABLES;
Empty set (0.001 sec)

migrateを実行 => 500エラー消えた

だーら（Flamers / Memotia）2022/12/09に更新

アプリケーションコードエラー

もはやこれはインフラではなくアプリケーションのレイヤーだが一応書く
ユーザー登録時にメールアドレスの確認を行うためのメールを出すが、そこが上手くいっていない（500エラー）

ActionView::Template::Error (Missing host to link to! Please provide the :host parameter, set default_url_options[:host], or set :only_path to true):

https://qiita.com/jonnyjonnyj1397/items/e31fe746623af74dc5fc

production.rb

  config.action_mailer.default_url_options = { host: 'https://xxxxxxxx.com' }
  config.action_mailer.delivery_method = :smtp
  config.action_mailer.smtp_settings = {
    enable_starttls_auto: true,
    address: "smtp.gmail.com",
    domain: "smtp.gmail.com",
    port: 587,
    authentication: "login",
    user_name: ENV['GMAIL_USER_NAME'],
    password: ENV['GMAIL_PASSWORD']
  }

だーら（Flamers / Memotia）2022/12/09に更新

CSSが当たっていない問題の解決

https://qiita.com/yuiko_akiyoshi/items/263fc49414fb3c7a0162
この記事通りやったら、微妙にあたった

独自で書いたcssが当たっていないっぽい

今の本番環境の画像
開発環境の画像
例えば.footerクラスには、開発環境では以下のように3つのcssが当たっているが、本番環境では何もあたっていない

footer {
    background: #303339;
    padding-top: 80px;
    padding-bottom: 100px;
}

関連するかわからないが、本番環境ではconsoleに以下のエラーがでていた

Failed to load resource: the server responded with a status of 404 ()
Failed to load resource: the server responded with a status of 404 ()

これがcssと関係しているかわからないが、Rails7で新しく導入されたimportmapという概念の模様

application.js

// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
// import "@hotwired/turbo-rails"
import "controllers"
import "./popper"
import "./bootstrap"

だーら（Flamers / Memotia）2022/12/13に更新

ローカルでもcss当たらなくなったぞ？

ローカル環境のdocker imageをビルドしなおした結果、cssが当たらなくなった。
production.rbのこの変更くらいだよな...
一応直して再ビルドしてみる
- もとに戻らない
assets:precompileを一度したら、ローカル環境では治った
ローカルなのに、public/assets下のprecompileされたアセットを使っている。
https://qiita.com/scivola/items/e3e766b3e672a39b7a8f

ローカルのcssの変更を即座に変更してくれるときとしてくれない時がある

変更してくれる時は、変更後にロードがやや長くなって変更される。
- 今回のデプロイ変更をする前のブランチでdocker-compose buildしたとき。
- 今回のブランチに切り替えても、同じimageを使う限り、すぐにcssは反映された
デプロイのための変更によって、修正した何かによって、docker imageの性質が変わっている。
Dockerfileの、ディレクトリの位置変更（ディレクトリ直下ではなく、/var/wwwの下）
- => これだけ変更したとき、cssはすぐ反映されなかった。これのせいかも
docker-compose.ymlの、volumesをマウントするパスのせいかも！ここ/var/wwwにしたのに合わせて変更してないや

    volumes:
      - .:/MemoriaWeb
      修正後↓
      - .:/var/www/MemoriaWeb

治った！！！！！！！
とりあえず、ローカルでcssが当たらなくなる問題は解消された。あとは本番での問題のみ
ローカル環境でも、public/assetsが存在しているとそちらに固定されてしまう。開発するときは削除する必要があるのか。
なお、docker-compose.ymlの起動コマンドは、コメントアウトされている方でもされていない方でもよい

version: "3.9"
services:
  web:
    build: .
    # command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
    command: bundle exec puma -C config/puma.rb

だーら（Flamers / Memotia）2022/12/13に更新

引き続きcss当たらない問題

本番環境で、

rails assets:precompile

をしたところ、cssが全く当たらなくなって画面がかなり崩れた。

新しくcssをアップロードしても、同期されていないのでは？という仮説

だーら（Flamers / Memotia）2022/12/14に更新

できた！

ローカルで普通にassets:precompileをしてデプロイしたら表示されてしまった。
以下の3つのcssは全て同じファイル名（application-xxxxxx.css）を指していた
- ローカルのpublic/assets下のcssファイル名
- 本番のURLでブラウザの検証モードで確認する、読み込まれているcssが記載されているファイル名
- 本番のEC2インスタンスのdocker container内の、public/assets下のcssファイル名

ローカル環境の挙動を色々とチェック

コンテナが動いている状態: ローカル環境で、publin/assetsフォルダを削除
【チェック】ローカルでcssは随時更新されるか？=> 【チェック結果】一度コンテナをkillし、再度docker-compose upをしたとき、都度反映されるようになった（この時点ではまだpublic/assets配下にコンパイルされたファイル群は無し）
コンテナが動いた状態で、再度ローカルで assets:precompile
【チェック】この時点でもローカルのcss変更はすぐ反映される？ => 【チェック結果】すぐ反映された。一度コンテナが作成されたあとは、その後でprecompileをしてpublic以下に作成したとしても同期されない模様。
一度ctrl cでプロセスをストップ。再度docker-compose up（コンテナのIDは変わらない）
【チェック】css変更はすぐ反映されるか？ => 【チェック結果】すぐ反映されなかった。コンテナが立ち上がるタイミングでpublic/assetsが存在していると、その後立ち上げたときにそちらが参照される模様。
コンテナが立ち上がっている状態で、public/assetsを削除する
【チェック】css変更はすぐ反映されるか？ => 【チェック結果】すぐ反映されない。立ち上がったコンテナから消してもだめ。ただし、コンテナの中を覗きに行くと、public/assetsディレクトリは消えている。
コンテナをストップして再度立ち上げる
【チェック】css変更はすぐ反映されるか？ => 【チェック結果】反映される。コンテナが立ち上がるタイミングでpublic/assetsは存在していなかったから。

本番環境へのデプロイの挙動

コンテナが動いた状態で、assets:precompileを実行
- ちなみにさっきも確認したが、この時点ではローカルのcssはすぐ反映される。コンテナ立ち上げ時点でpublic/assetsが存在していなかったから。
新しいpublic/assets下のファイル群とともにzipを作成しデプロイ
【チェック】本番環境で正しくcssが表示されるか確認
- 【チェック結果】先ほどの紺色から、ちゃんと青に変わってる！意図通り
【チェック】上記の通り3つのcssファイル名が同じになるか確認
- 【チェック結果】ローカルのコンパイルされたファイル名、本番のブラウザが読み込むファイル名、本番環境のEC2内のコンテナ内のファイル名が3つとも一致していた。OK！

だーら（Flamers / Memotia）2022/12/14

assets:precompile周りで気を付けなければならないこと

開発環境のコンテナ立ち上げ時点で、public/assetsフォルダは削除しておく
- そうでない場合、開発環境でcss変更がすぐ反映されない
本番環境にpushする直前に、assets:precompileを行い、public/assets下を含めてソースバンドルを作成しデプロイする
デプロイの後、基本的にはassets:clobberをしておく。
- assets:precompileをした時点から一度もコンテナを削除しなければpublic/assetsフォルダがあっても問題ない。
- だが、何かのタイミングでコンテナを立ち上げるときがある（PC再起動など）。その際、public/assetsがある状態でコンテナを立ち上げると、その後cssがすぐ反映されなくなってしまう。
- 「コンテナを立ち上げるときには、public/assetsフォルダが削除されていること」を意識する

だーら（Flamers / Memotia）2022/12/14に更新

本番環境のcss反映されない問題が原因が分からず解決してしまったので調査

なぜ本番でcssが表示されるようになったのか、docker-compose.ymlのvolumeのパスの変更かと思われるのでその確認

実験手順

public/assetsを削除
docker-compose.ymlの記述を、ローカルでのcss反映がなされなかったときの状態に戻す

docker-compose.yml

    # volumes:
    #   - .:/var/www/MemoriaWeb（正しい方）
    volumes:
      - .:/MemoriaWeb（昔の間違ってる方。今回はこれでうまくいかないかどうかを検証したい）

docker-compose upを行う
- 【チェック】cssはすぐ反映されるか =>【チェック結果】すぐ反映されない。これは先ほどの調査の通り。volumeが上手く機能していないことによって、手元の変更がコンテナへ伝えられていない
フッターの色が紺色ではなく、赤色になるようにcssを変更（当然その変更はローカルには反映されない）
docker-compose exec web rails assets:clobber（一応） & precompile
- ここでpublic/assetsフォルダができなくなった。なぜだ？！
ソースバンドルを作成し、デプロイ
- 500エラーがでてしまう...なんだこれは？？
- ログを見たところ、application.cssがないことが原因。これは分かる。なぜならprecompile時点でできていなかったから。それができてない理由が分からないが..（ローカルの問題）

Completed 500 Internal Server Error in 2ms (Allocations: 612)
[325ec288-c945-49bd-920b-e919ce2ba313] ActionView::Template::Error (The asset "application.css" is not present in the asset pipeline.
):
[325ec288-c945-49bd-920b-e919ce2ba313]     11:     <link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
[325ec288-c945-49bd-920b-e919ce2ba313]     12:     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
[325ec288-c945-49bd-920b-e919ce2ba313]     13: 
[325ec288-c945-49bd-920b-e919ce2ba313]     14:     <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
[325ec288-c945-49bd-920b-e919ce2ba313]     15:     <%= javascript_importmap_tags %>
[325ec288-c945-49bd-920b-e919ce2ba313]     16:   </head>
[325ec288-c945-49bd-920b-e919ce2ba313]     17: 
[325ec288-c945-49bd-920b-e919ce2ba313]   
[325ec288-c945-49bd-920b-e919ce2ba313] app/views/layouts/application.html.erb:14

実験は失敗

とりあえずymlのvolumeを元に戻したら問題なくcssは表示された
なぜ、volumeの書き方を変えたら今回はpublic/assets配下に何もファイルが作成されなかったのかということに関して、分かっていない。が、これ以上追う時間を取れなそうなので、いったんスルーする。

だーら（Flamers / Memotia）2022/12/14

残すTODO

jsのインポートでエラーが発生している
eb deployコマンドでデプロイしたイ
DNSを設定して、きれいなURLで表示する

だーら（Flamers / Memotia）2022/12/14に更新

jsのインポートエラーの解消

https://eagerworks.com/blog/import-maps-in-rails-7
こちらの記事を参考に2つのパスを変更した

app/javascript/application.js

// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
// import "@hotwired/turbo-rails"
import "controllers"

// 変更前
import "./popper"
import "./bootstrap"

// 変更後
import "popper"
import "bootstrap"

別のエラーに切り替わった。このエラーはローカルでも出ていたので、改悪として変更を戻す。

Uncaught TypeError: Failed to resolve module specifier "popper". Relative references must start with either "/", "./", or "../".

ローカル環境と本番

ローカル環境と本番環境で、読み込まれるjsのファイル数が異なっている
これはrailsの方で、読み込みの容量を減らすためによしなにやってくれている模様