Laravel & Markdown記法の勉強及びメモとして書いています。

間違えている点ございましたら、ご指摘いただけますと幸いです。
よろしくお願いいたします。

Laravelでの環境構築

Laravelで開発するときに使う設定メモです。

仮想サーバ(vagrant + homestead)利用 HomesteadのVer一覧から、好きなVer選べます。
IDEはPhpStorm(有料。30日間無料期間あり。)
scss/es6 のコンパイルは、Laravel Elixir

Laravel Homesteadの準備

Laravel homesteadを利用したLaravel 5 ローカル開発環境の構築
を参考にしています。

1.仮想開発環境生成

homesteadのboxを取得

$ cd ~
$ vagrant box add laravel/homestead

Enter yout choice は1を選択。

vagrant、virtualboxをinstallしていない場合は、を参考にinstallしてください。

Homesteadを git cloneし、設定ファイルを記載

$ git clone https://github.com/laravel/homestead.git Homestead
$ cd Homestead/
$ bash init.sh
$ cd ~
$ mkdir Code
$ vi ~/.homestead/Homestead.yaml

Homestead.yamlに以下を記載

---
ip: "192.168.10.10"
memory: 2048
cpus: 1
provider: virtualbox

authorize: ~/.ssh/id_rsa.pub

keys:
    - ~/.ssh/id_rsa

folders:
    - map: ~/Code
      to: /home/vagrant/Code

sites:
    - map: homestead.app
      to: /home/vagrant/Code/Laravel/public
    - map: test.homestead.app
      to: /home/vagrant/Code/test/public

databases:
    - homestead
    - laravel
    - test

sitesに2つmapを書くと、2つのサイトを追加できる。
databasesに書いたテーブルがデフォルトで作成される。
~/.ssh/id_rsaがなければ、gitHubでssh接続する手順~公開鍵・秘密鍵の生成から~を参考に作成。

ホストを追加

$ sudo vi /etc/hosts

hostsに以下を記載

192.168.10.10   homestead.app
192.168.10.10   test.homestead.app

今回は二つサイトを追加しているので、2つ記載。

Vagrantを起動

$ cd ~/Homestead
$ vagrant up

2.git cloneし、Laravelの設定ファイルを作成

$ cd ~/Code
$ git clone git@github.com:*****/***.git Laravel
$ cd Laravel
$ composer install
$ cp .env.example .env
$ php artisan key:generate

composerなかったら、[PHP]Composerを導入＆初めてのパッケージインストールまでを参考にインストール
新規作成の時は、代わりに下記を実行

$ cd ~/Code
$ composer create-project laravel/laravel --prefer-dist Laravel

3.仮想サーバーでDB作成

$ cd ~/Homestead
$ vagrant ssh
//以下仮想サーバ
$ cd Code
$ cd Laravel
$ composer dump-autoload
$ php artisan migrate
$ php artisan db:seed

4.確認

http://homestead.app/
にアクセスできたら、vagrant 起動成功！！

PhpStormセットアップ

下記ページを主に参考にしています。

PhpStormで効率良く開発するための設定その1
PhpStormで効率良く開発するための設定その2

1.xdebugを有効にする

仮想サーバで以下を実施

$ sudo vi /etc/php/7.0/fpm/conf.d/20-xdebug.ini

zend_extension=xdebug.so

xdebug.remote_enable = on
xdebug.remote_connect_back = on
xdebug.idekey = "vagrant"

phpを再起動$ sudo service php7.0-fpm restart

2.PhpStormのdebug機能使用

How to Install Xdebug with PHPStorm and Vagrant
を参考に設定。

3.PhpStormからPHPUnitを実行

Vagrantユーザに朗報！PhpStorm8ではPHPUnitをSSH経由で実行できる
を参考に設定
わからなかったところだけメモ

Develop設定

Connection

ローカルで、
$ cd ~/Homestead $ vagrant ssh-config
と実行すると、出てくる設定情報をConnection画面に記載

HostName:SFTP host
Port:Port
User:User name
Auth type:"key pair"
Private key file:IdentityFile

記載が終わったら、Test SFTP connectionボタンを押して、うまくいくか確認。
AutoDetectボタンも押す。

Mappings

Development path on homesteadに
/Code/Laravel　を記載

PHPUnit を設定する

リモートマシンの PHPUnit の読み込み方法を設定

path to script に
/home/vagrant/Code/Laravel/vendor/autoload.php

default configure fileに
/home/vagrant/Code/Laravel/phpunit.xml
を記載

github設定

Preferences > Version Control > Github
Auth type をTokenにして、
https://github.com/settings/tokens
ここで作成したTokenを記載。
設定したら、下部に 9: Version Control があるので、そこで git add とか commit　とかできる。

基本設定

Editor > General

Use soft wrap in editor チェック

Editor > General > appearance

show line numbers チェック
show whitespaces チェック

Editor > Code style > PHP

set from... から、PSR1/PSR2を選択

フロント開発環境整備

Laravel Elixir

laravel elixirはvagrant上でも使えるんですが、実行時のお知らせが出てこないので、ローカルで使うように設定。

node, npm インストール

nodebrewでnodeとnpmのバージョン管理しよう(Mac編)
を見ながら、nodeとnpmをインストール

node_module インストール

cd ~/Code/Laravel
npm install
sudo npm install gulp -g

gulpfile.js　設定

gulpfile.jsを設定

var elixir = require('laravel-elixir');
var gulp = require('gulp');
var sass = require('gulp-sass');

elixir(function(mix) {
    mix.browserify('app.js')
      .sass('app.scss');
});

この設定をすれば、今後
$ gulp watchで、/resources/assets/sass/app.scss を編集するたびに、コンパイルが行われて、/public/css/app.cssができ、

/resources/assets/js/app.jsを編集するたびに、コンパイルが行われて、/public/js/app.jsが、できる。

ES lint設定

JavaScriptの静的検証ツール
$ sudo npm install eslint -g
これの利用には、.eslintrc ファイルが必要
ESLint 最初の一歩
を参考して、新規作成。
Language & Frameworks > JavaScript > Code Quality Tools > ESlint
で、下記画像みたいに設定する。

Laravel開発補助機能

PhpStormでlaravel5.2を使う
 【Laravel5.2】PhpStormでLaravelを使って快適に開発してみた【備忘録】
を参考

PhpStorm Plugin インストール

Preferences > Plugins > Browse repositories

より Laravel Plugin　をインストールしてPhpStorm再起動。

Composer からインストール

composer.jsonに

"require-dev": {
    ...,
    ...,
    "barryvdh/laravel-ide-helper": "@dev",
    "barryvdh/laravel-debugbar": "^2.1"
}

上記のように、二つ追加して、composer update
その後、config/app.phpに、

'providers' => [
    ...,
    ...,
    Barryvdh\LaravelIdeHelper\IdeHelperServiceProvider::class,
    Barryvdh\Debugbar\ServiceProvider::class,
],

を追加し、php artisan ide-helper:generateを実行。

現在のgitignore設定メモ

/vendor
/node_modules
/public/storage
Homestead.yaml
Homestead.json
.env
/.idea
/_ide_helper.php
*.map

初めてのフレームワーク-Laravel5-6 Laravel開発環境まとめ