20191024のlaravelに関する記事は6件です。

Laravelで、view('target.view', ['id' => $id, 'name' => $name]) を少しでもスマートに書きたい

はじめに

皆さんはLaravelライフをエンジョイしてますか?
私は職場でのLaravel歴が長いことから、公式ドキュメントに書いていないような方法で実装を勧めていることが多いです。
Laravel初心者の方には理解に苦しむようなコードを書くことも多く、普段からチームメンバの力量に合わせて適材適所で力を発揮しています。(キリッ)

さて、今回はLaravelでビューにパラメータを渡す際の小技を、初心者の方や使い慣れてきた方向けに紹介していきたいと思います。

公式ページに記載されているビューへのパラメータの渡し方

例1
// ビューへ渡すパラメータを事前に連想配列として準備し…
$user = \App\User::first();
$data['user'] = $user;

// ビューを指定する際に引数として渡す
return view('hello', $data);
例2
// ビューへ渡すパラメータを事前に準備し…
$user = \App\User::first();

// ビューを指定する際に連想配列として渡す
return view('hello', ['user' => $user]);

どうです?イケてますか?連想配列をわざわざ作るコードを書くのは辛いと思いますが…。
私の身の回りの開発者の中でも、特にPHP初心者の方はこの書き方で書いていることが多いです。
上記の例では$userのみのため、まだましな方だと思います。

でも過去には、以下のようなコードを書いていた人もチームメンバに遭遇したことがあります。

カオスコード1
$data['a'] = $a;
$data['b'] = $b;
$data['c'] = $c;
$data['d'] = $d;
$data['e'] = $e;

return view('hello', $data);
カオスコード2
return view('hello', [
    'a' => $a,
    'b' => $b,
    'c' => $c,
    'd' => $d,
    'e' => $e,
]);

いやだ!!、こんな書き方はしたくない!
そもそも変数名と同じキーを指定する連想配列を定義するなんてイケてない!

連想配列をわざわざ作るコードなんて書きたくない場合

compact関数を使うパターン
// ビューへ渡すパラメータを事前に準備し…
$user = \App\User::first();

// ビューのパラメータを指定するタイミングに一気に連想配列を作成する
return view('hello', compact('user'))

私の場合は上記のようにPHP標準のcompact関数を利用し、見るからにイケてないコードを意図的に排除しています。
このように書くことで少しはスッキリ感じないでしょうか?
それによりカオスコードが少しは許容できるような見た目になります。

許容できるようになったカオスコード2
return view('hello', compact('a','b','c','d','e'));

またビューのパラメータは連想配列で渡すことになってますが、実はオブジェクトを渡す方法もあります。
この方法については後日新しい記事として取り扱う予定です。

以上

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

Laravel5.7でbootstrap4基礎メモ

はじめに

練習の為にメモアプリを作った。
bootstrapについて書いていく。
Laravelはあまり関係ないかも。

bootstrap

準備としてbladeファイルを作りスターターテンプレートを貼り付けて使い始めた。
参考先:https://getbootstrap.jp/docs/4.3/getting-started/introduction/

memo.blade.php
<!doctype html>
<html lang="ja">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
  </body>
</html>

bodyタグ内に書いていく。
bootstrapでできることはたくさんあるが今回は実際に使ったものをまとめていく。
参考先:https://webst8.com/blog/css-bootstrap4-howto/

グリッドシステム

bootstrapはグリッドシステムを使って簡単にレイアウトを作れる。
参考先:http://websae.net/twitter-bootstrap-grid-system-21060224/

サンプル
<div class="container">
  <div class="row text-white">
    <div class="col-md-5 bg-primary">1行目 col-md-5 primary</div>
    <div class="col-md-4 bg-secondary">1行目 col-md-4 secondary</div>
    <div class="col-md-3 bg-success">1行目 col-md-3 success</div>
  </div>
  <div class="row text-white">
    <div class="col-md-3 bg-danger">2行目 col-md-3 danger</div>
    <div class="col-md-4 bg-warning text-dark">2行目 col-md-4 warning</div>
    <div class="col-md-5 bg-info">2行目 col-md-5 info</div>
  </div>
  <div class="row">
    <div class="col-md-4 bg-light">3行目 col-md-4 light</div>
    <div class="col-md-4 bg-dark text-white">3行目 col-md-4 dark</div>
    <div class="col-md-4 bg-white">3行目 col-md-4 white</div>
  </div>
</div>

今回はcolにmdを指定しているので画面幅が768px以上のときは指定した幅で分割される。
スクリーンショット 2019-10-23 15.56.15.png

768pxより小さくなると縦に並ぶ。
スクリーンショット 2019-10-24 10.41.04.png

colを複数指定することで画面幅によってレイアウトが変わる、レスポンシブなデザインになる。

グリッドシステムはcontainerクラス>rowクラス>colクラスという形でできる。
rowクラスの直下にはcolクラス以外の要素を置かないほうがいい。
クラスを使ってレイアウトやデザインを簡単に変えられる。

ナビゲーションバー

ヘッダーとかフッターとかに。
http://www.tohoho-web.com/bootstrap/navbar.html

memo.blade.php
<nav class="navbar navbar-expand-md navbar-dark bg-primary">
  <button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#header" aria-controls="header" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="header">
      <ul class="navbar-nav mr-auto">
        <li class="nav-item"><a class="nav-link" onclick=""><h1>+</h1></a></li>
      </ul>

      <ul class="navbar-nav">
        <li class="nav-item"><a class="nav-link" href="#">ログアウト</a></li>
      </ul>
  </div>
</nav>

<h1>メモ</h1>

<nav class="navbar navbar-expand-md  navbar-light bg-light">
  <button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#footer" aria-controls="footer" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="footer">
    <ul class="navbar-nav">
      <li class="nav-item"><a class="nav-link" href="#">Menu1</a></li>
      <li class="nav-item"><a class="nav-link" href="#">Menu2</a></li>
      <li class="nav-item"><a class="nav-link" href="#">Menu3</a></li>
      <li class="nav-item"><a class="nav-link" href="#">Menu4</a></li>
      <li class="nav-item"><a class="nav-link" href="#">Menu5</a></li>
    </ul>
  </div>
</nav>

ヘッダーやフッター。
スクリーンショット 2019-10-24 12.07.20.png

navタグのnavbar-expand-mdのmdでレスポンシブしてる。この場合は画面幅がmdより小さくなると三本線のメニューになる。
スクリーンショット 2019-10-24 12.11.56.png
スクリーンショット 2019-10-24 12.12.19.png

.sticky-top.fixed-bottomを追加することで画面上部や下部に固定できる。

サイドバー

サイドバーはクラス名1つで実装、とはならないよう。
参考先:https://cccabinet.jpn.org/bootstrap4/sample/dashboard
こちらのHTMLとCSSを参考に見よう見まね。

どれがどうなっているのかよく分からなかったのでコードはなし。

モーダルウィンドウ

ふわっと出てくるウィンドウ。

memo.blade.php
<!-- ボタン -->
<button class="btn btn-primary" data-toggle="modal" data-target="#invite">モーダルが出るボタン</button>
<!-- モーダル -->
<div class="modal fade" id="invite">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h3>招待</h3>
        <button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
      </div>
      <div class="modal-body">
        <form>
          @csrf
          送信先:<input type='text' autofocus>
        </form>
      </div>
      <div class="modal-footer">
        <button class='btn btn-primary' data-dismiss="modal" onclick=''>ok</button>
      </div>
    </div>
  </div>
</div>

modal-dialog-centeredで画面真ん中に出てくるようにしている。基本は画面上部。

スクリーンショット 2019-10-24 16.53.52.png

モーダルに値を送りたいときはスクリプトを経由する。
参考先:https://qiita.com/sofpyon/items/1e72426598eed745f031

その他メモ

使ったクラス色々。

h-100 h-75 h-50 h-25 heightを%で。
w-100 w-75 w-50 w25 widthを%で。
p-0 p-1 p-2 p-3 p-4 p-5 paddingを簡単に。
pr-0 pt-0 pb-0 pl-0 padding-right、top、bottom、leftを簡単に。
m-0 m-1 m-2 m-3 m-4 m-5 marginを簡単に。
mr-0 mt-0 mb-0 ml-0 margin-right、top、bottom、leftを簡単に。
order-md-2 order-md-1 横並びと縦並びで順番を変えたいとき。
form-control なんかフォーム関連、綺麗にできる。よく覚えていない。
text-right text-left テキストを右寄せ左寄せ。

おわり

レイアウトにたくさんうんうん悩んだけど書き出してみたら多くは使ってなかった感。

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

【メモ】Laravel のルーティングのまとめ方

Laravel5.8ですが、ほかのバージョンでも問題ないと思います。

viewフォルダ

SC000004.JPG

ルーティング

これをまずまとめずにルーティングすると、一般的にこのようになるではないでしょうか。
なお、私はルート名(->nameの部分)については、viewと合わせているので今回もそのように記述しています。

web.php
Route::get('/main/list','MainController@list')->name('main.list');
Route::get('/main/edit','MainController@edit')->name('main.edit');
Route::get('/main/search','MainController@search')->name('main.search');

これを、/main部分が共通なので,Route::prefixを使いまとめることができます。

prefixメソッドはグループ内の各ルートに対して、指定されたURIのプレフィックスを指定するために使用します。

web.php
Route::prefix('main')->group(function () {
    Route::get('list','MainController@list')->name('main.list');
    Route::get('edit','MainController@edit')->name('main.edit');
    Route::get('search','MainController@search')->name('main.search');
});

これとは別にルート名でまとめると下記のようになります

web.php
Route::name('main.')->group(function () {
    Route::get('/main/list','MainController@list')->name('list');
    Route::get('/main/edit','MainController@edit')->name('edit');
    Route::get('/main/search','MainController@search')->name('search');
});

ただ、URIでもまとめたくて、ルート名についてもまとめたい時や、ここにmiddlewareが加わってそれでもまとめたい時があります。

その場合 Route::groupが使えます。

ルートグループは多くのルートで共通なミドルウェアや名前空間のようなルート属性をルートごとに定義するのではなく、一括して適用するための手法です。Route::groupメソッドの最初の引数には、共通の属性を配列で指定します。

下記のように、一つずつでも、複数でも使えるので、共通でまとめられる様なら積極的に使いたいところです。

web.php
//複数(URI、ルート名)でのグループ化
Route::group(['prefix' => 'main', 'as' => 'main.'], function () {
    Route::get('list','MainController@list')->name('list');
    Route::get('edit','MainController@edit')->name('edit');
    Route::get('search','MainController@search')->name('search');
});

//URIでのグループ化
Route::group(['prefix' => 'main'], function () {
    Route::get('list','MainController@list')->name('main.list');
    Route::get('edit','MainController@edit')->name('main.edit');
    Route::get('search','MainController@search')->name('main.search');
});

//ルート名でのグループ化
Route::group(['as' => 'main.'], function () {
    Route::get('/main/list','MainController@list')->name('list');
    Route::get('/main/edit','MainController@edit')->name('edit');
    Route::get('/main/search','MainController@search')->name('search');
});

//ミドルウェアでのグループ化
Route::group(['middleware' => ['auth']], function () {
    Route::get('/main/list','MainController@list')->name('main.list');
    Route::get('/main/edit','MainController@edit')->name('main.edit');
    Route::get('/main/search','MainController@main')->name('main.search');
});

間違いや、より良い方法がありましたらご指摘宜しくお願いします。

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

hasManyThroughを使わずに、〜経由で多数へ紐づくモデルをCollectionで取得

タイトルが微妙。。。

ひと言でどう表現したものか分からず、伝わりにくいかと思いますが。
忘備録としておいておきます。

やりたいこと

companyのidをもとにpassengersをcollectionで取得したい。
航空会社(company)は多数のフライト(flights)を持ち、各フライトは多数の乗客(passengers)をもつ。

companies
    id - integer
    name - string

flights
    id - integer
    company_id - integer
    destination - string

passengers
    id - integer
    flight_id - integer
    name - string

hasManyThrough使うといいんですが、今回は使わずにやりたい。
モデル同士はhasManyとbelongsToで定義されているものとします。

PassengerController.php
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
use App\Models\Company;

class PassengerController extends Controller
{
    public function getPasserngers($id)
    {
        $company = Company::find($id);
        // $companyに関連するflightsを取得
        $flights = Flight::where('company_id', $company->id)->get();
        // コレクションのインスタンスをつくる
        $passengers = new Collection;
        // foreachで回しながら、各flightに紐づくpassengersをcollectionで取得
        foreach ($flights as $flight) {
            $data = $flight->passengers;
            $passengers = collect($passengers)->merge($data);
        }
        // ついでにソートしておく
        $passengers = $passengers->sortByDesc('created_at');
        dd($passengers);  // collectionで取得できる
    }

ちなみに。

ちなみにhasManyThrough使うとすればこういう書き方かと思います。かんたん。。。

https://readouble.com/laravel/5.8/ja/eloquent-relationships.html#has-many-through

Company.php
<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Company extends Model
{
    /**
     * ある会社の全乗客を取得
     */
    public function passengers()
    {
        //第一引数=最終的にアクセスするモデル、第二引数=仲介するモデル
        return $this->hasManyThrough('App\Passenger', 'App\Flight');
    }
}

PassengerController.php
<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
use App\Company;

class PassengerController extends Controller
{
    public function getPassengers($id)
    {
        $company = Company::find($id);
        $passengers = $company->passengers;
        // companyにひもづく全てのpassengersがcollectionで取得できる
        dd($passengers);
    }

}
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

【Laravel】プロジェクトのバージョンを確認する

手順

artisan.php が存在するディレクトリへ移動して、
php artisan -V または php artisan --version を実行する。

実行サンプル: php artisan -V

[UserName: pojects]$ cd laravel_app/
[UserName: laravel_app]$ php artisan -V
Laravel Framework 6.3.0
[UserName: laravel_app]$ 

実行サンプル: php artisan --version

[UserName: pojects]$ cd laravel_app/
[UserName: laravel_app]$ php artisan --version
Laravel Framework 6.3.0
[UserName: laravel_app]$ 
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

表面的なComposerの依存について

目次

  • composerとは?
  • 依存について
  • install・updateについて

composerとは?

PHPのパッケージ管理システムである

できること

  • gitやsvn上のPHPライブラリ(パッケージ)を依存として定義&管理(インストールやバージョン確認)
  • クラス・インターフェイスの自動ロード(オートローディング)

今回メインで説明するのは上の方。

依存について

composer使う理由として、パッケージの依存管理が容易になるというのはかなりあると思うのですが、別にcomposer使わなくてもパッケージ依存管理はできるわけで、、、
使用しない場合と使用する場合でどれだけ違うかというと以下。

composerを使用しない場合とする場合

使用しない場合
composerを使用しない場合、必要なパッケージ(PHPライブラリ)をインストールするために、各パッケージが管理されているリポジトリ(gitやsvn)にアクセスし、zipファイル等をローカルにダウンロードし、それらをローカルで展開し、vender/以下に配置する。
仮に、パッケージが他のパッケージに依存している場合、依存しているパッケージに対しても上と同じことを行う。

使用する場合
composerを使用する場合、必要なパッケージ(PHPライブラリ)をインストールするために、composer.jsonに文法通り(公式日本語記事を参考)の書き方でパッケージ名とバージョンを記載するだけで、上記で行ったことを全てcomposer側がよしなにやってくれる。
仮に、パッケージが他のパッケージに依存していた場合でも、composerが自動で依存解決を行い、自動で必要なパッケージを取得し&vernder/以下に配置してくれる。

まとめ
上で見ても分かるように、composerなしでパッケージをインストールしたり、依存解決を行うのは、莫大な時間がかかり、普段の業務レベルで言うと、ほぼ不可能に近いので、基本的にパッケージ管理を行う際は、composerを使うことになる。
では、実際にcomposerを使ってパッケージを管理するためにはどうすればいいのか??
ここで登場するのがinstall・updateコマンド。

install・updateについて

  • installは、パッケージを取得する。
  • updateは、パッケージのバージョン更新する。

簡単に言えばこんな感じ。
さすがに簡単に言い過ぎたので、ちょっとだけ踏み込んでみると、、、

install

まず、composer.lockの存在チェックを行う。

存在する場合
composer.lockに記載されている、全パッケージを指定通りのバージョンで取得する。

存在しない場合
composer.jsonの「require」に記載されているバージョンのパッケージと依存している(そのパッケージが動くために必要な)パッケージがPackagistというcomposerで取得できるパッケージを管理している中央リポジトリに存在するか見に行き、存在すれば取得、存在しなければcomposer.jsonの「repositories」に登録されているリポジトリを見に行き、取得する。
パッケージ取得後、composer.lockを作成し、取得したパッケージと依存パッケージのバージョン情報を記載して保存する。

update

composer.jsonの「require」に記載のパッケージをPackagist若しくはcomposer.jsonの「repositories」記載のリポジトリに見に行き、最新のバージョンが存在すれば、そのパッケージと依存パッケージを最新のバージョンに更新する。
取得パッケージのバージョンに変更があった場合、変更に合わせてcomposer.lock記載のパッケージのバージョンも変更される。

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む