かもメモ

自分の落ちた落とし穴に何度も落ちる人のメモ帳

Tips

Mac M2 java が常に 8888 ポートを専有してて困ってた

Docker を立ち上げようとしたら毎回 8888 ポート使われてると言われて困っていた 環境 MacBook air M2 2022 macOS Monterey 12.6 現象 $ docker compose up … Error response from daemon: Ports are not available: exposing port TCP 0.0.0.0:8888 -> 0.0.…

Vite index.html を移動させて開発ディレクトリを作りたいときの Tips

Vite Vanilla JS で静的サイトを作るテンプレートを作成していて index.html を移動させると色々大変だったのでメモを残しておく 作ったもの デフォルトの Vite プロジェクト $ npm create vite@latest ✔ Project name: … <Project Name> ✔ Select a framework: › Vanilla </project>…

Vite TypeScript __direname がエラーになる

Vite + TypeScript + ESLint で作った環境で Multi-Page App の設定をしようとした際に __direname がエラーになってしまったのでメモ TypeScript Cannot find name '__dirname' Cannot find name '__dirname' のエラーが出る場合は Node の型が無いので @ty…

SEO スクリーンリーダー専用テキストと隠しテキストのスパム判定のメモ

スクリーンリーダーが読み取れない隠しテキストはスパム判定でペナルティを受ける可能性がある

VSCode 設定を json で開きたい

Workbench > Settings: Editor を json にすれば OK!

CSS メディアクエリのブレイクポイントに CSS 変数は使えない

タイトルのままです。 CSS 変数はメディアクエリ (@media) のブレイクポイントの値には使うことができないようです。 CSS 変数をブレイクポイントにしても動作しない :root { --breakpoint-md: 48em; } @media (min-width: var(--breakpoint-md)) { body { c…

Mac M2 ターミナル (iTerm2 zsh) をいい感じにする

前回までのあらすじ ターミナルをいい感じにする設定のメモ ほぼ こちらの記事 のままです 環境・前提 Mac Book Air M1 (2022) mac OS Monterey Homebrew インストール済み 設定ファイルの準備 ~/.zshrc に設定を追加していく。~/.zshrc がない場合は作成す…

favicon をダークモード対応したい

webサイトやwebサービスでタブとかに表示される favicon 。favicon もダークモード対応ができるらしいのでやってみたのメモ favicon を SVG にする 昔から .ico みたいなファイル作ってたけど、最近では SVG もサポートされているらしい。SVG は内部にスタイ…

Git リモートリポジトリを変更する時のメモ

git remote set-url origin で変更すればOK ₍ ᐢ. ̫ .ᐢ ₎

npm WARN config init.author.name Use `--init-author-name` instead.

Node.js のバージョンを上げて npm コマンドを使ったら次のような warning が表示された npm WARN config init.author.name Use `--init-author-name` instead. npm WARN config init.author.email Use `--init-author-email` instead. npm WARN config init…

Google SpreadSheet ArrayFormula の中で IsDate が意図したとおりに動かないにハマる

下記のようなデータフォーマットが揃っていないスプレッドシートが有り日付が入っている場合のみ加工した値を出力させたかった A B 文字列 aaa 数値 123 日付 2022/01/01 存在しない日付 2000/2/30 空白 日付 1938/11/30 文字列 bbb ArrayFormula 内で IsDat…

CSS Chrome コンテンツの領域外に無限にスクロールしてしまうのを防ぐ

領域外への無限スクロールは `overscroll-behavior-y: none;` を body に付けると抑制できるっぽい!

Mac log ファイルの中身を空にしたい

Docker とかで動かしてるプロジェクトの log ファイルがすぐ巨大になるので定期的に空にしたい。巨大ファイルだとファイル開いて中身を消すのは大変なのでコマンドで楽したい。 echo -n > ./path/to/file でファイルの中身を空にできる $ echo -n > ./docker…

WordPress SSL 化のメモ

化石のような WordPress サイトのアップデート案件があり付随して SSL 化されてなかったので SSL 化したのでログとしてのメモ。 1. テーマ内にハードコーディングされている URI を修正する OGP設定や CDN などテーマ内にハードコーディングされている http …

Docker compose 起動時に環境変数が読み込まれないにハマる

docker compose build したら環境変数が読み込まれない現象が発生しましたのでメモ 構成 /root |- /app |- docker-compose.yml |- .env .env にある環境変数を docker-compose.yml で読み込んで environment でコンテナに渡すようにしていました。 .env は d…

Mac VSCode 折返し設定 (Word Wrap) が無視されてしまう問題

`editor.accessibilitySupport` が `on` になっていると折り返し (`editor.wordWrap`) の指定が無視される

Docker コンテナで cp コマンドで omitting directory

Docker コンテナのセットアップでディレクトリをコピーさせようとしたら cp: -r not specified; omitting directory というエラーが発生した $ docker compose exec app cp assets /var/www/html/assets cp: -r not specified; omitting directory 'assets' …

Proxy 設定されている社用マシンで Firebase ログインが大変だったメモ

お手伝いしているプログラミングスクールで Firebase を使う講義の際に Proxy 設定がされている社用 PC の方の環境で盛大にハマりどころがあったのでメモ。 Windows 環境は扱った経験がないので適当な記述になっているかと思います。ご了承ください。 1. npm…

docker-compose.yml で定義した変数を Dockerfile に渡したい

docker-compose.yml は環境変数を .env からよしなに取ってこれるので、同じ環境変数を Dockerfile に渡したいときのメモ。(すぐ忘れるからこれだけ書き残しておく) build 内に arg: で定義した変数を Dockerfile 内で改めて ARG 変数名 とすれば OK .env MY…

sed 置換の正規表現内で変数を使いたい

docker で環境を作っていて docker compose build 時に設定ファイルに環境変数から取得した値を自動で設定したかった。ファイルの変更は sed コマンドを使えば良さそうだったので置換の正規表現に環境変数を展開して置換できれば良さそうです。 変数を使う場…

React Tailwind CSS v3 クラス名を動的に作ったらクラスが適応されない?にハマる

v3.0から搭載された Just-in-Time engine はコード中を検索してマッチしたスタイルだけを出力する賢い仕組みだけど、クラス名の途中に変数が含まれた状態だとマッチせずスタイルが出力されない

AWS Amplify GraphQL API で TypeScript の型が生成されないにハマる

TypeScript 用にするには `amplify configure codegen` で設定ファイルを先に生成しておく必要があった

Firebase Hosting に Google Domains で取った独自ドメインを割り当てる

Firebase Hosting で公開するサイトに GoogleDomains で取った独自ドメインを割り当てたメモ 前提 Firebase でプロジェクトを作成済み Google Domains で独自ドメインを取得済み 1. Firebase Hosting でカスタムドメインの設定を行う Hosting → 「カスタムド…

Tips AWS Amplify のプロジェクトが削除できなくなった

AWS-CLI で `aws amplify delete-backend-environment --app-id --environment-name ` コマンドを実行すれば AWS コンソールから削除できない Amplify の環境を削除できた

React の再レンダリングについてのメモ

props を受け取る子コンポーネントは React.memo した上で props で渡される関数やオブジェクトが useCallback, useMemo でメモ化されてないと親コンポーネントの再描画時に再描画される。 依存関係がないコンポーネントはラッパーコンポーネントを作り chil…

JavaScript ファイル名 (文字列) から拡張子を取得したい

拡張子を含むファイル名の文字列から、拡張子とか拡張子を除いたファイル名を取得する方法のメモ 拡張子の始まりの位置を特定すれば拡張子とファイル名に分解できる 拡張子とは何かを考える 拡張子は . から始まる 文字列の一番最後に出現する . 以降が拡張…

Sass の変数で CSS のカスタムプロパティ(変数)を定義したい

Sass (SCSS) を使って CSS のカスタムプロパティ (変数) を定義するときのメモ Sass の変数を #{} で囲ってあげればOK $textColor: #000; $backgroundColor: #FFF; // カスタムプロパティを定義 :root { --text-color: #{$textColor}; --background-color: #…

Docker コンテナ内の MySQL にコンテナ外からアクセスできないにハマる ERROR 1045 (28000): Access denied

docker-compose で作成した MySQL にコンテナ外から mysql コマンドでアクセスしようとしたら Access denied になるにハマったのメモ。※ 本エントリーは経過と事象のメモで詳しく調べてはいません。 環境 Mac OS 11.6 Docker desktop 4.5.0 MySQL 8.0.28 (Ho…

GitHub コマンドラインでパスワード認証がエラーになった

ある組織のリポジトリで開発環境を作っていて submodule が設定されていたので初期化しようとしたら GitHub のパスワードを聞かれてエラーになったのでメモ $ git submodule update --init Submodule 'tools/common' (https://github.com/ORG_NAME/REPO) reg…

Docker Postgres DB コンテナが起動しないにハマる

Django の docker 環境をクイックスタートのドキュメントを参考に作っていたけど DB にしていされていた Postgres のコンテナが起動しなかった。 docker-compose.yml version: '3' services: # 略 db: image: postgres restart: always # 永続化 volumes: - …