2022-01-01から1年間の記事一覧
自動で JS, CSS の整形をしてくれる Prettier とても便利で愛用しています。 同じクオートの設定を JS の時は ' (Single Quote), CSS の時は " (Double Quote) とで分けたい時のメモ overrides, files を使って設定の場合分けができる .prettierrc.json { "s…
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…
下記のようなデータフォーマットが揃っていないスプレッドシートが有り日付が入っている場合のみ加工した値を出力させたかった A B 文字列 aaa 数値 123 日付 2022/01/01 存在しない日付 2000/2/30 空白 日付 1938/11/30 文字列 bbb ArrayFormula 内で IsDat…
領域外への無限スクロールは `overscroll-behavior-y: none;` を body に付けると抑制できるっぽい！
Docker とかで動かしてるプロジェクトの log ファイルがすぐ巨大になるので定期的に空にしたい。巨大ファイルだとファイル開いて中身を消すのは大変なのでコマンドで楽したい。 echo -n > ./path/to/file でファイルの中身を空にできる $ echo -n > ./docker…
化石のような WordPress サイトのアップデート案件があり付随して SSL 化されてなかったので SSL 化したのでログとしてのメモ。 1. テーマ内にハードコーディングされている URI を修正する OGP設定や CDN などテーマ内にハードコーディングされている http …
docker compose build したら環境変数が読み込まれない現象が発生しましたのでメモ 構成 /root |- /app |- docker-compose.yml |- .env .env にある環境変数を docker-compose.yml で読み込んで environment でコンテナに渡すようにしていました。 .env は d…
Rollup を使って JS をビルドしていたのですが CommonJS 形式の require が解決されずそのまま出力されてしまう問題にハマったのでメモ 環境 rollup v2.77.2 @rollup/plugin-node-resolve v13.3.0 @rollup/plugin-commonjs v22.0.1 rollup.config.js import …
10年くらい前に作った WEB サイトの改修案件が発生して、構成が古すぎて手に負えなくなっていたのでコレを気にビルド環境を見直しました。 元のものが Grunt で JS を結合したり SCSS をビルドしている構成だったので Grunt を Gulp に置き換え、SCSS のビル…
`editor.accessibilitySupport` が `on` になっていると折り返し (`editor.wordWrap`) の指定が無視される
Docker コンテナのセットアップでディレクトリをコピーさせようとしたら cp: -r not specified; omitting directory というエラーが発生した $ docker compose exec app cp assets /var/www/html/assets cp: -r not specified; omitting directory 'assets' …
GraphQL で A 又は B が含まれる配列を返す schema を作成したかったのでメモ A型 または Bの型を返す Union Type を作成する Union Type が含まれる配列の型を作成する 1. A型 または Bの型を返す Union Type を作成する union キーワードで定義する Union …
お手伝いしているプログラミングスクールで Firebase を使う講義の際に Proxy 設定がされている社用 PC の方の環境で盛大にハマりどころがあったのでメモ。 Windows 環境は扱った経験がないので適当な記述になっているかと思います。ご了承ください。 1. npm…
vite React プロジェクトで .env に書いた環境変数を使うメモ 環境変数は VITE_ prefix を使う VITE_ から始まる変数名でないと vite アプリからアクセスできない 環境変数が誤ってクライアントに漏れてしまうことを防ぐために、VITE_ から始まる変数のみが …
docker-compose.yml は環境変数を .env からよしなに取ってこれるので、同じ環境変数を Dockerfile に渡したいときのメモ。(すぐ忘れるからこれだけ書き残しておく) build 内に arg: で定義した変数を Dockerfile 内で改めて ARG 変数名 とすれば OK .env MY…
三畳紀ぶりに WordPress の案件があって触ってます。 20世紀みたいに PHP 環境を local に作るのつらすぎるので docker を使ってい環境構築していたのですが、WordPress のコンテナから mysql コマンドが使えなかったので使えるようにしたメモ Docker WordPr…
docker で環境を作っていて docker compose build 時に設定ファイルに環境変数から取得した値を自動で設定したかった。ファイルの変更は sed コマンドを使えば良さそうだったので置換の正規表現に環境変数を展開して置換できれば良さそうです。 変数を使う場…
React.lazy と import() を使えばコンポーネントを Dynamic import することができます。 例えば何種類下のアイコンの中で必要なコンポーネントだけ読み込みたいような場合、コンポーネントへのパスを変数にできるとコードがシンプルになりそうだったので試…
環境 - react@18.1.0 - vite@2.9.9 - typescript@4.6.4 React.lazy Reacy.lazy を使うと import() で読み込んだコンポーネントを通常のコンポーネントとして扱うことができる 下記の方法でコンポーネントを Dynamic import できる // component export defau…
Pagination みたいにリストの中から常に n 件の値を取得する方法を考えてみた。(車輪の再発明) 要件 リストが n 件以上ある時は 常に n 件 表示する current を中心として前後に n / 2 件づつの範囲を取る 偶数件の範囲を取る場合は後ろの方を 1 件多くする …
v3.0から搭載された Just-in-Time engine はコード中を検索してマッチしたスタイルだけを出力する賢い仕組みだけど、クラス名の途中に変数が含まれた状態だとマッチせずスタイルが出力されない
Vite で作成した React (TypeScript) のプロジェクトで MSW (Mock Service Worker) を使って開発環境で API へのリクエストにモックを返すようにしたいと思っていたのですが React からのリクエストがことごとく net::ERR_FAILED [MSW] Failed to mock a "PO…
Enum はエミューじゃない。エミューは Emu だった！
Twitter みたいに画像を投稿できるフォームでは input[type="file"] を使いますがデフォルトでは選択した画像のファイル名が表示されるだけなので、何の画像を選択したかプレビューができたほうが便利です。 割とフォーム作成の際に必要になるので思いつきで…
オブジェクトの特定のプロパティの値をアップデートをする関数を作成していました interface Todo { name: string; description: string; } const todo: Todo = { name: "", description: "" }; const update = (arg: {name?: string; description?: string}…
TypeScript 用にするには `amplify configure codegen` で設定ファイルを先に生成しておく必要があった
Firebase Hosting で公開するサイトに GoogleDomains で取った独自ドメインを割り当てたメモ 前提 Firebase でプロジェクトを作成済み Google Domains で独自ドメインを取得済み 1. Firebase Hosting でカスタムドメインの設定を行う Hosting → 「カスタムド…
AWS-CLI で `aws amplify delete-backend-environment --app-id --environment-name ` コマンドを実行すれば AWS コンソールから削除できない Amplify の環境を削除できた
1. vite-plugin-svgr プラグインを使う 2. .svg の型定義ファイルを作成する
Express (TypeScript) で作った local 開発用に立てた実験用サーバーに express-session モジュールを使ってセッションを使えるようにしたのメモ 環境 express@4.18.1 graphql@16.5.0 express-graphql@0.12.0 express-session@1.17.3 typescript@4.7.2 expre…
