#C01 Running Drupal on Mac.

MacにDrupalをインストールして動くよう環境を整備します。

Notice.

この記事は、LightsailでDrupalを公開する前に、ローカル環境でのテストを行なった際に書いています。その後、Lightsailのブループリントで選択し、東京リージョンにインストールしたBitnamiのDrupalがデフォルトで10.3.3となっており、インストール後、アップデートをしたので、このWEBサイトはDrupal10.3.5での公開となっています。※2024年9月30日現在

記事の通り、Macの環境構築はDrupal11.0.4で行なっています。AWSでDrupal11.0.4を動かす予定でしたが、Lightsailのブループリントで用意されるDrupalのインスタンスが、Drupal11.0.4に対応していない為、Drupal10.3.5で公開しており記事内容がわかりにくくなっています旨ご了承ください。

Amazon Lightsailについては別の記事で書いて行きます。

Setting Up a Local Environment.
My Environment
  1. MacBookProM1(2021)モデル
  2. ローカルサーバー(DrupalをMac内で動かすために必要) Orbstack Pro
  3. Local Docker環境 DDEV v1.23.4
  4. PHP8.3.10 , MariaDB10.11.8 , Drupal11.0.4, Bootstrap5 4.03を使っています。
  5. ターミナル iTerm > 使用シェル Mac標準 Shell Zch
  6. パッケージマネージャー > HomeBrew 4.3.22
  7. Composer Version 2.7.9
  8. エディター Vscord 1.93.1
  9. Github Copilot 1.229.0
  10. Japanese Language Pack 1.93
  11. PHP Debag 1.35.0
  12. Remote SSH 0.114.3
  13. SSH: Editing Configuration Files 0.86.0
  14. Remote Explorer 0.4.3
  15. Vim 1.28.1 

となっています。※ 2024/09/16(月) 時点

Drupal 11.0.4とBootstrap5 4.0.3

元々、Drupal10.xのWEBサイトはCivicThemeで構築していましたが、今回Drupal11.xへのアップデートを行い、対応状況を確認したところCivicThemeの11系への対応がまだであり、他のテーマを探したところ、今回使用しているBootstrap5 4.03が対応済みでしたので、Bootstrap5をデザインテーマに採用しています。

1.Running Drupal on Mac.

DrupalがPHPとDBで動くWEBアプリケーションのCMSなので、PHPやDBがMac内で動くように設定が必要です。

WordPressを利用している時に、ローカルサーバーとしてMAMPを使っていましたが、DrupalでDockerコンテナを使いたいので、Dockerコンテナが動く環境を構築する必要があり、Dockerプロバイダー(Mac内にLinuxサーバーを構築するイメージ、WEBサーバーの機能がパッケージ化されています。)はOrbstackを使います。DockerコンテナはDockerデスクトップがメジャーですが、DDEVを使う際Orbstackが推奨されており、動作や安定性にも優れるのでOrbstackを使います。

Orbstack

Orbstackの利点は、インストールが簡単で、ローカル環境ながら起動も動作(WEBページの表示速度など)も早く、標準でSSL機能が使えます。MAMPもSSLは使えるのですが、設定が結構面倒であることがあり、私自身WordPressをローカルで動かす場合は有料版のMAMP Proを使っています。

2.Installing Orbstack.

  OrbstackのWEBサイト

  Orbstackのダウンロードページ ここからZip形式でダウンロードします。他のアプリ同様ダウンロードしたZipを解凍しアプリをアプリフォルダに移動するだけでインストール出来ます。Home Brewでのインストールも出来ますので、非常に簡単に導入出来ます。

  Orbstackのドキュメンテーション インストール後、アイコンをクリックすれば起動します。ドキュメンテーションにもありますが、ターミナルからのコマンドでも起動します。

3.Installing DDEV.

Orbstackのインストールが完了したら、DDEVをインストールします。DDEVはDockerコンテナを手早くMacで使えるようにしてくれます。

  DDEVのWEBサイト

  DDEVのドキュメンテーション

DDEV

DDEVの良さにCMSの簡易インストールが用意されています。Drupalも簡易インストールが用意されており、Composerを使い数ステップでDrupalがMac上にインストールされ直ぐに利用出来ます。

4.Installing Drupal.

DDEVのインストールが完了したら、いよいよDrupalをインストールします。

  Drupal公式サイト

  Drupal Coreのページ

  DDEVのCMS Quickstartsガイド

Installation Procedure.

// フォルダの作成とフォルダへの移動

% mkdir my-drupal-site && cd my-drupal-site

// フォルダにDrupal設定を書き込む--php-version=8.3は※Drupal10.3以降の安定版のPHPバージョンがPHP8.3となっているのでPHP8.3を指定しています。

% ddev config --project-type=drupal --php-version=8.3 --docroot=web

//  Drupalのインストール:recommended-project:^11 はDrupal Core 11以上の安定版をインストールします。

 % ddev start ddev composer create drupal/recommended-project:^11

//  設定ファイルの更新

% ddev config --update

//  Drushの更新

% ddev composer require drush/drush

// Drupal管理画面の初期設定--account-name=adminでログイン名 --account-pass=admin -yでパスワードを設定しています。

% ddev drush site:install --account-name=admin --account-pass=admin -y

// use the one-time link (CTRL/CMD + Click) from the command below to edit your admin account details.

// Drupal管理者ログインのワンタイムログインURLを発行

% ddev drush uli

// Drupalの起動

% ddev launch

// 以上でDrupalのインストールが完了しブラウザから管理画面にログインしDrupalでWEBサイトの構築が出来るようになります。

// インストールが完了し、Drupalが動いたら

% ddev describe

// 設定ファイルが見れます。(ルートにあるcomposer.jsonでも見れます)

5.Additional Notes for DDEV.

DDEVをインストールしたら、nssのインストール,mkcertのインストール,mutagenの設定を行います。

  nss > httpsを使用する為のクライアント及びサーバーのライブラリ

  mkcert > ローカル環境でhttpsのSSL証明書を発行するライブラリ

  mutagen > ディレクトリの高速同期ツール

// mksertやmutagenの設定

// nssのインストール

% brew install nss 

// mkcertのインストール

% mkcert -install

// mutagenの設定

% ddev config global --mutagen-enabled 

私がつまづいたのが、brew installのインストールフォルダがIntel Macの設定になっていました。その為、パスを変更する必要がありますが、Rozettaのエラーで先に進まなくなっていました。過去に、Intel Macを使っていた際の設定が、M1 Macに変更後もそのままになっていたので、良い機会なのでHomeBrewを入れ直し対応しました。

 Installation Directory for Homebrew.

/opt/homebrew/ AppleSiliconのHomeBrewのインストール先

/usr/local/Homebrew Intel MacのHomeBrewのインストール先

6.PHP Version of Drupal core.

Drupal Coreが指定する、PHPのバージョンと、ローカルで有効になっているPHPのバージョンが、合っていないとDrupalのインストールが出来ないので、インストールするDrupal Coreの指定するPHPのバージョンを使用してください。

% php -v ※PHPのバージョンを確認しましょう。

Change the PHP Version at Will.

  Direnv

Drupal11.xはリリースされて日が浅く、テーマによってはDrupal11.xで不具合が出たり、依存性チェックでインストールやアップデートが出来ないものもまだ多数あります、使用テーマにより、Drupal11以前を使うケースも出ると思いますが、Drupal11.xの動作環境がPHP8.3以上なので、Drupal11とPHP8.3以前のPHPを使用する、Drupal10.x以前のプロジェクトを併用して使う場合、Direnvを使うと便利です。

Direnvは、複数のPHPバージョンを作業フォルダー毎に割り当てる事が出来るので、使いたいテーマなどが指定するDrupalCoreのバージョンに合わせて、PHPのバージョンを使い分け、Macのローカルで複数のバージョン違いのプロジェクトを使うことが出来ます。

7.Conclude.

今回、使用中のMacにDrupalが使えるよう設定を行い、実際にDrupalをインストールして動かしています。以下に作業した内容を簡単にまとめます。

  1. ローカルサーバー環境を構築 Orbstackのインストール 
  2. ローカルサーバーでコンテナ環境の構築 DDEVのインストール
  3. Mutagenなどローカルサーバーの環境を整える
  4. Drupalインストール前の環境確認 PHPのバージョンやDBのバージョンなど
  5. 必要な環境を整えるので、関係するソフトを、HomeBrewでアップデートないしインストール
  6. DDEVのCMS簡単インストール機能を使いDrupalをインストール

といった流れでDrupal11.0.4をMacBookにインストールしました。

Drupal Infrastructure Environment.

Drupal11をインストールした理由は、後々AWSを使ってみたい事があります。AWSの環境を調べたところ、LightSailがBitnamiと提携していて、Drupalの環境を用意しています。

Lightsailで使えるリージョンのDrupalのインストール状況を確認したところ、全て最新版となっており、標準で使用出来るDrupalのバージョンが、最新の10.3.5と11.0.4となっていた為、後のAWSを使用するなら最新版の11系を使う方が良いと考え、今回最新のDrupal11.0.4を選びました。

AWSをどう使うかは、検討中ですが、EC2とRDSを組みあせて使用する、最もAWS的な使い方では、私の環境にはかなりオーバースペックとなりコストも割高になってしまうので、LightSailでの運用を候補としています。

Notice.

この記事は、LightsailでDrupalを公開する前に、ローカル環境でのテストを行なった際に書いています。その後Lightsailを選択し、東京リージョンでインストールしたBitnamiのDrupalが、デフォルトで10.3.3となっており、インストール後、アップデートをしたのでこのWEBサイトはDrupal10.3.5での公開となっています。※2024年9月30日現在

記事の通り、Macの環境構築はDrupal11.0.4で行なっています。AWSで、Drupal11.0.4を動かす予定でしたが、Lightsailの東京リージョンがDrupal11.0.4に対応していない為、Drupal10.3.5で公開しており記事内容がわかりにくくなっています旨ご了承ください。

Amazon Lightsailについては別の記事で書いて行きます。

次項は、Drupal11系で使用出来るThemeを選定し、実際に使用して行きます。

Next article.
Drupal Themes.

Drupalの標準テーマであるOliveroも良くできたテーマですが、もう少し自由度の高いBootstrap5が11.x系で問題なく使えますのでBootstrap5のインストールと設定を行います。

投稿日
2024-10-01
投稿者
S.Takeda
タグ
記事内容
Related articles.

DrupalやWebサイト構築の関連記事になります。宜しければご覧ください。

#C05 AWS registration and IAM.

AWSの登録後IAMで、実際にAWSを使用する権限を持つ別アカウントを作成します。

AWS Articles.
#C24 Short break

DrupalでWebサイトを構築するために理解する概念と称して各機能についての記事を書いて来ましたが、なかなか難しく少し行き詰まっているので小休止と題して、今のサイトの状況についてまとめてみます。

Drupal Articles.
#C15 Content and Structure.

Drupalはページ作成するコンテンツメニューと、サイト構築メニューでサイト構成を目的とする形に設定しないとデフォルトで用意されるページ構成から抜け出せず自由にページを構成する事が出来ません。この事についてまとめています。

Drupal Articles.
Side Bar 01

Word Pressで制作したLife StyleのBlogをDrupalに移植し、Drupalの記事を含めて更新中です。

Drupal初学者のBlogです。

DrupalやWEBサイト構築についての記事をまとめています。

  全ての記事

  Drupalに関わること

  WEBサイト構築

  Macの環境

  AWSに関わる事

古着やファッションについての記事をまとめています。

  全ての記事

  古着について

  Fashionについて

  時計について

  写真について

  お勧めのお店

Core Drupal 10.4.0

Theme Bootstrap5 4.0.3

  Drupal

  bootstrap5

  Bootstrap

  Font Awesome

  Amazon Web Service

  Amazon Lightsail

  Bitnami

  Google reCAPTCHA