4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

EC-CUBE4のローカル環境をDocker Composeで構築してみた (M1対応)

Last updated at Posted at 2022-03-13
ここで紹介するdocker環境ではEC-CUBE4.1.2の環境で動作を確認しました。
その他のバージョンではテストをしていませんので、動いたらラッキー程度にお考えください。

EC-CUBE公式のdockerがいまひとつな件

千葉県某所でWEBエンジニアをしています。

主な業務内容はEC-CUBEのカスタマイズなのですがEC-CUBE4公式のdocker環境の使い勝手が悪い気がしています。

公式はdocker関連のファイルとソースコードが同じ階層に配置されていて、なぜかdocker-compose.yml系のファイルを使用するイメージによって分けていたりと...何かとごちゃごちゃしている気がするのは僕だけでしょうか。(M1macへの対応もされていない。)

仕事では公式のdockerではなくインフラさんが作ってくださったdocker環境を使っているのですが、それがとっても使いやすい!!
インフラさんが作ってくれたようなdocker環境を自力で作りたいと思いやってみました。

実現したいこと

  • docker関連のファイルとソースコードの階層を分ける
  • Apple Silicon 対応
  • phpMyAdminを使えるようにする。

検証端末

 ハードウェア  OS CPU
MacBook Air(Retina, 13-inch, Late 2020) macOS Monterey 12.2.1 Apple M1
MacBook Pro(Retina, 15-inch, Late 2013) macOS Big Sur 11.6.4 Intel Core i7
GPD P2 MAX Ubuntu20.04 Intel Core m3-8100Y

ファイル構成

projectName/
  Dockerfile
  docker-compose.yml
  eccube/EC-CUBE4のソースコード
  entrypoint.sh

docker-compose.yml

※インデントにお気をつけください

docker-compose.yml
version: '3'

services:
  db:
    # image: mysql:5.7
    # image: mariadb:10.3
    # platform: linux/amd64
    container_name: eccube_db
    environment:
      MYSQL_ROOT_PASSWORD: password
      MYSQL_DATABASE: eccubedb
      MYSQL_USER: dbuser
      MYSQL_PASSWORD: secret
    volumes:
      - eccube-db-data:/var/lib/mysql
    ports:
      - 3306:3306

  phpmyadmin:
    container_name: phpmyadmin
    image: phpmyadmin/phpmyadmin
    ports:
      - 8888:80
    environment:
      PMA_HOST: eccube_db
      PMA_USER: dbuser
      PMA_PASSWORD: secret

  app:
    build: .
    container_name: eccube
    volumes:
      - ./eccube:/var/www/html
    ports:
      - 8080:80
    stdin_open: true
    tty: true
    depends_on:
      - db

volumes:
  eccube-db-data:
    driver: local

Dockerfile

FROM php:7.4-apache

RUN set -x
RUN sed -i.bak -e "s%http://deb.debian.org/debian%http://ftp.riken.jp/pub/Linux/debian/debian%g" /etc/apt/sources.list

RUN apt update \
    && apt install -y libzip-dev \
    && apt install -y npm \
    && docker-php-ext-install zip
RUN apt install -y --no-install-recommends \
    sudo \
    git \
    libxml2-dev \
    unzip \
    wget \
    zlib1g-dev \
    iproute2 \
    libsqlite3-dev \
    libpq-dev \
    libicu-dev \
    gnupg2 \
    zlib1g-dev \
    libonig-dev \
    python
RUN curl -sL https://deb.nodesource.com/setup_12.x | bash - \
    && apt update \
    && apt install -y nodejs \
    && apt clean
RUN docker-php-ext-install \
    intl \
    mbstring \
    pdo \
    pdo_sqlite \
    pdo_mysql \
    pdo_pgsql \
    soap \
    xml \
    zip
RUN pecl install xdebug
RUN pecl install apcu
RUN docker-php-ext-enable \
    xdebug \
    apcu \
    opcache \
    && a2enmod rewrite \
    && apt clean \
    && rm -rf /tmp/*

RUN curl -sS https://getcomposer.org/installer \
    |  php -- \
    --filename=composer \
    --install-dir=/usr/local/bin \
    && chown www-data /var/www \
    && chmod g+s /var/www/html

COPY ./entrypoint.sh /entrypoint.sh
RUN chmod +x /entrypoint.sh

ENTRYPOINT ["/entrypoint.sh"]

CMD ["apache2-foreground"]

entrypoint.sh

entrypoint.sh

#!/bin/sh
set -e

# www-dataのUIDを変更する
if [ -n "${HOST_UID}" -a "${HOST_UID}" != "$(id -u www-data)" ]; then
    usermod -u "${HOST_UID}" www-data
fi

if [ -e "composer.json" ]; then
    composer install
fi

if [ -e "package.json" ]; then
    npm install
fi

exec "$@"%

EC-CUBE公式のソースコードをcloneします。

https://github.com/EC-CUBE/ec-cube
※eccubeというディレクトリ名でcloneする点に注意してください。

git clone git@github.com:EC-CUBE/ec-cube.git eccube

DBイメージの選択

次にアーキテクチャ別でDBのイメージを選択します。

docker-compose.ymlのコメントアウトしている箇所を変更していきます。

docker-compose.yml 4~7行目
db:
  # image: mysql:5.7
  # image: mariadb:10.3
  # platform: linux/amd64

x86/x64 (Intel や AMD のCPUの場合)

docker-compose.yml 4~7行目
db:
  image: mysql:5.7
  # image: mariadb:10.3
  # platform: linux/amd64

arm (Apple Silicon 搭載の mac の場合)

docker-compose.yml 4~7行目
db:
  # image: mysql:5.7
  image: mariadb:10.3
  # platform: linux/amd64

or

docker-compose.yml 4~7行目
db:
  image: mysql:5.7
  # image: mariadb:10.3
  platform: linux/amd64

ビルド 〜 インストール 〜 フロントの表示

ビルド

ファイルが揃ったのでビルドします。

HOST_UID=$(id -u) docker-compose up --build

下記のログが確認できたらビルド成功です。

'apache2 -D FOREGROUND'

.envの削除

デフォルトでは .env.dist がそのまま .env にコピーされます。
デフォルトの設定内容がdocker-compose.ymlと異なるため一度 .env 削除してEC-CUBEをインストールし直す必要があります。

localhost:8080にアクセスするとEC-CUBEのインストール画面が表示されます。

インストール画面の設定

STEP1

スクリーンショット 2022-03-13 21.36.38.png

[次へ進む] を押してください。

STEP2

スクリーンショット 2022-03-13 21.37.05.png
アクセス権限が正常であれば [次へ進む] を押してください。

※ubuntuではこの画面が表示されませんでした。
コンテナ内に入り、パーミッションを変更しました。

cd path/to/projectName
docker-compose exec app /bin/bash
chmod -R 777 .

ローカル環境なので全権限を許可しました。

STEP3

スクリーンショット 2022-03-13 21.40.54.png
必須部分のみの入力で問題ありません。
管理画面のディレクトリ名には「admin」以外を設定し、 [次へ進む] を押してください。

STEP4

スクリーンショット 2022-03-13 21.43.56.png

mariaDBを選択した場合でもデータベースの選択はMySQLで問題ありません。

docker-compose.ymlのデータベースの設定情報をもとに入力します。

docker-compose.yml 3,4行目
services:
  db: # データベースのホスト名
docker-compose.yml 8~17行目
    container_name: eccube_db
    environment:
      MYSQL_ROOT_PASSWORD: password
      MYSQL_DATABASE: eccubedb # データベース名
      MYSQL_USER: dbuser # ユーザ名
      MYSQL_PASSWORD: secret # パスワード
    volumes:
      - eccube-db-data:/var/lib/mysql
    ports:
      - 3306:3306 # データベースのポート番号

STEP5

スクリーンショット 2022-03-13 21.59.04.png
[次へ進む] を押します。

STEP6

スクリーンショット 2022-03-13 22.00.34.png

これでインストールが完了です。

URL

フロント画面

phpMyAdmin

所感

dockerの環境構築を通じて、理解が深まりました。

自力で環境構築できるようになっておくだけでも気持ちの持ちようが変わった気がします。

GitHub

今回ご紹介したdocker環境をクローンできます、

参考にしたサイト

4
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?