React + Express + ベーシック認証で、manifest.jsonに401エラーが出たので対処したメモ
Create React appsでReactアプリを作成、yarn build
コマンドでbuildしたアプリに、expressとbasic-authを使い、ベーシック認証をかける仕組みを作ろうと思ったら、
GET http://localhost:3000/manifest.json 401 (Unauthorized)
というエラーが出た。faviconや他の静的ファイルはBasic認証を通しているので、何故?と思って調べたら、manifestファイルはCORSの設定をしないと、ベーシック認証が突破できない模様。
public/index.html
のmanifest.jsonを読み込んでいる箇所を、以下のように書き換えることで回避ができた。crossorigin
という属性が有るのは知っていたけど、こういうところで使うのかぁ、という共有。Reactって書いたけどcrossorigin
にしか言及してなくってすんません。
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" crossorigin="use-credentials"/>
参考
遅い2020年の個人的な抱負
光の早さで1月が終わろうとしている。12月の振り返りから新しい抱負をたてていなかったので、焦り気味に今年の抱負をたてた。去年作成した抱負から反省して、方針としては抽象的にかつ大きめの抱負にする。
副業を安定稼働させる
お陰様で副業は好調で、去年はトータルで前職の給与のほぼ倍を超えた。需要があることは肌で感じたので、マッチング率や時間のかけ方を改善していきたい。 一方で会社外で活動する分、社会的信用がダイレクトに効いてくるので、期待を裏切らない様、オーバーワークにならないように調整をしていく。
アウトプット、インプットを多めに
前半までは割とアウトプットも多かったが、後半副業に時間が取られたり、後述する家の購入などでバタバタして、アウトプットへモチベーションも含めて避けなかった。本も例年より買ったが積み本になっていた。
今年は去年を超えるようにしたい。
ポートフォリオサイトを作る
作る作る詐欺で滞ったサイトをそろそろまとめたいところ、、自分の顔となるサイトなのでしっかり作りたいが、作っては納得せずに途中でやめて...みたいなことを繰り返しているので、言い訳せずにやってきたい。
ローンを返す
新居を買って借金王になったので、まずはちゃんと一年返せる様に頑張るぞい。
2019年の個人的な振り返り
早いものであと1週間ちょいで2019年が終わってしまうので。軽く個人的振り返りをしようと思う。
続きを読むLaravel / Valetで開発環境を簡単に準備するメモ
Laravel & Valetで簡易開発環境を最短で構築する手順とかを簡易的にまとめておく。
環境
- Larabel 5.7
- Valet
インストール
Homebrewとcomposer、brew経由でのphpインストールは済んでいることを前提。
$ brew update $ composer global require laravel/valet $ valet install
pingを打って、valetが起動しているかどうかを確認します。
ping foobar.test
実行
valetはparkとlinkという2つの実行用コマンドを用意しています。
park
コマンド
プロジェクトの親ディレクトリに対して、park
コマンドを実行。
parent └ sample-project
$ cd parent // parentに移動 $ valet park // parkコマンドを実行してvaletとリンクさせる
sample-project.testで動作を確認
link
コマンド
プロジェクトの親ディレクトリに対して、link
コマンドを実行する。
ここではparent/sample-project
というディレクトリにlinkコマンドを実行する前提で説明。
$ cd parent/sample-project // parentの中に入る $ valet link
ブラウザでhttp://sample-project.test
を開いて動作を確認する。動作していれば作業完了。
apacheと競合して動かない場合
Valetはnginxですが、Mac標準のApacheと競合して動作しないケースがあるようです。 https://stackoverflow.com/questions/39708139/laravel-valet-it-works
$ sudo apachectl stop $ valet restart
関連記事まとめ
Laravelの開発でよく使っていたコマンドまとめ
以前Laravelを使って開発している際よく使うartisanコマンド、開発の延長で使うDBのコマンド、調べながら知ったものを備忘録も兼ねてまとめていた...のだがしばらく下書きで放置していたのでここで公開してみます。
Laravelのバージョン
Laravel 5.7
ヘルプコマンド
artisanコマンドは多く用意されているので、迷ったときはよく見る。
php artisan list
configのキャッシュをクリアする
env設定を変更して、再度起動した際に表示が残り続けたりするので、よく使う。
$ php artisan config:cache
各ファイルの作成
artisan
コマンドはmodelやcontrollerを生成する機能も備えてます。
modelを作成
$ php artisan make:model
controllerを作成
$ php artisan config:cache
【Optional】 DB(MySQL)操作周り
デザイナー上がりのエンジニアにはSQLコマンドは割ととっつきにくい。なのでよく使うコマンドをコピペして残しておく。基本的にDBはLaravelから操作するので、Terminalから使うコマンドはほとんどこれが全てです。
Shell操作
# MySQLインストール $ brew install mysql@5.7
mysqlにバージョンを付けないでインストールすると8.x系がインストールされる。8.0系の認証方式ではLaravelをそのまま使えないのであえてこのバージョンにしている(参考: https://takakisan.com/laravel-mysql-8-migration-error-fix/)
# DB起動 $ mysql.server start # DB停止 $ mysql.server stop # DBの再起動 $ mysql.server restart # DBへログイン $ mysql -u root
SQLコマンド
# DB作成(文字コードがutf8mb4) create database {Database名} character set utf8mb4; # 作成したDBの一覧確認 SHOW DATABASES; # user確認 SELECT Host, User FROM mysql.user; # column(型)確認 use `{Database名}`; SHOW COLUMNS FROM `{table名}`; # DBの中身確認 use `{Database名}`; SHOW COLUMNS FROM `users`; SELECT * FROM `{table名}`; # tableの中身を空にする TRUNCATE TABLE `{table名}`; # DB内の削除 use `{Database名}`; DROP TABLE `{table名}`;