More than 5 years have passed since last update.

any株式会社

CakePHP3で自作アプリを作ってみた part2 〜herokuでHello World!!まで〜

Last updated at 2018-05-30Posted at 2018-03-04

7回に渡って記載していきます。
CakePHP3で自作アプリを作ってみたシリーズ
今回part2では

CakePHP3のインストール
Heroku初期設定←ごめんなさい早速予定変更しました
config設定
herokuでHello World!!←ここも変更しました

らへんを解説したいと思います。

ブツはこちら公開済み。
https://cocktail-com.herokuapp.com/

データ登録が間に合わなかったので悪しからず。。。
少しづつ登録します。

今までの記事
CakePHP3で自作アプリを作ってみた part1 〜イントロ〜
https://qiita.com/m-hatano/items/61392c33fdbd49376747

CakePHP3のインストール

ローカル環境で使用するもの

macbook pro(macOS Sierra)
Homebrew
MAMP(Apache)
PostgreSQL

macbook pro(macOS Sierra)

銀座のごった返したApple直営店で年末に購入。

Homebrew

macOS用のパッケージマネージャー
macだとほぼ全てがHomebrewを介してインストールできます。

MAMP(Apache)

初期ではApacheとMySQLを使用。
インストーラーからインストール。

参考記事
https://pc-karuma.net/mamp-install-mac/

次に記載するようにMySQLは途中から使わず、Apacheのみに使用。

PostgreSQL

最初HerokuでMySQLを構築していましたが、HerokuでMySQLを使用するためにはCleardbという外部サービスを使用する必要があります。
このCleardbへのクエリがレスポンスが遅かったため、泣く泣くHeroku標準のPostgreSQLへ変更。。。という経緯が　ありました。
（推測ではHerokuからCleardbへの物理的距離の問題でレスポンスが遅かったのかと思っています。誰か知っている人いたら教えていただければありがたいです。）

手順

詳細に記載されている記事はたくさんあるため、ここでは省略。
めっちゃ簡単にまとめるとcomposerをインストールしてCakePHP3のアプリケーションのスケルトンを作成って感じです。

下記、参考記事様。
http://peachcle.com/install-the-cakephp3-to-mamp-environment-in-composer-to-mac
https://qiita.com/YoshikiNakamura/items/bcceaaa3d064a08233c1
https://qiita.com/qwm0/items/7bc4e07c42959374e45f

Heroku初期設定

ここも詳細は参考記事様に任せちゃいます。
いきなりHerokuかよ！と思われるかもしれませんが、早めに形を見ながら進めた方がモチベーションの維持や、いつのまにかアプリが動かなくなってる！とかを防げたりといろいろメリットがありますのでおすすめします。
短いスパンでデプロイしながら進めましょう。

参考記事様。
https://qiita.com/Arashi/items/b2f2e01259238235e187

要点は下記

herokuへのデプロイはローカルからherokuコマンドを発行すると、リモートリポジトリからデプロイをしてくれる形です。自分はgitを使っています。
herokuを使うためにアカウント作成が必要です
ローカル環境からherokuを操作するためにtoolbeltをインストールします。
簡略手順は

CakePHP3のスケルトンを作成している場合はそれをgitへpush

heroku createでheroku上に空のアプリを作成
スケルトンのあるローカルディレクトリでgit push heroku

config設定

HerokuでCakePHP3を動かすために必要な設定をします。
またもや参考記事様に頼ります。

参考記事様。
https://qiita.com/tektoh/items/90f533c7f2a66e4a3fad

要点だけ解説します。

heroku-buildpack-phpの追加
herokuはデプロイ（git push heroku）した際にビルドの処理が走るという特徴があり、ビルドパックという仕組みが支えています。
require-devに記載していますが、herokuのビルドでデフォルトでは-devが含まれて実行されるためrequire-devに記載して問題ないはず。。

* Procfile * Herokuのプラットフォーム上にあるアプリケーションのdynosにより実行されるコマンドが何であるかを宣言するためのファイル。 * ここではwebサーバにapacheを使用するということと、webrootを指定しています。
* herokuのPostgreSQLアドオンを設定する

$ heroku addons:create heroku-postgresql

heroku環境変数（DATABASE_URL）からPostgreSQLの接続先を取得する

$url = parse_url(get('DATABASE_URL'));

urlを app_heroku.phpへ記載
parse_urlで取得すると下記のようにurlを取れます。
- $url['host'] = 接続ホスト名
- substr($url['path'], 1) = 接続データベース名
- $url['user'] = 接続ユーザ名
- $url['pass'] = 接続パスワード

$db = parse_url(env('DATABASE_URL'));

~~~中略~~~

'Datasources' => [
    'default' => [
        'className' => 'Cake\Database\Connection',
        'driver' => 'Cake\Database\Driver\Postgres',
        'persistent' => 'false',
        'host' => $db['host'],
        'port' => '5432',
        'username' => $db['user'],
        'password' => $db['pass'],
        'database' => substr($db['path'], 1),
        'schema' => 'public',
        'prefix' => '',
        'encoding' => 'utf8',
        'timezone' => 'UTC',
        'cacheMetadata' => true,
        'log' => false,
    ],
],

結構はしょりましたがconfig設定は終わり。

HerokuでHello World!!

ここからは実際にプログラムを書いて動かすところをやりたいと思います。

ここら辺からはCakePHP3の公式ドキュメントが参考になります。
日本語対応もしているためかなり便利です。
自分でできるよーって方は公式ドキュメントのチュートリアルと例に沿ってやっていくのが最短で学習できます。
https://book.cakephp.org/3.0/ja/installation.html

CakePHP3はプログラムを自動生成をしてくれる便利なBakeがありますが、今回は手動で作成する方を解説します。
Bakeはまた機会があれば。。。

CakePHP3はMVCモデルのフレームワークになっているため、
ControllerからViewを表示する形が一般的です。

ここではソースディレクトリ配下からの相対パスで表現しています。
CakePHP3は規約を重視するフレームワークなので、規約を覚えさえすればこれだけでコントローラからのパラメータを表示することができます。

コントローラ

Controller/HellosController

namespace App\Controller;

class HellosController extends AppController
{
    public function index()
    {
      $params = 'Hello World!!';
      $this->set(compact('params'));
    }

XXXXsControllerと複数形でコントローラを作成します。
文字列を設定した変数を、変数名と同じ名前でビューで使えるように設定しています。

ビュー

レイアウトを変更

CakePHP3ではレイアウト（共通部分）にテンプレート（個別部分）をバインドして表示します。
スケルトンから作成している場合はTemplate/Layout/default.ctpをLayoutとして使用して表示しています。
下記がCakePHP3でレイアウトを指定している部分です。
フレームワークでデフォルトで指定されています。

namespace Cake\View;

class View implements EventDispatcherInterface
{
~~中略~~
    public $layout = 'default';

レイアウトを変更したい場合は、こいつをAppViewクラスでオーバーライドしてやれば大丈夫です。
ここでは「Template/Layout/_layout.ctp」を指定しています。

View/AppView.php

namespace App\View;

class AppView extends View
{
    public $layout = '_layout';

今回はHelloするだけなのでレイアウトなしでもいいのですが、原理を理解するために変更しちゃいます。

Template/Layout/_layout.ctp

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <?= $this->fetch('content') ?>
</body>
</html>

= $this->fetch('content') ?>

と記載することでテンプレートをここに出力できます。

テンプレートの作成

テンプレートは下記のような感じで。
レイアウトで共通部分を定義しているので、テンプレートではbodyの中身だけを記述すればOKです。

Template/Hellos/index.ctp

<?= $params ?>

お気づきかと思いますが、CakePHP3のViewは「ctp」形式でhtmlを保存します。
コントローラと紐づけるためにディレクトリを「Template/Hellos」に配置することに注意してください。

このようにコントローラとビューを規約に沿って作成すると、
「http://ドメイン/Hellos」でアクセスした時に自動でindexメソッドにルーティングして、_layout.ctpをレイアウトとして、index.ctpを表示くれます。

表示されない場合はファイル名や配置しているディレクトリ名を確認してみてくだささい。

herokuへデプロイしよう！

準備が整ったらherokuでデプロイしちゃおう。
の前にCakePHP3ではビルトインサーバを使用してローカル環境でも簡単に確認できます。

公式ドキュメント参照。
https://book.cakephp.org/3.0/ja/installation.html

ローカルで確認したあとはgitへcommit, pushしてherokuへpush
します。
ここら辺はコマンドの意味を覚えた上で呪文のように覚えましょう。

$ git add -A
$ git commit -m 'Hellow world!!'
$ git push
$ git push heroku master

これでhttp://ドメイン/Hellosでアクセスすると。。。。Hellow world!!になります。

早速予定を変更してお送りしましたが、ここまでで、
次回は

検索機能

について解説していきます！

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up