15
12

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 5 years have passed since last update.

Azure x EC-CUBE + WordPress + SQL Database で最強の EC CMS を構築しよう

Last updated at Posted at 2016-12-14
  • 柔軟な CMS を備えた EC サイトを構築したい
  • スモールスタートで、スケーラビリティに優れた構成にしたい
  • インフラ・ミドルウェアのメンテナンスコストは極力抑えたい
  • 機械学習や AI のサービスも活用したい
  • マイクロサービスも活用したい

といった要望を叶えるべく、やったことの紹介です。

アプリケーション・フレームワークの選定

まず 柔軟な CMS を備えた EC サイトを構築したい ということから、 EC-CUBE2.13.5 と WordPress を選びました。

※ SQL Database の選定については後述します

EC-CUBE の最新版は 4系ですが、 WordPress との親和性と、魔改造の豊富な実績から 2系を選定しています。

WordPress をフロント全面に使用し、商品画面は WordPress のカスタム投稿タイプを使用しており、 WordPress の強力な CMS 機能を活用しています。
カート以降の画面は、 EC-CUBE を使用しますが、 wp-load.php を読み込ませるカスタマイズ を実施し、 EC-CUBE 側にも WordPress テーマを適用できるようにしました。

EC-CUBE2 系は、 URL に *.php がついてしまい、美しくないので、 nikic/FastRoute を使用して、きれいな URL を実現しました。

インフラ・ミドルウェアの構成

  • Azure App Service
    • WebApps
    • ApiApps
  • Azure SQL Database
  • SendGrid

スモールスタートで、スケーラビリティに優れた構成 にするために、 Azure App Service は欠かせません。
特に、EC-CUBE の特殊なカスタマイズ無しで、負荷に合わせて自由にスケールアウト可能な構成(マルチインスタンス)に対応可能なのは Azure WebApps の大きな強みです。
AWS EC2 をはじめとする IaaS でマルチインスタンス構成にするには、EC-CUBEの管理機能が自動生成するファイルを同期するカスタマイズが必要なので...

インフラ・ミドルウェアのメンテナンスコストを極力抑える ために Azure SQL Database を採用しました。
EC-CUBE, WordPress ともに、 MySQL との親和性が高いため、 AWS RDS や ClearDB という選択肢もありました。
しかし、今後、基幹連携なども視野に入れ、 Azure SQL Database にしました。1インスタンス約500円/月〜 という低価格も大きな要因でした。
なお、 EC-CUBE, WordPress ともに、標準では SQL Database に対応していないため、 EC-CUBE では拙作の EC-CUBE SQL Database plugin を使用、 WordPress では ProjectNami というパッケージを使用し、 SQL Database に対応しています。

ちなみに、 ProjectNami で絵文字などの Unicode 文字列を扱うには、 こちらの修正が必要 です。

なお、 セキュリティ確保のために、 EC-CUBE のデータベースと WordPress のデータベースは別インスタンスとしており、 Web API を使用してデータ連携をしています。

EC-CUBE側の API 機能は、 API Apps を使用し、 .NET Core 2.0 にて開発しました。

メール送信関連は、 SendGrid 一択 です。(他に良いサービスを知らない。。。)

開発言語と開発環境

  • PHP7.2
  • SQL Server on Linux for Docker
  • .NET Core 2.0
  • React.JS

EC-CUBE2系が PHP7 に対応していないため、 PHP5.6 を使用しています。
普段は Mac + Emacs で開発しているのですが、 PHP の SQL Server 向けドライバは Mac で動作しないため、 VMWare Fusion 上の Windows10 の Bash on Ubuntu on Windows に X 経由で接続 したり、 Azure Service Editor で開発しています。

EC-CUBE2系を PHP7 に対応し、 Docker コンテナ上の SQL Server on Linux に接続して開発しています。

EC-CUBE と WordPress のデータ連携は、 Web API 経由です。
Azure API Apps と EC-CUBE の SQL Database を直接接続し、 .NET Core 2.0 を使用して C# で開発しました。
.NET Core 2.0 の恩恵は絶大です。
EC-CUBE2系は、データベースのマイグレーション機能が無く、通常は DDL をゴリゴリ書くのですが、 Entity Framework Core のデータベースマイグレーション機能を活用して、開発効率が大幅に向上しました。
特に、 Mac から.NET Core 2.0 経由で SQL Database のマイグレーションが可能 になったのは効果絶大でした。

Mac の SQL Database クライアントは、 DBeaver を使用しています。
以前は Windows の VM 経由で SQL Server Management Studio を使っていたので、ずいぶん便利になりました。

Docker Container の立ち上げと同時に、 sqlpackage コマンドを使用して、テスト用のデータをロードします。

Web API の開発は、 Mac 上の Emacs を使用し、 OmniSharp による強力な IntelliSense で短期間で開発できました。

Web API とフロントエンドの連携は、 React.js を使用しました。
TypeScript + webpack3 + mocha + karma + chai + sinon で CircleCI を使い、継続的インテグレーション環境も構築しています。

今後の展開

当初、クレジット決済まわりだけお手伝いするつもりだったのですが、 Azure をフル活用するいい機会だったこともあり、結局ほとんどやってしまいました。
今後は、 Cognitive Services の Recommendations API なども活用していきます。

今回の案件は、https://kodawarin.jp にて公開中。名古屋大学の女子大生が考案し、起業して開始したサービスです。
宣伝も兼ねてしまい恐縮ですが、応援よろしくお願いします!

15
12
2

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
15
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?