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

Nuxt / Laravel(Docker)で作るシンプルなCRUDアプリ

タイトルの通り、フロントはNuxt、バックエンドはLaravelでシンプルなCRUDアプリを制作し、herokuにデプロイしました。それぞれの具体的な解説は別の記事にまとめていきたいと思っています。

制作したアプリケーション

スクリーンショット 2021-01-12 16.19.35.png

NuxtはSSR(ユニバーサル)、API認証にsanctumを使用しています。

機能

  • バリデーション: コメントを投稿したユーザー(本人)のみ編集と削除ができる
  • いいね機能: 自分がいいねしたボタンは色が黄色に変化する。再び押すと取り消される。

課題

  • エラーハンドリング
    • 登録フォームでのエラーメッセージもっと作り込む必要がある。 当初はvee-validate(プラグイン)を導入したが、使い勝手が悪かったため現状はシンプルなメッセージで対応している。
    • 前までは動いていたはずなのに、ケアレスミスでいつの間にか動かなくなっている、という状況が発生。 時間のロスなので、テストの重要性を感じた。 それぞれの機能を疎結合にしてテストしやすくしたい。
  • Nuxt
    • 非同期の理解を深め有効に活用したい。
    • 監視プロパティーを活用し、よりインタラクティブな処理を書きたい。
  • AWSにデプロイしたい。

参考

Dockerデプロイ
- git pushでDocker環境をHerokuにデプロイする
- docker + Laravelアプリをherokuにデプロイする
- 【超入門】20分でLaravel開発環境を爆速構築するDockerハンズオン

Nuxt
- Nuxtを使ってPromise, async/awaitのコードを書く
- JavaScriptで一定時間待ってから処理を開始する方法
- Vue + Vue Router + Vuex + Laravelで写真共有アプリを作ろう (16) エラーハンドリング Part.2

Laravel
- Laravel 粘着質なcacheを削除しよう!

Auth
- Nuxt.jsでAuth Moduleを使ってログイン機能を実装する
- 【Laravel + Vue】 Laravel Sanctum を使ってAPI認証を構築してみる
- nuxt.js + auth使用時のFATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory解消法
- 【Nuxt.js】ログイン前後のリダイレクト処理をミドルウェアで実装する








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

DLしたLaravelの環境構築方法(Linux)

 【前提条件】composerがインストール済み Lamp環境が正常に構築できている。

    githubからDLしたLaravelプロジェクトをとりあえず動かせる
    用にするまでの設定します。 

1、laravelプロジェクトをDLしてみる

ギットハブにアクセスしてとりあえず適当なLaravelのプロジェクトをDLしてみましょう【プロジェクト名testlaravel】
laravel1.png

2、composerをインストールする

DLしたtestlaravelプロジェクトのserveを起動しようとするとこのようなエラーが出てきます。

/var/www/html/testlaravel$ php artisan serve
こんなエラーが出てきます↓
PHP Warning:  require(/var/www/html/testlaravel/vendor/autoload.php): failed to open stream: No such file or directory in /var/www/html/testlaravel/artisan on line 18

Warning: require(/var/www/html/testlaravel/vendor/autoload.php): failed to open stream: No such file or directory in /var/www/html/testlaravel/artisan on line 18
PHP Fatal error:  require(): Failed opening required '/var/www/html/testlaravel/vendor/autoload.php' (include_path='.:/usr/share/php') in /var/www/html/testlaravel/artisan on line 18

Fatal error: require(): Failed opening required '/var/www/html/testlaravel/vendor/autoload.php' (include_path='.:/usr/share/php') in /var/www/html/testlaravel/artisan on line 18

Composerが入っていないためLaravelプロジェクトが起動できないのでcomposerをインストールします

/var/www/html/testlaravel# composer install

3、composerのインストールが完了したら

composerのインストールが完了したら早速testlaravelプロジェクトを立ち上げてみましょう

 /var/www/html/testlaravel# php artisan serve

立ち上がることは立ち上がりますが、ここで必ず500サーバーエラーが発生します。
500serve.png

4、.envファイルとAPP_KEYの設定を行う

ここでエラーが発生する要因としてlaravelに.envファイルが作成されていない
APP_keyが作成されていない事が要因でサーバーエラーが発生しています。

まずは.envファイルを作成してみます。コマンドで以下の用に入力します

cp .env.example .env

この段階ではまだenvファイルは作成されてませんのでAPP_KEYの作成をしてみます

php artisan key:generate

vi .envと入力して無事.envファイルが作成されていれば完成です
↓こんな奴です

APP_NAME=
APP_ENV=
APP_KEY=
APP_DEBUG=
APP_URL=

LOG_CHANNEL=

DB_CONNECTION=
DB_HOST=
DB_PORT=
DB_DATABASE=
DB_USERNAME=
DB_PASSWORD=
(以下略)

改めてtestalaravelプロジェクトを立ち上げてみていつものあのページが出てきたら成功です。
thelaravel.png

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

【Laravel】ローカルにLaravelのプロジェクトを作成しページを表示する方法。

ローカルにLaravelのプロジェクトを作成しページを表示する方法。思ってた以上に手軽だった、、

  1. composerのインストール
  2. laravelのインストール
  3. laravelサーバーの起動
  4. ディレクトリ構造
  5. ルーティングの追加
  6. ビューの作成とルーティングの変更
  7. マイグレーションの作成
    1. マイグレーションファイルの構造
    2. テーブルにカラム追加
  8. DBにテーブルを作成(sqlite3)
  9. テーブルの確認

laravelによるページの表示までなら手順3で完了。3以降は補足。


1. composerのインストール

composerのインストール方法を参照。


2. laravelのインストール

$ composer create-project laravel/laravel [プロジェクト名] --prefer-dist

指定したプロジェクト名でフォルダが作成される。

--prefer-distオプション
高速ダウンロード用。

このオプションをつけると圧縮されていないファイルを優先してダウンロードする。また、すべてのVSC(バージョン管理ソフト)を取得しないので軽量となる。


3. laravelサーバーの起動

php artisan serve

$ php artisan serve
Starting Laravel development server: http://127.0.0.1:8000

表示されたURLにアクセス
http://127.0.0.1:8000

image.png

上記画面が表示され完了。

サーバーの終了はctrl + c


(補足)artisanとは?

アルチザンとは職人の意味。
PHPではサーバーの起動やコントローラーを作成したりなど専門的な処理を実行してくれるため職人を意味するartisanを使っていると想定される。


4. ディレクトリ構造

作成したプロジェクトのディレクトリ構造は以下のようになる。

image.png


5. ルーティングの追加

新たに、usersというパスでページを表示できるようにする。

ルーティングか書かれている routes/web.phpを開く。

image.png

コードの最後に以下を追加。

Route::get('users', function()
{
    return 'Users!';
});

これで、http://127.0.0.1:8000/users
にアクセスすると、Users!というテキストが表示される。

usersというルートが渡されたら、「Users!」を返すという意味。

image.png

(補足)デフォルトのルート

Route::get('/', function () {
    return view('welcome');
});

デフォルトで記載されている上記処理は、ルートパスへの要求がきたら、welcome.blade.phpというファイルを返すという意味。

image.png

拡張子.blade.phpはlaravelにおけるviewファイル。


6. ビューの作成とルーティングの変更

自分でビューファイル(.balde.php)を作成し表示してみる。

.balde.phpファイルの中で別の.balde.phpファイルを呼び出すことも可能。今回は、users.blade.php の中でlayout.blade.phpを呼び出してみる。

ビューファイルは、resources/viewsフォルダ配下に設置する。

layout.blade.php
<html>
    <body>
        <h1>Laravelクイックスタート</h1>

        @yield('content')
    </body>
</html>
users.blade.php
@extends('layout')

@section('content')
    Users!
@stop

@がつく記述をディレクティブとよび、HTMLと同時に記述することでphpを実行することができる。

@extends('layout')
ビューの拡張。layout.blade.phpを呼び出す。

@section('セクション名') 内容 @stop
セクションの作成。
引数内の変数に値を代入する処理。@yield('セクション名')で定義したセクションの内容を読み込むことができる。

セクションの終わりは@stopで指定(必須)。エイリアスである@endsectionでもOK。



作成したビューファイルを表示するようにルーティングを変更する。

先ほどのusesのルーティングの戻り値をview('ビューファイル名')とする。

Route::get('users', function()
{
    return view('users');
});



以上で作成したビューファイルを表示できる。

image.png


7. マイグレーションファイルの作成

LaravelでDBを扱うために必要なマイグレーションファイルを作成する。

laravelはマイグレーションファイルの内容を元にDB操作を行う。
マイグレーションファイルにはDBで使用するカラムの定義が入る。

php artisan make:migration create_[テーブル名]_table

$ php artisan make:migration create_flights_table
Created Migration: 2021_01_12_055029_create_flights_table

実行すると、database/migrationsフォルダ配下に指定したテーブル名のマイグレーションファイルが作成される。

image.png

作成したマイグレーションファイル名はクラス名に直結する。

yyy_mm_dd_sec_create_flights_table.php
class CreateFlightsTable extends Migration


create_と_tableの意味

ちなみに、先頭と末尾のcreate__tableはなくてもマイグレーションファイルを作成できる。

$ php artisan make:migration test
Created Migration: 2021_01_12_060050_test

作成したファイルがマイグレーションファイルであることを明示的に示すためにcreate_テーブル名_tableとするのが一般的。


マイグレーションファイルの構造

マイグレーションファイルには指定したテーブル名のクラス(移行クラスと呼ぶ)が作成され、中にupとdownの2つのメソッドが用意される。

・upメソッド:
 DBにテーブルやカラムを追加するメソッド。

・downメソッド:
 以前の状態に戻すメソッド。

マイグレーションファイルの中身
<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateFlightsTable extends Migration
{
    //マイグレーションの実行
    public function up()
    {
        Schema::create('flights', function (Blueprint $table) {
            $table->id();
            $table->timestamps();
        });
    }

    //マイグレーションを戻す
    public function down()
    {
        Schema::dropIfExists('flights');
    }
}


upメソッドの中身

    public function up()
    {
        Schema::create('flights', function (Blueprint $table) {
            $table->id();
            $table->timestamps();
        });
    }

Schemaファサードを使ってcreateメソッドを実行し、カラムにidとタイムスタンプをもつテーブルflightsを作成する処理となる。

Blueprint
テーブルにカラムやインデックスを追加するために使用するインスタンス。

$table
テーブルの名前が入った変数


ファサードとは

ファサードとはクラスの中のメソッドをインスタンスを呼び出さずに実行できる機能。

使用するメリットはコードを単純化できること。

use Illuminate\Support\Facades\ファサード名;
冒頭に記述してファサードを使えるようにする。

ファサードの本来の意味は「建物の正面」。人まとまりのプログラミングを建物とすると、その建物全てを用意せずとも、正面さえ用意すればそのプログラムが使えるようにすると言ったところ。

▼主なファサード
Schema以外にも、Route, Session, Request, Viewなどがある。

Laravel公式 ファサードの詳細


ヘルパー関数とファサードの違い

ファサードと似た処理でヘルパー関数がある。
ヘルパー関数はファサードを更に縮めたコード。

▼ビューファイルの呼び出し
profile.blade.phpを呼び出す場合、以下2つは同じ処理になる。

・Viewファサードでmakeメソッドを使う
return View::make('profile');

・ヘルパー関数を使う
return view('profile');

ファサードを使うよりヘルパー関数を使う方がわかりやすい。

テーブルにカラム追加

Schemaファサードのcreateメソッドを使って、テーブルにカラムを追加することができる。

$table->型('カラム名')->カラム修飾子()

    public function up()
    {
        Schema::create('flights', function (Blueprint $table) {
            $table->id();
            $table->string('name')->unique();
            $table->string('email')->nullable();  
            $table->integer('age');
            $table->boolean('membership')->default(false);      
            $table->timestamps();
        });
    }

ユーザー情報用に、name, email, age, membeshipを追加。
必要に応じてカラム修飾子をつける。

カラム修飾子

指定したカラムに条件を追加する。

・nullable()
nullを許容する。

・default($value)
デフォルト値を指定する。

型とカラム修飾子はかなりの種類がある。一覧はlaravel公式ページを参考。

インデックス修飾子

カラム修飾子と似ている。型に条件を追加する。
主キーや重複の禁止を指定できる。

上記設定では、unique()が該当。


8. DBにテーブルを作成(sqlite3)

laravelとDBを接続する。
簡易的なテストのためDBはsqlite3を使用。(macは標準インストール済み)

step1. .envファイルの変更

.env(変更前)
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=

↓ 以下に変更

.env(変更後)
DB_CONNECTION=sqlite


step2. database.sqliteの作成

database/database.sqliteを作成する。

プロジェクトのルートディレクトリで以下を実行。

$ touch database/database.sqlite


step3. マイグレーションの実行

php artisan migrate
作成したマイグレーションファイルをベースにDBにテーブルを作成する。

$ php artisan migrate:refresh
Rolling back: 2019_08_19_000000_create_failed_jobs_table
Rolled back:  2019_08_19_000000_create_failed_jobs_table (2.46ms)
Rolling back: 2014_10_12_100000_create_password_resets_table
Rolled back:  2014_10_12_100000_create_password_resets_table (0.98ms)
Rolling back: 2014_10_12_000000_create_users_table
Rolled back:  2014_10_12_000000_create_users_table (0.84ms)
Migrating: 2014_10_12_000000_create_users_table
Migrated:  2014_10_12_000000_create_users_table (1.82ms)
Migrating: 2014_10_12_100000_create_password_resets_table
Migrated:  2014_10_12_100000_create_password_resets_table (1.36ms)
Migrating: 2019_08_19_000000_create_failed_jobs_table
Migrated:  2019_08_19_000000_create_failed_jobs_table (1.36ms)
Migrating: 2021_01_12_074652_create_flights_table
Migrated:  2021_01_12_074652_create_flights_table (1.38ms)

以上でDBの作成が完了。

マイグレーションファイルを変更したとき

マイグレーションファイルを変更した場合は、refreshをつけて実行する。

$ php artisan migrate:refresh

9. テーブルの確認

マイグレーションでDBに正しくテーブルが作成できたか確認する。

sqlite> .table

#sqlite3を起動
$ sqlite3
SQLite version 3.28.0 2019-04-15 14:49:49
Enter ".help" for usage hints.

#テーブル一覧を表示
sqlite> .table
failed_jobs      password_resets  users
migrations       flights
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

【Laravel】composerインストール手順と注意点。composerコマンドを実行できるようにする。

Laravelのcomposerをインストールし、composerコマンドを実行できるようにする方法。

  1. (macの場合)homevrewとopensslのインストール
  2. composer.pharのダウンロード
  3. グローバルのパスを通す
  4. composerコマンドの実行


1. (macの場合)homevrewとopensslのインストール

composerをインストールするためにはopenSSLでの通信が必要だが、macOS 10.12 (Sierra) 以降の macOS では、 デフォルトで OpenSSL がインストールされていない。

opneSSLをインストールするためには、homebewというパッケージ管理ツールをインストールする必要がある。


#homebrewのインストール
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"


#opensslのインストール
brew install openssl

homebrew公式ページ


2. composer.pharのダウンロード

composerの公式ページに沿ってcomposer.pharをローカル環境にダウンロードする。

php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"

2行目のハッシュ値はバージョンがアップデートされるごとに変わるので、公式ページから最新版をコピー

実行が完了すると、ローカルにcomposer.pharが作成される。

$ ls
composer.phar



▼注意点
コードをコピーする場合は原文のページで行うこと。エラーが出てしまう場合はこちらを参照


3. グローバルのパスを通す

composerコマンドをどこからでも実行できるようにファイルをグローバルのパスが通ったディレクトリに移動する。

mv composer.phar /usr/local/bin/composer


4. composerコマンドの実行

composer --versionで、composerが実行できるかを確認。

$ composer --version
Composer version 2.0.8 2020-12-03 17:20:38

以上でcomposerのインストールが完了。

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

【Laravel】composerインストール時のエラー 内容と対処法。Googleの自動翻訳してませんか?

Laravelの導入にあたりPHPのライブラリ管理ツールのcomposerをインストールしようとするとエラーが発生する。

インストールのコードは公式サイトを参照している。

公式サイトのインストール手順

公式サイトより以下コードを使用。

公式サイト(日本語翻訳ページ)
php -r "copy( 'https://getcomposer.org/installer'、'composer-setup.php');" 
php -r "if(hash_file( 'sha384'、 'composer-setup.php')=== '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3'){echo 'インストーラー検証済みphp ');} echo PHP_EOL; " 
php composer-setup.php 
php -r "unlink( 'composer-setup.php');"


解決方法まとめ

エラー解消のために実行することは2つ。

(1) homebrewでopensslのインストール。
(2) Google翻訳を解除し原文のコードを使う。

原文のコード
php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"

詳細は以下ご参照。


1行目のエラー

$ php -r "copy( 'https://getcomposer.org/installer'、'composer-setup.php');"

Parse error: syntax error, unexpected ''https://getcomposer.org/insta' (T_CONSTANT_ENCAPSED_STRING) in Command line code on line 1

>エラー内容
Parse error: syntax error, unexpected ''https://getcomposer.org/insta' (T_CONSTANT_ENCAPSED_STRING) in Command line code on line 1

これはOpenSSLがインストールされていないために発生するエラー。

macOS 10.12 (Sierra) 以降の macOS では、 デフォルトで OpenSSL がインストールされていない。


解決策

Homebrewをインストールして、opensslをインストールすればOK。

Homebrew公式ページ

#homebrewのインストール
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"


#opensslのインストール
brew install openssl

上記実行後に1行目を再度実行すればOK。

$ php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"


2行目のエラー

続いて2行目のコードを実行してもエラーが発生する。

エラー
$ php -r "if(hash_file( 'sha384'、 'composer-setup.php')=== '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3'){echo 'インストーラー検証済みphp ' );} echo PHP_EOL; "

Parse error: syntax error, unexpected ''sha384'' (T_CONSTANT_ENCAPSED_STRING) in Command line code on line 1

>エラー内容
Parse error: syntax error, unexpected ''sha384'' (T_CONSTANT_ENCAPSED_STRING) in Command line code on line 1


解決策

google翻訳した状態でコードを貼り付けたことでシンタックスエラーが発生している。

原文に戻し、実行すればOK。

原文のコード
php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"

composerのバージョンによってコード内容が異なるため、最新コードは公式ページで確認のこと。


成功した場合
$ php -r "if (hash_file('sha384', 'composer-setup.php') === '756890a4488ce9024fc62c56153228907f1545c228516cbf63f885e036d37e9a59d27d63f46af1d4d07ee0f76181c7d3') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
Installer verified

コードが実行されるとInstaller verifiedが表示される。

3行目は問題なし

3行目は指定通りのコードを実行すればエラーが発生せず実行できる。

3行目の処理結果
$ php composer-setup.php
All settings correct for using Composer
Downloading...

Composer (version 2.0.8) successfully installed to: /Users/s01386/projects/composer.phar
Use it: php composer.phar

4行目のエラー

こちらも2行目と同じくgoogle翻訳されたことが原因。原文に戻してコードを実行すれば処理できる。

php -r "unlink('composer-setup.php');"

以上でcomposerのインストールが完了。


翻訳後のコード比較

2行目はコード内に日本語が混入しているのでエラー発生はわかるが、4行目のコードは翻訳前後で英語のみのため、全く同じに見える、、

比較
php -r "unlink('composer-setup.php');"   #翻訳前(原文)
php -r "unlink( 'composer-setup.php');" #翻訳後

比較してみると、翻訳後に空白が追加されていることがわかる、、



Google翻訳は便利だけどコードの場合は注意が必要。

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

Laravel,Graghql,Lighthouseで複数カラムのバリデーション

環境

Laravel 6.18.6
lighthouse: 4.11.0

コード

user.graghql
   # 下記の定義はサンプルです。
createUser (
   user_name: String!
   password: String!
): User
app\Graghql\Directives\Validations\createUserValidation.php
    /**
     * @return mixed[]
     */
    public function rules(): array
    {
        return [
            "foo" => [
                new Bar($this->args['bar'])
            ]
        ];
    }

結論

$this->args['foo'];で取れる。

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