Drupalを使ってみる

Local環境の構築

私の利用環境ですが

  • MacBookProM1(2021)モデル
  • ローカルサーバー(DrupalをMac内で動かすために必要) Orbstack
  • Local Docker環境 DDEV
  • このWEBサイトはPHP8.3 , Drupal10.31 , MariaDB10.11 , CivicTheme1.8を使っています。
  • ターミナル iTerm , Shell Zch
  • エディター Vscord

となっています。

Drupalが動く環境を作る。

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

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

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

Orbstackのインストール

OrbstackのWEBサイト(Opens in a new tab/window)

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

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

DDEVのインストール

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

DDEVのWEBサイト(Opens in a new tab/window)

DDEVのドキュメンテーション(Opens in a new tab/window)

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

Drupalのインストール

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

Drupal公式サイト(Opens in a new tab/window)

Drupal Coreのページ(Opens in a new tab/window)

DDEVのCMS Quickstartsガイド(Opens in a new tab/window)

注釈 DDEVの補足

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

nss(Opens in a new tab/window) httpsを使用する為のクライアント及びサーバーのライブラリ

mkcert(Opens in a new tab/window) ローカル環境でhttpsのSSL証明書を発行するライブラリ

mutagen(Opens in a new tab/window) ディレクトリの高速同期ツール

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

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

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

DrupalCoreとPHPのバージョン

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

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

Direnvを使い複数のPHPバージョンを作業フォルダー毎に割り当てると、使いたいDrupalのテーマなどが指定するDrupalのバージョンに合わせて、Drupal Coreを使い分け複数のバージョン違いのプロジェクトを使うことが出来ます。ThemeによってはDrupal10で不具合が出るものもあります、あえてDrupal10以前を使う必要があるケースも出ると思いますので、そのような場合にDirenvを使うと便利です。

Themeのインストール

Drupalのインストールが完了したら、テーマを選びましょう。

Drupalの記事

関連するDrupalでWEBサイトを構築する為の環境構築の記事やDrupalについて書いた記事になります。

記事は全てナンバリングしています。Drupalを初めて使う為の準備から始まる最初の記事から読む事もできます。

環境構築

DrupalやCivic Themeの設定やインストール、Local環境の構築やサーバーへのインストールなど環境構築やエラーの対応に関わる記事をまとめています。
  • Drupal記事まとめ
  • 環境構築

Drupal記事

Drupalについて記事を書いています。このWEBサイトを構築していく上でのトピックになります。プログラミングやソースコードなどエンジニア的な記事ではなく、プログラミング経験がない個人がDrupalでパーソナルなWEBサイトを構築するという観点での記事になります。
  • Drupal記事まとめ

最新の記事

Drupalについて書いた最新の記事になります。

#D32 Drupal 10.4.0

Drupal Coreが10.3xから10.4xにアップデートされましたので当サイトも早速アップデートします。
  • Civic Theme
  • Drupalの記事

#D31 Civic Theme Sub Theme

Node.jsのバージョン制限の問題でインストールしていなかったサブテーマをインストールして、サブテーマでの運営に切り替えます。
  • Drupalの記事
  • Civic Theme

#D30 Civic Theme 1.9.0 UpDate

Civic Themeのアップデートの通知が来ていましたので1.8.2から1.9.0にアップデートしました。3月程度のブランクながら1.8x > 1.9xなので様子をみようと考えたのですが、改善点も多いので早速アップデートを行いました。
  • Drupalの記事
  • Civic Theme

#D29 Drupal Core Update

前記事で、10.3.4 > 10.3.5のアップデート行う際にアップデートの内容を確認しました。Gitlabで変更内容のコードを確認する事で、変更内容をより詳しく理解することが可能です。今回10.33 > 10.3.4のアップデートの内容を確認します。
  • Drupalの記事
  • 環境構築

Life Styleの記事

Drupalとは関係ないのですがLife Styleの記事も書いていますのでよろしければ購読ください。

Life Style記事

ライフスタイルの記事になります。Drupalに触れる目的でこのWEBサイトを立ち上げています。元はWord Pressで作成した記事をこちらのWEBサイトに再構築しています。Word Pressも学習目的で利用したのですが記事をしっかり作る事を目的としていたので、テーマに興味があればそれなりに楽しめると思います。
  • Life Style記事まとめ
  • Drupalの記事
  • 環境構築