シェルスクリプトでファイル内の文字を置換する場合には、「sed」コマンドを使用しますが、Macでは改行コード等が上手く読み込めないため、「gnu-sed」をインストールする必要があります。
開発
Macで「sed」ではなく「gsed」を使用しよう
2023年3月
開発
Dockerイメージを作り直す
すでに作成したDockerイメージでしたが、「Dockerfile」に問題があったために再度作り直すことになりました。
以前作成したDockerイメージを削除して作り直すだけですが、メモとしてまとめておきます。
またDockerは「docker-compose」で管理した状態となります。
開発
「rsync」を使ってサーバーにデプロイする
ファイルのデプロイを行うのに「WinSCP」や「FileZilla」を使用することがありますが、ファイル構成を同期する「rsync」を使用した方が圧倒的に便利です。
そこで今回はMac上で「rsync」を使用して開発プログラムをサーバーにデプロイする方法をまとめます。
Laravel
「Lumen」で「Job」を使用して非同期処理
「Lumen」でAPI開発時に処理が長い箇所があり、結果を問わない内容でしたので非同期で処理をする様にしました。
「Laravel」では「Job」を使用する方法の情報はありましたが、「Lumen」での情報が少なかったので記事にまとめました。
開発
「ngrok」を使用してwebhookの開発
外部サービスの「webhook」を使った開発ではローカルで開発した場合にデバッグなどが難しいです。
そこで「ngrok」を使用して開発することで一時的に外部URLを作成してローカルのサーバーと連携してデバッグすることが可能となります。
Laravel
【Laravel】CORSの許可設定を行う
バックエンドとフロントエンドのホスト、ポートが違う場合にアクセスするとCORSエラーとなります。
この場合、バックエンド側でCORS対策をする必要があり、「Laravel/Lumen」でCORS対策する方法をまとめました。
Laravel
「lumen」でWebAPIを開発する
WebAPIなどの複雑な処理をしない開発の場合は「Laravel」よりも「lumen」を使用した方が良いかとおもいます。
「Laravel」から最低限の機能だけにした「lumen」は軽量で処理も早くなります。
Next.js
「Next.js(React) + GSAP」でアニメーションを実装する
Webページでアニメーションを使用する場合は、便利なライブラリ「GSAP」を使用しております。
またスクロール時にアニメーション表示する場合は、「ScrollTrigger」と組み合わせて使用すると楽に実装できます。
Next.js
Next.js + Materialデザインで、簡単に確認ダイアログを実装する(material-ui-confirm)
「React」で「MUI」を使用したプロジェクトで、確認ダイアログを表示する場合、「material-ui-confirm」を使うと便利です。
通常のJavaScriptの確認ダイアログのように処理を実装する事ができます。
Next.js
Nextjs + MUI で開発を行う(非SSR)
「Next.js」でマテリアルUIを使ってアプリを作成したい場合は「MUI」というライブラリを使用するのが手っ取り早いです。
今回は「MUI」とマテリアルデザインのアイコンを表示する「icons-material」の導入方法をまとめます。