swrを使っていて、無限スクロールを実現するにはどうしたらよいか調べた ここでいう無限スクロールとは、スクロール量をトリガーにして、次ページのデータを取得し、現在のデータの末尾にそれらを追加することで、取得できるデータがある限り無限にスクロー…

何度も忘れてしまうマージ済みのブランチを削除するコマンドのメモ qiita.com $ git branch --merged|egrep -v '\*|develop|master|main'|xargs git branch -d エイリアスに追加する [alias] delete-merged = "!f () { git checkout $1; git branch --merged…

Next.js 13の/appを触っていて、getInitiaPropsがなくなったのでどうやってパラメータを受け取るのか調べた 例えば、以下のファイルを用意したとき、 app/blog/[slug]/page.tsx http://example.com/blog/abc/?id=123 のURLで、slugとidの受け取りたい ドキュ…

10月25日の深夜に「Next.js Conf 2022」が開催されて、Next13が発表されたので確認する nextjs.org /appディレクトリ いままでは/pageディレクトリ配下にファイルをおくと設定不要で階層に応じたルーティングが行えるが、同じ用途で新たに/appディレクトリが…

前々から気になっていた初期描画時の非表示コンテンツについて気になる記事 ayudante.jp 結論から言うと、初期描画時の非表示コンテンツは 検索クエリに対応したコンテンツがあっても、検索スニペットに表示されない 初期表示コンテンツよりも検索順位が下が…

いまさらながらES2022でのアップデートをキャッチアップした 鹿野さんの記事が参考になった zenn.dev クラスフィールド宣言 プライベートなメンバー instanceofの代わりのin トップレベルawait 配列の最後の要素を取得できるat() hasOwnPropertyの代わりのOb…

Yahooのパフォーマンス改善の話を読んでいて、改善手法のloading属性とcontent-visibilityは知っていたがcontainは知らなかったので調べた techblog.yahoo.co.jp containプロパティは、ブラウザーがレイアウト、スタイル、描画、寸法、およびその組み合わせ…

あるときトレイリングスラッシュと呼ばれるURL末尾の「/」のありなしが話題になったので調べた 結論気にしなくてよい 以下の記事を読むと、ありなしは気にする必要はがないことがわかった www.suzukikenichi.com サブディレクトリのありなしは意味が変わって…

9月にSEOの順位が下がり、その原因を探している最中に見つけた木村さんの記事 ameblo.jp サブディレクトリの貸し借りはしていないので今回は関係なさそうだが、よくないとうこと知らなかったのでメモ 借りる側の順位はわからないが、貸す側は2022年9月のGoog…

ReactのuseRFCが話題になっていたので、 github.com uhyoさんの記事を読んで理解を深めた zenn.dev useとは useはSuspense機構を使う上で必要だった「Promiseをthrowする」という処理を、サードパーティからReact内部に隠蔽する仕組みで、Reactユーザーにと…

CSSの新しい単位で「lv*, sv*, dv*」がChrome108に実装されたとのこと Good news everyone! The Large, Small and Dynamic viewport units (lv*, sv*, dv*) are coming to Chrome 108!I2S announcement: https://t.co/3JGCpfKQjr pic.twitter.com/u8AOuREiD…

HTTP クライアントライブラリの中で、axiosっていまどうなんだろうと思っていたら良記事をみつけた zenn.dev 記事によると、今後も他ライブラリと差別化を図りつつモダン化に向けた対応をしていくとのこと v1.0.0の変更は以下にまとまっていた Release v1.0.…

コピペで使えるHTML, JS, CSS の便利パターン集というものを知ったのでみてみた web.dev ちょっとみただけで興味があるのがたくさんあった Advanced apps patterns Animation patterns Clipboard patterns 画像をコピーする方法 テキストをコピーする方法 フ…

JetBrains による次世代 IDE 「Feet」が試せるようになったので試してみた www.jetbrains.com 普段 IntelliJ IDEA を使っていて機能的には満足しているが、やや動作が重く感じるので軽いメモをしたくなった時に使うようなものではない それが、軽量でメモ用…

Componentギャラリーというサイトが良い component.gallery その名の通りコンポーネント横断で様々サイトのデザイン例を見ることができる 例えば、ボタンというページではAtlassianのデザインシステムなどのデザイン例がリンクされている 参考になりそうなの…

Google Map を使ったアプリで、いざマップを触ろうとすると以下のようなメッセージがでる ユーザー体験が悪いためこれをやめたい そもそもこれが表示されるのはページのスクロールとマップのスクロールが混在しないようにするためで、私の場合は、以下のよう…

Fastlyのエッジ上でNext.jsが実行できるようになったという話 www.fastly.com @fastly/next-compute-jsをインストール $ npx @fastly/next-compute-js fastly compute serve コマンドを実行 $ cd compute-js $ fastly compute serve 本番公開する場合は以下…

Javaのstreamを使ってコレクションの中から最小値を求めたい なんとなくminを使えば？と思って以下のようにしてみたが上手くいかなかった class Product { public BigDecimal price; } List<Product> products; products.stream().min((Product) p -> p.price); javad</product>…

JestでUIコンポーネントのテストをするとき、そのコンポーネントがhtmlファイルをimportしている場合、以下のようなエラーが発生する SyntaxError: Unexpected token '<' import html from "./sample.html" | ^ Jestでテストする際にJavaScriptとして扱える…

viewportアドオンはiframeで表示しているcanvasのviewportを変更するアドオンで、Essentials addons を有効化にしていれば利用できる storybook.js.org ただ、初期設定だと選べるデバイスがSmall Mobile、Large Mobile、Tableの３つで少ない そこで、iPhoneS…

Storybookのvupを行いたい 5.3.19 → 6.5.12 以前に試みたことがあったがエラーが発生して、時間切れで断念していた しかし、v6.4からできるようになったplay関数とtesting-libraryの連携をやる必要性が出てきたので再びvupに挑戦することにした とりあえず、…