日報的な備忘録的なやつ
https://arichi21.blog.fc2.com/blog-entry-23.html の続き
Laravel sail起動
#環境変数を設定
# ローカル環境変数を設定
cp .env.docker .env
# ailas 設定（sail upする際に毎回必要、永続化させる設定あり、対応は後程）
alias sail='bash vendor/bin/sail'
# 起動
sail up
sail up時のエラー対処
１：エイリアス設定を忘れてるパターン
下記のようなメッセージを吐く、ここでメッセージ通りに
sudo apt install bsdgamesを実行してしまうと、訳わからんクソゲーをsail upコマンドで実行してしまうようになるので、絶対にインストールしないようにする
g-company-data 2023-11-01
Command 'sail' not found, but can be installed with:
sudo apt install bsdgames
２：dockerにログインするのをubuntuで実行する必要があるパターン
下記コマンドを実行すると解決する
docker login
３：そもそもdocker desktopを起動していないパターン
下記のような場合、docker desktopが起動できてないかdocker側の設定がうまく出来ていない
docker is not runnning
docker desktop設定
下記画像のように有効にしていないといけない
スクリーンショット (79).png
起動できると結果はこんな感じに出る
sail up
f2212@LAPTOP-IDT5CNE7:/home/work/expertbank$ sail up
WARN[0000] /home/work/expertbank/docker-compose.yml: `version` is obsolete
WARN[0000] /home/work/expertbank/docker-compose.yml: `version` is obsolete
[+] Running 4/0
✔ Container expertbank-mailhog-1 Created 0.0s
✔ Container expertbank-mariadb-1 Created 0.0s
✔ Container expertbank-laravel.test-1 Created 0.0s
✔ Container expertbank-nginx-1 Created 0.0s
Attaching to laravel.test-1, mailhog-1, mariadb-1, nginx-1
mailhog-1 | 2024/06/11 05:32:59 Using in-memory storage
・
・
・
マイグレーションをする
DB migration
sail artisan migrate
sail artisan admin:install
sail artisan passport:install
マイグレーションとは
データベースを削除してから作り直すと，DBに保存されている情報が全て削除されてしまう．こういった事態を回避する方法として、データベースマイグレーションを行う方法がある。 マイグレーションとは、DBに保存されているデータを保持したまま、テーブルの作成やカラムの変更などを行うための機能
具体的な参考サイト
https://densan-labs.net/tech/codefirst/migration.html
sail artisan admin:install
要はhttp://localhost/admin/ にアクセスするために必要
ダミーデータインストール
もらったSQLファイルをA5M2でインポートする
外部キー制約エラーを吐いた場合、下記SQLを実行すると解決する
外部キー制約を一時的にシカトするSQL
//一旦シカト
SET foreign_key_checks = 0;
//終わったら戻す
SET foreign_key_checks = 1;
テーブルロックエラーを吐いた場合は下記SQLで対応
LOCK TABLES admin_menu WRITE;
ページにアクセスできるようになった事を確認して環境構築完了とする
とりあえず簡単に今回仲良くするvue.jsについてざっくりまとめる
vue.jsってどんな事ができるフレームワーク？
・UIを構築するためのJsのFW、段階的な仕様変更や新しい機能の追加が繰り返されると、当初使っていたFWでは対応が難しくなってくる、そこでvue.jsを導入すると気持ちよくなれるらしい。
特徴
Vue,jsには仮想DOMという概念があり、Jsオブジェクトを使って差分のみをDOMに反映する処理を行っている
２つの仮想DOMが変更前と変更後の構造を比較して差分を特定する仕組みになっている
これにより、DOMを直接書き換えて画面全体を再描画するよりも、早く画面を切り替えることができる
・データの変更を自動で画面に反映する
アプリの構造にMVCモデルがあって、Vue.jsはMVCモデルから派生した、MVVMモデルを採用したFWで「model」「view」「viewmodel」の３つの機能で設計されている。
modelはデータの管理、保存、外部の入出力や内部的な操作などロジックにかかわる操作を行う。
viewはユーザーの入力、操作を受け付けて、画面表示などのUIに関わる処理を担う。
補足： viewmodelはmodelとviweの状態を監視している、状態に変化があればそれぞれに通知する、このようなロジックとUIを分離して状態を監視しながら処理が行えるのは仮想DOMによるもの
・機能ごとにファイルを分ける
Vue.jsは、ひとつのファイルにHTML、CSS、JavaScriptを記述できる vueファイルを扱うことが可能
ブラウザはvueファイルをそのままでは扱うことができないので、 コンパイラを通してHTMLファイルやCSSファイル、JavaScriptファイルなどに変換する
この仕組みのことを 単一ファイルコンポーネント（SFC）という
・シングルページアプリケーション（SPA）の開発に向いている
シングルページアプリケーションとは、初回の表示でWebサーバから情報を読み込んでJavaScriptで表示をしたあと、ページ遷移をおこなわずに更新が必要な部分だけを再描画する仕組みを持ったアプリケーションのこと
補足： Vue.jsはルーティングという機能を使ってページ遷移をしているように見せることができるため、シングルページアプリケーションの開発に向いている
---・小さな部品を組み合わせてアプリケーションを構築できる---
Vue.jsは、コンポーネントを組み合わせてアプリケーションを構築します。コンポーネントとは、それだけで完結するプログラム（機能）ごとに分けた小さな部品のこと
---・柔軟にアプリケーションを拡張できる---
導入する際に利用するのが、 nvm、 Node.js、 npm、 yarn
アプリケーションを拡張する際には、パッケージマネージャーのnpmかyarnのどちらかを利用します。パッケージマネージャーとは、JavaScriptのプログラムを管理するシステムのこと
プロジェクトの作成やビルドなどをおこなうための環境を構築をする際には、npmかyarnでVue CLIをインストールする
おさらい コマンドなど
bashコマンド
一部忘れていたコマンドもあったので復習として一連のコマンドと意味をメモとして記載していく
cd
チェンジディレクトリの略、名前の通りディレクトリを移動するときに使用する
厳密にはカレントディレクトリから指定したディレクトリに移動する
～ディレクトリとは？
ディレクトリとはフォルダのようなもの、とりあえずディレクトリ＝フォルダという認識でおｋ
通常のwindwsなどはフォルダと表現するが、linuxではディレクトリを表現したりする。
ディレクトリに関する用語
ディレクトリ linuxにおけるフォルダの役割を持つ
カレントディレクトリ 現在、自分がいるディレクトリの事
ルートディレクトリ 一番上の階層のディレクトリ
ホームディレクトリ ユーザーがログインした際に最初に開くディレクトリ
使用例
#testディレクトリに移動する
cd test/
#ルートディレクトリに移動する
cd /
#カレントディレクトリから一つ上の階層へ移動する（分かりやすく表現すると"戻る"
cd ..
#ホームディレクトリに移動する
cd ~
ls
ディレクトリ内のディレクトリ、ファイルを確認する時に使用する
語尾に-aなどのオプションを付け足すとそれぞれの役割を持った処理を実行する
オプション
-a 隠しファイルを含むすべてのファイル（ディレクトリ）を表示する
-A 隠しファイルを含むすべてのファイル（ディレクトリ）のファイル名のみを表示する
-l ファイルの種類や所有者・所有グループなどのファイルの詳細を表示する
-i inode番号も表示する
使用例
ls -l /test
total 0
drwxr-xr-x 1012 root wheel 32384 5 10 06:30 bin
drwxr-xr-x 31 root wheel 992 5 10 06:30 lib
drwxr-xr-x 6 root wheel 192 5 26 14:26 local
drwxr-xr-x 233 root wheel 7456 5 10 06:30 sbin
#/usr/localディレクトリ配下の全てのファイル(ディレクトリ)を表示。
ls -la /usr/local
total 0
drwxr-xr-x 6 root wheel 192 5 26 14:26 .
drwxr-xr-x@ 11 root wheel 352 5 10 06:30 ..
drwxr-xr-x 22 root wheel 704 6 8 23:55 bin
drwxr-xr-x 5 root wheel 160 6 8 23:55 lib
cat
指定したファイルの中身をみるコマンド
オプション
-s 連続したスペースやタブを1行にして表示する
-n 行番号をつけて表示する
-A 非表示文字を含めてすべて表示する
-E 最終行に$を表示する
使用例
# sample.txtの中身を表示。
cat sample.txt
# sample1.txtとsample2.txtの中身を連結して表示。
cat sample1.txt sample2.txt
# sample1.txtとsample2.txtの中身を連結させたものをsample3.txtという新規ファイルに出力。
cat sample1.txt sample2.txt > sample3.txt
補足：ファイルの中身を逆順にして表示するtacコマンドというものもある
vi
# sample.txtというテキストファイルを作成。
vi sample.txt
==========
Google
Apple
Facebook
Amazon
==========
tac
# tacコマンドでsample.txtを出力。
tac sample.txt
Amazon
Facebook
Apple
Google
nano
メタキーとは
nanoエディタのキー操作は、^CやM-Aという表記でエディタ下部に表示されます
^Cの^はctrlキーのことなので、 ^Cとはctrl + Cのこと
メタキーとは、コンピュータのキーボードにある修飾キーのこと
古いパソコンのキーボードに修飾用キーとしてMeta というキーが存在したので、その名残りとしてメタキーという言葉が使われているようです。
現在、メタキーはaltキーなどで代用されます。 つまり、M-Aとはalt + Aのことです
使用例
#何も指定しない場合の実行
$ nano
#新規ファイルに対して編集を開始する
#ファイル指定ありで実行
nano file-name.txt
上記コマンド実行で、既存ファイルのfile-name.txtがあれば編集モードに、なければ新規ファイルとしてfile-name.txtの編集モードに移行します。
ctrl + Oで編集したファイルを保存する
ctrl + Xでnanoを終了
shift + ← or →でカットしたい文字列を指定、ctrl + Kでカットできる
ctrl + Kでカットした文字列をctrl + Uでペーストできる
ctrl + \で文章中の特定文字列を別の文字列に置換できます
alt + Uで前回操作を取り消すことができます
ctrl + Wで文章中の特定文字列を検索することが出来ます
ctrl + Rに続いてctrl + Tで カレントディレクトリを起点にファイルを選択して、その内容を挿入することができます。
ctrl + Tでコマンド実行モードに移行して任意のコマンドを実行できます。
ps auxwww
オプションの組み合わせでは、プロセスごとにCPU負荷やメモリ使用量、コマンドの引数やオプションを表示することができます。また、STAT列を見ることで、そのプロセスがどのような状態か、例えばディスクIO待ちなのか、ゾンビプロセスなのか、優先度はどれくらいなのかを知ることができます。
ps auxwww
ps aufxww
ps auxww をさらに人が見やすくしたのが ps aufxwwです
表示する端末の文字コードによっては文字化けする可能性があり
ps aufxww
curl
curl コマンドは、様々な通信プロトコルでデータの送受信を行うことができるコマンドです。 よく使われる方法としては、Web サイトへ http リクエストを送信してコンテンツを表示する
eval
単純な文字列ではなく、文字列を評価・連結
#文字列としてコマンドを変数に格納
#bash内の関数に文字列としてコマンドを与えるケースや、
#ファイルから文字列としてコマンドを読み込むケースを想定
cmd='grep $value hoge.txt'
echo $cmd
#出力 -> grep $value hoge.txt
#echoの場合、コマンドは実行されない. 変数は展開されずに、文字列として出力される
eval $cmd
#出力 -> hoge hoge
#evalの場合、変数が展開され、コマンド実行される
chown -R
ファイルの所有者またはグループ ( あるいはその両方) を変更します
whoami
自分の情報を表示する
bashrc
自動的に実行される設定ファイル
シェルの挙動をカスタマイズするためのコマンドや設定が記述されています
インタラクティブモード
引数を指定せず起動したモードのこと
sail build --no-cache
dockerの設定ファイルなどを書き換えた際に実行するコマンド
F5キーみたいなもの