[CSS] 画像の上に文字を乗せる方法

ボタン画像の上に文字を乗せて表示したい。
-> 画像の上に文字を乗せる方法を理解する。

<div class="sample">
			<img src="img/sky.jpg">
			<p>SUNSET</p>
		</div>

position: relativeとする。

<style>
    	.sample {
    		position: relative;
    	}
    	.sample p {
    		position: absolute;
    		color: red;
    		top: 5px;
    		left: 5px;
    	}
    </style>

<div class="container">
		<div class="sample">
			<img src="img/sky.jpg">
			<p>SUNSET</p>
		</div><br>
		<div class="sample">
			<img src="img/sky.jpg">
			<p>SUNSET2</p>
		</div>
	</div>

画像の上に文字が乗りました。

なるほど、理解した。背景画像とは別に、こういうことができるんやな。

[Photoshop] スライスを理解する

スライスとは、コーディング用に分解して、一つ一つの画像にしていく。
まず、Photoshopで画像を用意する。

続いて、切り抜きツールからスライスツールを選択

ファイル -> 書き出し -> Web用に保存

保存

分割された画像が書き出される。
ほう、こういう事か。。ちょっと視界が拓けてきたかな。

1.ボタン画像の上に文字を乗せる方法を確かめたい。
2.PSDファイルをHTMLにする流れを確認したい。

PSDのレイヤーが異なるものは、レイヤーごとに画像書き出ししてるんかな。

[Amazon Linux2] fluentdインストール

$ curl -L https://toolbelt.treasuredata.com/sh/install-amazon2-td-agent3.sh | sh

// プラグインインストール
$ sudo /opt/td-agent/embedded/bin/fluent-gem install fluent-plugin-zabbix
$ sudo /opt/td-agent/embedded/bin/fluent-gem install fluent-plugin-cloudwatch

// 起動
$ sudo systemctl start td-agent.service
$ sudo systemctl status td-agent.service

### テスト
$ curl -X POST -d ‘json={“json”:”message”}’ http://localhost:8888/debug.test
$ tail /var/log/td-agent/td-agent.log

### 設定ファイル
$ sudo vi /etc/td-agent/td-agent.conf
-> apache log出力

<source>
  type tail
  path /var/log/apache2/access.log
  pos_file /var/tmp/apache2-access.log.pos
  format apache2
  tag log.apache
</source>

<match log.**>
  type stdout
</match>

source
– inputしたいソースに対応するプラグインを指定

match
– イベントをタグ指定してoutputプラグインに渡す。
– 標準的に使用するプラグイン；file,forward

$ sudo systemctl reload td-agent.service

sysctl.conf とは？

/etc/sysctl.conf は、OS起動時に/proc/sysディレクトリのファイルに設定する値を記述するファイル。
カーネルパラメータを設定し、「/proc/sys」以下に反映する
net.ipv4.ip_forward=1　とすると、/proc/sys/net/ipv4/ip_forward　ファイルの中身が1となる。
sysctl -a

$ sysctl -a
abi.vsyscall32 = 1
crypto.fips_enabled = 0
// 省略
vm.watermark_scale_factor = 10
vm.zone_reclaim_mode = 0

メモリの使い方、プロセス管理、ネットワーク関係など、様々な項目を設定できる。

e.g.

net.core.somaxconn = 1024　// TCPソケットが受け付けた接続要求を格納する、キューの最大長
net.core.netdev_max_backlog = 5000 // パケット受信時にキューに繋ぐことができるパケットの最大数
net.core.rmem_max = 16777216 // TCPとUDPの送信バッファのデフォルトサイズ
net.core.wmem_max = 16777216
net.ipv4.tcp_wmem = 4096 12582912 16777216 // TCP ソケットバッファー
net.ipv4.tcp_rmem = 4096 12582912 16777216
net.ipv4.tcp_max_syn_backlog = 8096 // ネットワークのルート・メトリクス
net.ipv4.tcp_slow_start_after_idle = 0 // 一定時間無通信状態が続いたらウィンドウサイズを初期値から開始する設定
net.ipv4.tcp_tw_reuse = 1 // TCPの接続を使いまわすかどうか
net.ipv4.ip_local_port_range = 10240 65535 // TCPソケットが受け付けた接続要求を格納するキューの最大長

何だこれは。。。

[Laravel8.x] ページネーションをカスタマイズしたい

ページ数が増えた場合に、横に広がってしまうため、ページネーションをカスタマイズしたい。

$ php artisan vendor:publish –tag=laravel-pagination

/resources/views/vendor/pagination/element.blade.php

@if ($paginator->hasPages())
	<ul class="pagination" role="navigation">
		{{-- First Page Link --}}
		<li class="page-item {{ $paginator->onFirstPage() ? ' disabled' : '' }}">
	        <a class="page-link" href="{{ $paginator->url(1) }}">&laquo;</a>
	    </li>

		{{-- Previous Page Link --}}
		<li class="page-item {{ $paginator->onFirstPage() ? ' disabled' : '' }}">
	        <a class="page-link" href="{{ $paginator->previousPageUrl() }}">&lsaquo;</a>
	    </li>

		{{-- Pagination Elemnts --}}
    		{{-- Array Of Links --}}
		    @if ($paginator->lastPage() > config('const.PAGINATE.LINK_NUM'))


	        @if ($paginator->currentPage() <= floor(config('const.PAGINATE.LINK_NUM') / 2))
	            <?php $start_page = 1; //最初のページ ?> 
	            <?php $end_page = config('const.PAGINATE.LINK_NUM'); ?>

	        @elseif ($paginator->currentPage() > $paginator->lastPage() - floor(config('const.PAGINATE.LINK_NUM') / 2))
	            <?php $start_page = $paginator->lastPage() - (config('const.PAGINATE.LINK_NUM') - 1); ?>
	            <?php $end_page = $paginator->lastPage(); ?>

	        @else
	            <?php $start_page = $paginator->currentPage() - (floor((config('const.PAGINATE.LINK_NUM') % 2 == 0 ? config('const.PAGINATE.LINK_NUM') - 1 : config('const.PAGINATE.LINK_NUM'))  / 2)); ?>
	            <?php $end_page = $paginator->currentPage() + floor(config('const.PAGINATE.LINK_NUM') / 2); ?>
	        @endif

	    @else
	        <?php $start_page = 1; ?>
	        <?php $end_page = $paginator->lastPage(); ?>
	    @endif

	    @for ($i = $start_page; $i <= $end_page; $i++)
	        @if ($i == $paginator->currentPage())
	            <li class="page-item active"><span class="page-link">{{ $i }}</span></li>
	        @else
	            <li class="page-item"><a class="page-link" href="{{ $paginator->url($i) }}">{{ $i }}</a></li>
	        @endif
	    @endfor

		{{-- Next Page Link --}}
		<li class="page-item {{ $paginator->currentPage() == $paginator->lastPage() ? ' disabled' : '' }}">
	        <a class="page-link" href="{{ $paginator->nextPageUrl() }}">&rsaquo;</a>
	    </li>

		{{-- Last Page Link --}}
		<li class="page-item {{ $paginator->currentPage() == $paginator->lastPage() ? ' disabled' : '' }}">
	        <a class="page-link" href="{{ $paginator->url($paginator->lastPage()) }}">&raquo;</a>
	    </li>

	</ul>
@endif

const.php

	'PAGINATE' => [
        'LINK_NUM' => '3', //paginationの一度に表示するリンクの数
    ],

view

<div class="d-flex justify-content-center">
            {!! $products->appends(request()->input())->links('vendor.pagination.element') !!}
    </div>

OK 大分できてきた。後はBI周りを何とかしたい。

[Laravel8.x] 半角英数字記号のバリデーションをmake:ruleで作る

IDやパスワードにalpha_dashを使おうとすると、日本語が通過してしまう。独自ルールを作る。

$ php artisan make:rule AlphaRule

app/Rules/AlphaRule.php

public function passes($attribute, $value)
    {
        //
        return preg_match('/^[!-~]+$/', $value);
    }

    public function message()
    {
        return ':attribute は半角英数字記号で入力してください';
    }

Request内で使用

use App\Rules\AlphaRule;

// 省略

'name' => ['required','unique:users,name','min:2','max:24',new AlphaRule],

->
ID は半角英数字記号で入力してください

これは実装が相当簡単

### 1冊やっておいても損はない本

[Laravel8.16.0] 秘密鍵・private_keyの管理方法

private_keyを使ってControllerで処理をするとして、Controllerの中にprivate_keyを使うのは宜しくない。
ということで、.envに保存する。

.env

PRIVATE_KEY="-----BEGIN PRIVATE KEY-----\nhogehogefugafuga\n"

controllerからenvファイルを呼び込むのは宜しくないらしいので、configを経由する。

config/app.php

'private_key' => env('PRIVATE_KEY'),

controller

$value = config('app.private_key');
dd($value);

ほう、なるほど。
とりあえずrepository作り直す。

[PHP 7.4.11] CSVパスワードリストをハッシュ化したパスワードリストに変換

csvでパスワードリストを読み取り、1行ずつハッシュ化したパスワードに変えて、新しいハッシュ化リストcsvを作る。
ハッシュ化はpassword_hash($value, PASSWORD_DEFAULT);で書く。

if (($handle = fopen("list.csv", "r")) !== FALSE) {
    while (($data = fgetcsv($handle))) {
        foreach ($data as $value) {
        	$hashedpassword = password_hash($value, PASSWORD_DEFAULT);
            $list[] = array($value, $hashedpassword);
        }
    }
    fclose($handle);
}

$fp = fopen('new_list.csv', 'w');
foreach ($list as $fields) {
    fputcsv($fp, $fields);
}
fclose($fp);

echo "done";

password1,$2y$10$9Bonz2Ou5aJ1eOJl8Nf9eOipsRRWLpPbesCn.05J.W/pu0vItQ2mW
password2,$2y$10$d4OP/5HRbNWnS2BJS7w4puvWWXCj4Y2dxAmp0wS2E84Mpvc2udCqK
password3,$2y$10$u7IghXiVsUsVarK.n46X3eqP/uAzYMmtPCXLynXtYYy5nUlSCC0b6
password4,$2y$10$qgaJzGVySJT6ll7k3I0ZwewX/ia.a2KVK3XLjH/VJuSXJ4nzdi4Fy
password5,$2y$10$VcejFdWMC6M/hI4BRZfyyeglttkqzbO41TZUexek6b58rxejgYcKG
password6,$2y$10$.lhQys3h4ukEGxn8azvzDu76l0KHNvjZYxAHfPcLu3zvshbHV78oC
password7,$2y$10$KVWoquH7WRj1bDn2l88vo.N845A4vwvuguMxRPX1G/m6uF9q63A5C
password8,$2y$10$PFDr/P4fpC0kmxQofbfb0.jHGDvQqJoRe8RPCyQlYkDozCLWhjCLy
password9,$2y$10$ZAvichguRHYMkc42fPVXVex8x7xp9/by/BDmOVaW6vRpvMSr7dIm6
password10,$2y$10$L09R/P2BX2ougk3rxHVqWelI/rJrFlTlkVr4RE7U/chw7tWZob1gu

$list[] = array($value, $hashedpassword);　のところで、$hashedpasswordだけの配列を作るときは、$list[] = $hashedpasswordではなく、$list[] = array($hashedpassword);とする。

Ok, Not bad, keep going