Skip to content

Instantly share code, notes, and snippets.

@tanakahisateru
Last active November 16, 2016 19:52
Show Gist options
  • Select an option

  • Save tanakahisateru/18a9637c1bbdb7b18ab8fa80d4dbdfcf to your computer and use it in GitHub Desktop.

Select an option

Save tanakahisateru/18a9637c1bbdb7b18ab8fa80d4dbdfcf to your computer and use it in GitHub Desktop.

PhpStorm 勉強資料

基本的なキー操作

推奨プラグイン

  • .ignore / .gitignore 用

  • BashSupport / シェルスクリプト用

  • PHP composer.json support / composer.json に実際にインストールされたバージョンが出る

  • PHP Advanced AutoComplete / date('Y-m-d H:i:s') などが補完できる

  • PHP Annotations / PHPはdocコメントにアノテーションを書くから

  • PHPUnit code coverage / テストカバレッジの視覚化

ハンズオンでやってみよう

IDEでプロジェクトを作成します。できたら、Cmd + , で設定を開き、Language & Frameworks > PHP でインタプリタの選択状況を確認しましょう。

使うライブラリのダウンロード

Alt+F12 でターミナルを開きます。PHP のマイクロフレームワーク Slim を使ってみましょう。 また、開発者は単体テストできるように PHPUnit も入れます。

composer require slim/slim slim/php-view monolog/monolog
composer require --dev phpunit/phpunit

これで、 composer.json と vendor ができているはずです。

composer.json を右クリックし、Init ... で Composer プロジェクトとして初期化します。 こうしておくと、vendor の各パッケージごとに、External Library へ追加されます。クラス検索などで、サードパーティのコードのヒット優先度が下がります。

バージョン管理する

バージョン管理する前に、 .gitignore を作成しておきます。Project ビューでプロジェクトを選んで Cmd+N から .ignore files を辿り、.gitignore を composer テンプレートで作成します。

できた .gitignore に PhpStorm プロジェクト設定ファイル /.idea/ を追加しておきましょう。 プロジェクト設定を共有する手もありますが、ここでは、ソースだけを管理する方針でいきます。

Ctrl+V から Create Git Repository を選びます。git init と同じです。

Cmd+9 からファイルを選んで Cmd+Alt+A でステージします。git add と同じです。このショートカットはプロジェクトツリーからでも行えます。

Cmd+K でコミットダイアログを表示し、コードの初回コミットを行います。git commit と同じです。ただし、コミット前にさまざまなチェックを挟むことができたり、GUIでコミットに含まないファイルを除外したりできます。

プロジェクトのフォルダ構成を行う

src と tests にそれぞれ、クラスとそれに対応するテストを入れることにします。また、web を静的リソースのドキュメントルートにします。

mkdir src tests web

composer.json に autoload パスを追加します。ここで、プラグインのおかげで補完と構文チェックができることを確認してください。

    "autoload": {
        "psr-4": {
            "Acme\\App\\": "./src"
        }
    }

autoload スクリプトに変更が発生するので、ここでいちど composer install を実行してください。

フォルダの右クリックから Mark Directory As で src / tests / web をそれぞれ色付きフォルダとしてマークしてください。

Cmd + , で Directories から、色付けした src と tests の P▼ マークから、ディレクトリに名前空間 Acme\App を設定します。 こうしておくと、IDE によるコード生成時に、ディレクトリのパスとソースの namespace 記述が対応するようになります。

src からの Cmd + N で実装クラス HelloWorld を作ります。

class ... の内側で pubf とタイプし、TAB キーを押します。プレースホルダが現れるので、hello とし TAB。するとカッコの内側のプレースホルダに移動するので $text としまた TAB。 これで、public function hello($text) { となります。中身はひとまず return ""; で終わらせておきましょう。

class HelloWorld
{
    public function hello($text)
    {
        return ""; // まず失敗する実装を書く
    }
}

メソッド定義の上に空行を入れ、/** の直後 ENTER すると、ある程度型を推測してdocコメントが生成されます。 足りない型宣言と説明を書きましょう。最近の PHP はプリミティブ型に型アサーションを付けることができるようになりましたが、表現の柔軟性が足りないこともあります。 いっぽう、docコメントの型宣言は、 @return array|bool や @param string[] $lines といったより便利な表現が可能で、IDEの静的型解析にもかなり有効です。

テスト駆動開発

PHPUnitを快適に使うために、phpunit.xml を設けます。

<phpunit bootstrap="./vendor/autoload.php">
    <testsuites>
        <testsuite>
            <directory>./tests</directory>
        </testsuite>
    </testsuites>
</phpunit>

CLIでコマンドが動くかチェックします。

vendor/bin/phpunit

PhpStorm は phpunit.xml を右クリックして実行することができます。初回実行時に、足りない設定を補うためのダイアログが表示されます。ここで、Use Composer Autoloader を選び、vendor/autoload.php のフルパスを指定します。

うまくいくと、JUnit の GUI のように結果が表示されます。Ctrl+R は、直前の実行の繰り返しショートカットです。コードを編集しては Ctrl+R を繰り返して TDD を回しましょう。

テストケースを実装します。HelloWorld クラスを開き、Cmd+Shift+T を押すと、HelloWorldTest を作るダイアログを表示することができます。パスを tests に書き換えてテストケースを作成します。 ちなみに、PhpStorm 2016.3 では、Mark Directory As でテストフォルダを設定していれば、自動的にそこにテストが作成されるようになります。

HelloWorldTest のクラス内で Cmd+N を押し、コードを生成します。テストメソッドを追加しましょう。

    public function testHello()
    {
        $hw = new HelloWorld();
        $this->assertEquals("Hello World", $hw->hello("World"));
    }

失敗するので、HelloWorld::hello() を正しく実装する必要があります。再度 Cmd+Shift+T で、こんどは対応する実装クラスのほうに移動します。 Ctrl+R でテストを繰り返しつつ、"Hello World" を返すように修正しましょう。Cmd+Shift+T で、テストケースと行き来し、テストと実装が十分かどうかコードレビューします。

テストファースト過激派

こんどは先にテストから書きます。

    public function testBye()
    {
        $hw = new HelloWorld();
        $this->assertEquals("Bye World", $hw->bye("World"));
    }

bye に色が付いていて、メソッドが実装されていないことを示しています。そこで Alt+ENTER すると、HelloWorld クラスに空の bye() の実装コードが生成されます。まずはロジックを書く前にテストを。

複数のテストケースが実行されますが、関係ないテストの実行はひとまず避けて、問題箇所のテストだけを実行しましょう。実行されたテストのうち、特定のテストクラス/テストメソッドを右クリックして、それだけを実行することができます。

もしPHPインタプリタに XDebug がインストールしてあれば、ブレークポイントを置いて、テストケースをステップ実行することができます。ステップ実行デバッグするには、Ctrl+R の代わりに Ctrl+D を使います。

バージョン管理ふたたび

コミットを積めるかどうかの判断基準として、手動でコードインスペクションが役に立ちます。コード品質が低い状態では、コミットダイアログを開くだけ無駄です。 src を右クリックして、Inspect Code... で実装クラスの問題点を列挙させます。(クラスは厳しく、ビューやコンフィグは甘く、などできるようにフォルダ構成を考えるのがオススメです)

納得できたところでコミットしましょう。Cmd+9 からファイルを選択し、変更されたファイルを Cmd+D で差分確認します。もし不要な diff が発生している箇所があれば、>> 記号で前のコードに戻します。 ロジックを変えたときは、自分の変更意図を表す最少の diff でコミットを積むのが良いと思います。

Cmd+K でのコードレビュー後、さらに、プッシュ Cmd+Shift+K 前にもコミットをレビューします。 (練習なので、git init --bare したローカルディレクトリを git remote add origin file:///... して試してみましょう)

通常、コミットの切り方やコメントが気に入らないときの git rebase -i 履歴修正ですが、PhpStorm では diff を確認しつつ行うことができます。 参考 http://www.karakaram.com/intellij-git-rebase-i

Webフロントエンド

Webのエントリスクリプト web/index.php を作成します。

<?php
require __DIR__ . '/../vendor/autoload.php';

$app = new \Slim\App([]);

// TODO configure app

$app->run();

とりあえずCLIで動作を確認しましょう。

php -S 0.0.0.0:8080 -t web
^C

このPHPビルトインサーバーは、実行コンフィグレーションを作成すれば、PhpStorm 内で実行できます。 Edit Configurations... で [+] ボタンから、PHP Builtin Web Server を追加、ポートやドキュメントルートを指定するだけです。

まだどこにアクセスしても 404 ページなので、なにか実装しましょう。

まずは web/css/style.css を追加します。

.hello {
    font-size: 4em;
    margin: 10px 0 0;
}

ビューとなる template/hello.php を追加します。

<?php
/** @var string $message */
?>
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="utf-8">
    <title><?= htmlspecialchars($message) ?></title>
    <link rel="stylesheet" href="/css/style.css">
</head>
<body>
<div class="hello"><?= htmlspecialchars($message) ?></div>
</body>
</html>

div.hello と書いて TAB を押すと、Emmet の展開が効いて、HTMLタグが挿入されることを確認してください。

ここではあまり使いませんが、Live Templates に登録しておくと便利なスニペットがあります。 HTML 入力中に php → TAB で <php $END$ ?> となるパターンです。Emmet で HTML を書くように PHP タグを挿入できます。

このソース中で、/css/style.css にファイル実在チェックがかかっていて、補完でファイル名を書けることに注目しましょう。web を Resourec Root と設定したことで、ドキュメントルートの候補とみなして実ファイルを探してくれます。

また、class="hello" の記述から定義元へジャンプ Cmd+B できること、逆に、CSSのほうから Find Usage Alt+F7 できることも確認してください。状況がこのぐらい単純なら、PHPのクラスと同じことができるということです。(もちろんPHPのシンボルでなら当然できます)

最後に、web/index.php をこのように実装します。(ここではPHPのプログラミングについての議論は割愛します)

<?php
use Acme\App\HelloWorld;
use Slim\App;
use Slim\Http\Request;
use Slim\Http\Response;
use Slim\Views\PhpRenderer;

require __DIR__ . '/../vendor/autoload.php';

$app = new App([
    'helloWorld' => function() {
        return new HelloWorld();
    },
    'view' => function () {
        return new PhpRenderer(__DIR__ . '/../template/');
    }
]);

$app->get('/hello/{text}', function (Request $request, Response $response, array $args) {
    /** @var HelloWorld $helloWorld */
    $helloWorld = $this->helloWorld;  // $this = $app->getContainer() になるらしい

    /** @var PhpRenderer $view */
    $view = $this->view;

    $text = $args['text'];
    if ($request->getParam('capitalize', false) !== false) {
        $text = ucfirst($text);
    }

    return $view->render($response, 'hello.php', [
        'message' => $helloWorld->hello($text),
    ]);
});

$app->run();

ブラウザで http://localhost:8080/hello/world?capitalize にアクセスして、挙動を確認してください。

PhpStorm は WebStorm の機能をすべて内包しているので JavaScript 関連のサポート機能も非常に充実しています。が、それはまた別の機会に。

@tanakahisateru

tanakahisateru commented Nov 16, 2016 •

Copy link
Copy Markdown
Author

ブラウザからの XDebug、ちょっと古いけどこういう感じです http://www.karakaram.com/phpstorm-xdebug

ビルトインサーバーなら、起動時にこう

php -d xdebug.remote_enable=1 -S 0.0.0.0:8080 -t web

あとブックマークレットと受話器のボタンで、なにやら出てきます

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment