ktyr report

import { useState } from "react"
export const App = () => {
    const [num, setNum] = useState(0);
    const onClickButton = () => {
        setNum(num + 1);
    };
    return (
        <>
        <button onClick={onClickButton}>Button</button>
        <p>{num}</p>
        </>
    );
};

モデル作成

sail artisan make:model Post -m

　
マイグレーションファイルのupを下記へ

public function up(): void
{
Schema::create('posts', function (Blueprint $table) {
       $table->id();
       $table->string('title');
       $table->text('body');
       $table->timestamps();
});
}

マイグレーション

sail artisan migrate

カラム追加のマイグレーションファイル作成

sail artisan make:migration add_test_column --table=users

中身

public function up(): void
{
    Schema::table('users', function (Blueprint $table) {
        $table->string('test')->after('email');
    });
}
public function down(): void
{
    Schema::table('users', function (Blueprint $table) {
        $table->dropColumn('test');
    });
}

カラム削除のマイグレーションファイル作成

sail artisan make:migration delete_test_column --table=users

中身

public function up(): void
{
    Schema::table('users', function (Blueprint $table) {
        $table->dropColumn('test');
    });
}
public function down(): void
{
    Schema::table('users', function (Blueprint $table) {
        $table->string('test')->after('email');
    });
}

ロールバック

sail artisan migrate:rollback

PostController

$posts = Post::with('user')->where('user_id',auth()->id())->orderBy('created_at','desc')->get();

　
Models/Userに下記追記

public function posts(){
    return $this->hasMany(Post::class);
}

　
Models/Postに下記追記

public function user(){
    return $this->belongsTo(User::class);
}

「fatal: unsafe repository」が出たら

エラー文にあるように下記を実行することで解消する。

git config --global --add safe.directory '%(prefix)///wsl.localhost/Ubuntu/home/jack/test-project'

　　
確認

git config --list

　　
削除

git config --global --unset-all safe.directory

define('DB_ENCRYPT_KEY','aabbccddeeff');
require_once __DIR__ . '/idiorm.php';
ORM::configure('mysql:host=localhost;dbname=xxxx');
ORM::configure('username', 'yyy');
ORM::configure('password', 'zzz');
ORM::configure('driver_options', [
    PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES utf8',
]);

$query = "INSERT INTO {$table_name}(`e_id`,`description`) VALUES(:e_id,AES_ENCRYPT(:description,'xxyyzz'))";
result = ORM::for_table('users')->raw_execute($query,['e_id'=>1,'description'=>'あいうえお']);

$query = "UPDATE {$table_name} SET `description`=AES_ENCRYPT(:description,'xxyyzz') WHERE `e_id` = :e_id";
result = ORM::for_table('users')->raw_execute($query,['e_id'=>1,'description'=>'あいうえお']);

bladeで改行出力

{!! nl2br(e($post->body)) !!}

　
TwilwindCSSなら「whitespace-pre-line」クラスを付与すれば改行される

<p class="p-4 whitespace-pre-line">{{$post->body}}</p>

　
反映されないときはbuildを忘れていないか確認

sail npm run build

app\Providers\AppServiceProvider.php

use Illuminate\Support\Facades\Gate;
use App\Models\User;

public function boot(): void
{
    Gate::define('test',function(User $user){
        if(条件){
            return true;
        }
        return false;
    });
}

　
routes/web.phpで制限する場合

Route::get('/test',[TestController::class,'test'])->middleware('can:test');

　
blade.phpで制限する場合

@can('test')
制限対象
@endcan

　
コントローラーで制限する場合

use Illuminate\Support\Facades\Gate;

public function index(){
    Gate::authorize('test');
    $posts = Post::all();
    return view('post.index',compact('posts'));
}

　
AppServiceProvider.phpの条件に合致しない場合は
「403 | This action is unauthorized.」が表示される

blueMessage.jsx

export const blueMessage = (props) => {
    console.log(props);
    const contentStyle = {
        color : props.color,
        fontSize : "20px"
    };
    return <p style={contentStyle}>{props.message}</p>
};

　
App.jsx

import { blueMessage } from "./components/blueMessage";
export const App = () => {
    const onClickButton = () => {
        alert();
    };
    const contentStyle = {
        color : "blue",
        fontSize : "20px"
    };
    return (
        <>
        <h2 style={{ color:"red" }}>Hello</h2>
        <p style={contentStyle}>World</p>
        <blueMessage color="green" message="Great" />
        <blueMessage color="red" message="Bad" />
        <button onClick={onClickButton}>button</button>
        </>
    );
}

　
childrenを使う場合
blueMessage.jsx

export const blueMessage = (props) => {
    console.log(props);
    const contentStyle = {
        color : props.color,
        fontSize : "20px"
    };
    return <p style={contentStyle}>{props.children}</p>
};

　
App.jsx

import { blueMessage } from "./components/blueMessage";
export const App = () => {
    const onClickButton = () => {
        alert();
    };
    const contentStyle = {
        color : "blue",
        fontSize : "20px"
    };
    return (
        <>
        <h2 style={{ color:"red" }}>Hello</h2>
        <p style={contentStyle}>World</p>
        <blueMessage color="green">Great</blueMessage>
        <blueMessage color="red">Bad</blueMessage>
        <button onClick={onClickButton}>button</button>
        </>
    );
}

通常

{{ $post->body }}

　
改行する場合

{!! nl2br(e($post->body)) !!}

e関数：HTMLエスケープを行うためのヘルパーメソッド