Google SpreadSheet の VLOOKUP で検索値より左の列の値を取得するのは難しい。 XLOOKUP を使うとシンプルに実現することができる

Google SpreadSheet の QUERY 関数を使い SELECT 文の中で BY 列を取得しようとすると BY が ORDER BY, GROUP BY のキーワードであるためにエラーになってしまいます

複雑な条件を query で取得して集計した結果だけを表示したい Spreadsheet の query はデフォルトで header が出力される 上記のようなデータがあり price >= 2000 のレコード数をだそうを query で下記のような関数を書くと count というヘッダーが表示され…

Google Spreadsheet で条件に当てはまるレコード数をカウントしたい時に COUNTIF や COUNTIFS を使うが、複数条件ある時 COUNTIFS だとデフォルトが AND になるので OR でカウントしたいときの Tips サンプルデータ A B C 1 販売商品コード 商品名 単価 2 A1…

n月中のデータを query で一覧にしたい時などに割と使うアレ 月末・月初の日付を求める EOMONTH を使う EOMONTH(開始日, 月数) 起算日から指定した月数だけ前または後ろの月の最終日の日付を返します。 開始日 - 結果を計算するための起点となる日付です。 …

ざっくりしたアプリを作っていて .tsx ファイル内にジェネリクスを使用した関数を作成したら Type Error になって謎… となったのでメモ .tsx にジェネリクスを使った関数を定義したらエラーになった const buildChunkArray = <T>(array: T[], size: number = 10</t>…

URL の クエリストリングとかサーチクエリとか言われる ?key=value をマージしたり結合したりする方法のメモ URLSearchParams を使ってパラメーターをマージしたり結合したりする new URLSearchParams は引数に配列 [[key, value], [key, value]], オブジェ…

シンプルに Element.className や Element.getAttribute('class') 使いなよ。って話ではあるが、JavaScript の Element.classList で取得できるクラス名を HTML にあるように半角スペース区切りの文字列で得たいときってどうするんだっけ？と思ったのでメモ …

GSAP の ScrollTrigger.batch を使えば、リストなどに簡単にアニメーションを設定することができる。 https://gsap.com/docs/v3/Plugins/ScrollTrigger/static.batch()/ batch でアニメーションを設定したときに、アニメーションが実行された要素に class を…

いわゆるガチャガチャ動かしたいという要望のホームページ制作(非 React)で初めて GSAP というアニメーションライブラリを使ってる。 できることがありすぎて、まだ理解しきれてないが今回は ScrollTrigger を使って CSS のクラスを変更しアニメーションを発…

⛳️ Goals WordPress で作ったサイトの管理画面にログインしてる時、とのサイトだっけ？ってならないように管理画面の favicon と ツールバーの home アイコンをロゴに変更したい (納品するサイトの場合、こういうちょっとした部分で評価高くなりますし) Vers…

Webpack を使って SCSS をコンパイルしているプロジェクトで久々に build したら下記のようなエラーが発生した $ npx webpack --config ./webpack.config.js --mode production … webpack-fix-style-only-entries: removing js from style only module: js/c…

WordPress で作成した staging 環境で manifest.json があるにも関わらず 401 のエラーになる問題が発生した GET https://stg.mysite/path/to/manifest.json 401 (Unauthorized) Basig 認証が問題だった staging 環境でサイト全体に Basic 認証をかけている…

React v.18 で作成したアプリで A props object containing a "key" prop is being spread into JSX という Warning が発生した Warning: props object containing a "key" prop is being spread into JSX: let props = {key: someKey, label: ..., size: ..…

TypeScript React で ref を使ったタイマーを使った処理を書いていて予期しない ESLint のエラーが出たのでメモ ESLint no-unused-expressions error が発生 const timerRef = useRef<number | null>(null); // … timerRef.current && clearTimeout(timerRef.current); // =</number>…

WordPress 6.6.2 ⛳️ Goals 管理者以外が投稿や管理をする運用なので、直ぐにログアウトできるように管理画面の固定バーの右端にログアウトボタンを設置したい $wp_admin_bar->add_menu でメニューを追加・parent を使い追加する場所を指定する top-secondary…

category.php, taxonomy-{tax_slug}.php の所謂、カテゴリー・タクソノミの一覧ページで選択されているカテゴリー名・タクソノミー名を取得したい WordPress v6.6.1 🙅 get_the_terms を使うをバグが発生しうる name ?? ''; } 上記のような get_the_terms を…

WordPress のカスタムテーマで web サイトを作ってたらちょいちょい発生するやつ。 最終的に get_permalink($postID) で URL を取得するのだが、特定のページの post id を取得する方法を忘れるのでメモ 1. ページのタイトルから取得する get_page_by_title …

稀に発生する Sass / SCSS で web サイトを作る案件。 毎回メディアクエリを生成する mixin どう書いてたっけ？ってなるのでコピペできるメモ Motivation breakpoint を変数で持たせて mixin でそれぞれのメディクエリを生成できるようにする media query を…

レンダリング後に useEffect で何かしらの初期化処理を行って、完了したことを明示したい時など 1回だけ更新する state を作りたいケース 別に useState でも良いのだけれど、useState は setter が返されるので state を自由に更新できてしまうので、state …

LP とかでよく出てくるやつ。個人的にはあまり好きじゃないけど、作るケースが割とあるので。 Window.requestAnimationFrame The frequency of calls to the callback function will generally match the display refresh rate. The most common refresh rat…

与えられた数値を 0, 5, 10, 15, … と 5刻みに丸めたい 結論 const get5RoundNumber = (n: number) => Math.round(n * 2 / 10) * 10 / 2; 5 刻みの数値を得るには 10 刻み 0, 10, 20, 30, ... を 2 で割れば 0, 5, 10, 15, … ととなる 0, 10, 20, 30,… とい…

タイトルのとおりなのだけど、日本語で書くとムズい type MyFuncArgumens = { defaultValue?: number; callback?: () => void; }; const myFunction = ({ defaultValue = 1; callback }: MyFuncArgumens) => { // ... }; 全てオプショナルなプロパティを持つ…

JavaScript の Date は日付だけなら UTC 時間と解釈され、時間があると実行環境のローカル時間だと解釈されてしまうので注意が必要。 どのタイムゾーンの日時か明示することで、実行環境に依る日付解釈の齟齬を無くすことができる

AB テストを行うための状態を保存したい。AB テストなので一定時間経過したら A / B の状態をリセットしたい。 同じブラウザなら一定時間同じ状態を表示させたいくらいの要件だったので手っ取り早く localStorage に値を保存したい。期限付きで。 localStora…

React で Modal や Drawer で作る時に state の変更で表示 / 非表示を切り替えるとパッ出たり消えたりするので UX 的に美しくないからアニメーションをさせたい。 chakra UI のような出来上がっている UI ライブラリ無しで実装してみたのでメモ (chakra UI使…

input[type="number"] で小数を入力可能にするには step 属性を使う必要がある

typescript: "4.9.5" Promise.allSettled Promise.allSettled() Promise.allSettled() は静的メソッドで、入力としてプロミスの反復可能オブジェクトを受け取り、単一の Promise を返します。この返されたプロミスは、入力のすべてのプロミスが決定したとき…

レイアウト的に別ブロックになってるけど続き順のリスト表現にしたいとか、ol の順番を途中から始めたかった start 属性を使えばOK start で指定した数字からの番号リストになる <ol start="10"> <li>item 1</li> <li>item 2</li> <li>item 3</li> </ol> ↓ 10. item 1 11. item 2 12. item 3 value 属性を使…

WEB サイトのコンテンツの主体は文章です。 その文章を日本語でもエディトリアルの禁則のようにいい感じにしてくれるプロパティを知ったのでメモ line-break プロパティ The line-break CSS property sets how to break lines of Chinese, Japanese, or Kore…