Laravel気づいたこと徒然
- クエリビルダのメソッドはEloquentのメソッドしても使えるんか…
Laravelのページにも書いてあった！
Eloquentモデルはクエリビルダですから、クエリビルダで使用できる全メソッドを確認しておくべきでしょう。Eloquentクエリでどんなメソッドも使用できます。
けどget()しないと呼び出せないのとcollectionが返ってくる
- モデルに$datesプロパティを指定＝date型で返してくれる
- paginateクラスのappendsメソッド: appends(request()->query())でquery全部送ってくれる
- あれ？value="{{ old() }}"で表示されない。
→一旦$request->flash()でセッションに一時保存を明示すると使えるようになった。
- CSSのクラス名、linkとか無難につける or li, a 等要素名に直接あてると、予想しないとこまでスタイルが変わってしまっている
→大元のにかぶらないクラス名命名して。そこからたどってCSSあてる
.reservation_result__item .link
とか。
レビューから学んだHTML/CSS
HTML/CSSの課題の中で、自分を含めた提出者たちに対するレビューを見て学んだことをざっと書き出してみた。
細部にこだわるのは大事だと思うけど、気にしすぎると書くのが億劫になってきちゃうので、自分のレベルに合わせて気にする数を増やしていくスタイルで。
クラス命名関係
- BEMを使って命名←初めて知った
Block: 大きな要素
Midifier: 同じパーツだけど状態や見た目を変えたいとき指定
Element: 上以外
可読性が上がる、SCSSと相性がいいとのことで修正がしやすそうだ、と思った。
- 凡庸的な命名は、重複による混乱を招く恐れがあるので注意
- クラス名でその部分が全体の何にあたるかが判別できるような名前をつけてあげてね
HTML・CSSの設計にBEMを取り入れてみよう！ | Tech dig
HTML関係
- 画像等のパスは明確に記入
- 空行のルールを明確に。あったりなかったりすると見にくいよ
- hの数で、ファイルを見たときにそこが全体のどの部分かわかるような数字をあてがってね
・h1~h6まであり
・デザインの都合でｈタグを使わないでね。ｈは見出しって意味なので、あくまで文書の論理構成に基づいてあてがう。
→h1は大見出し、1ページにつき1回利用の原則
→文章の構成を考えながら、小さい数字から順番を守って使用
- buttonタグのプロパティ指定の際に改行
CSS関係
- タグに対してスタイルをあてるのではなく、クラスに当てていく
- 色指定は単語ではなく、カラーコードで
カラーコードは、2桁ずつ分けてRGBを16進数で表したもの
- before::を取り入れる（::afterも）←初めて知る
指定した要素の前に何かスタイルを追加できる。
contentプロパティで文字を追加することも可能
真ん中にしたい Bootstrapで
思いつくのざっと
・mx-auto（ブロック）
・text-center（インライン）
・offset-size-num
・justify-content-center
いつも調べているので箇条で残す
Dockerがなかなか立ち上がらない＋xdebug導入問題
Dockerをアンインストールー＞インストールを繰り返したり
edge版を入れてみたりした。
wslの/mnt/wsl/docker関係のキャッシュが関係してたか？
xdebug入らないなぁon Docker /w wsl
1日経って入った、ようやった。
・xdebugが入ったかphpinfo()で要確認。phpinfo()はいいね、必要な情報がたっくさん入ってるのね、それを参考にxdebug.iniの場所変更→Docker立ち上げから導入されるようになった
・xdebug.remote.hostのIPがおかしいのかな？ってずっといじってたけど、host.docker.internalで良かった。
一緒に書いてたxdebug.remote.connect_backがいらなかった模様、ちゃんとドキュは読もうね。
・VScodeの環境変数に何が入ってるかは公式ページに確認方法あり
公式ドキュは強い、英語はどんとこいやー
Vimコマンド備忘録
世の中Vimのコマンド一覧は飽きるほど出回ってると思いますが、自分の記憶定着のために、まとめ
※移動系
| コマンド | 内容 |
|---|---|
| h | 左 |
| l | 右 |
| j | 下 |
| k | 上 |
| w | 単語1個分右に移動*1 |
| b | 単語1個分左に移動 |
| 0 | 行頭移動 |
| $ | 行末移動 |
| gg | 冒頭へ移動 |
| G | 最後に移動 |
| 数字＋G | 数字行へ移動 |
※編集系
- ｄ＋上のコマンド ：削除、カット
- ｙ＋上のコマンド ：コピー
ｙｙ、ｄｄ ：現在行をコピー、削除
- ｐ ：貼り付け
- J ：カーソルがある行とその下の行を連結
間違えたらu <->ctrl + u で戻り
※検索系
- /検索文字 ：下に向かって検索
- ?検索文字 ：上に向かって検索
ｎで次結果、Ｎで前結果
- %s/置き換え元文字/置き換え後文字/g ：置換
※ヘルプ系
：help 閉じるのは:q
: help dとか調べたいの打つのもok
*1:’も1単語とみなす、それが嫌なら大文字
