なんでもノート

なんでも書くノートみたいなブログ

2021-08-01から1ヶ月間の記事一覧

Setオブジェクトによる配列の要素の重複排除

JavaScriptのSetオブジェクトを使って簡単に配列の要素の重複を排除できることを知った。 const array = [1, 2, 3, 1]; const set = new Set(array); const uniqueArray = [...set]; console.log(uniqueArray); // [ 1, 2, 3 ] オブジェクトの重複も排除する…

Jestの.toBeDefined()マッチャー

Jestの .toBeDefined() マッチャーを知った。 最初見たときは何を検証しているのか分からなかったが、ドキュメントを読んだら当たり前すぎた。 https://jestjs.io/ja/docs/expect#tobedefined 変数が undefined ではないことを検証するには、.toBeDefined を…

優先度とか基準とか軸とか

ある楽なもの。 意思決定というほどのものでもないが、日々何かを決めている。意思決定や判断を繰り返すと疲れる。決断疲れという現象があるらしい。 ここでタイトルの優先度とか基準とか軸があると決断が楽になる。これらに従って機械的に判断すれば頭を使…

Next.jsのgetInitialPropsの実行順序

Next.jsのPage ComponentとCustom App ComponentとCustom Document ComponentのgetInitialPropsの実行順序を整理する。 // pages/index.tsx ... Home.getInitialProps = async (ctx: NextPageContext) => { console.log("Home.getInitialProps"); return { h…

GraphQL Directiveを使って三項演算子

GraphQLのDirectiveという機能を使って三項演算子を再現する。 実行環境にはhttps://graphql.org/learn/queries/#directivesを使う(いつか動かなくなってしまうかもしれない)。 例ではwithFriends variableの真偽値を変えることによって、friends.nameを取…

有名どころの漫画とアニメを押さえたい

自分が押さえられてない有名どころの漫画とアニメを押さえたい。具体的には以下の作品。 ハガレン デスノート まどマギ(今日観終わった) 宇宙兄弟 Fate あの花 キングダム サイコパス シャーマンキング ジョジョ カイジ どれも有名で面白いのだと思うが、…

Podcastと散歩

最近、Podcastを聞き始めた。聞いたのは以下の3つ。 Rebuild - Podcast by Tatsuhiko Miyagawa mozaic.fm fukabori.fm 上から順に存在を知った。きっかけは覚えていない。今のところfukabori.fmが長さと内容的に聞きやすい。タメになるし面白い。 主に外を歩…

ながらアニメをしないようにしたい

アニメを観ながら何かをしないようにしたい。例えば、考え事をしたり、スマホをいじったり。アニメを観ながら何かをすると、アニメの内容が頭に入ってこないことがある。観終わった後、面白かった…のか…?となることがある。せっかく最後まで見てもよくわか…

Gitのsubmoduleを理解するためのインデックス

※ 自分の頭の中にインデックスを貼るための備忘録的な記事です。 仕事でGitのsubmoduleを使っているが、なんとなく使っているので改めて理解しようと思った。 「Git submodule」で検索して1番上に出てきたGit submodule の基礎 - Qiitaがかなり分かりやすか…

続・WebP対応ブラウザを判定する

WebP対応ブラウザかサーバーサイドで判定する - なんでもノートでWebP対応ブラウザをサーバーサイドで判定する方法を調べた。Acceptヘッダーに image/webp が含まれているかどうかで判定する方法をまとめた。 これ以外にUser-Agentで判定する方法がある。Web…

技術記事カテゴリーを作った

azujuuuuuun.hatenablog.com 技術記事カテゴリーを作った。2021/08/17現在、14記事。増やしていきたい。

WebP対応ブラウザかサーバーサイドで判定する

WebP対応ブラウザかどうかをサーバーサイドで判定する方法を調べた。 判定方法 Webサービス上の画像変換とWebPの利用について | メルカリエンジニアリング が分かりやすかった。 おそらく最も一般的なのがAcceptヘッダーを使う方法だと思います。 ...(中略…

transitionendイベントとanimationendイベント

最近transitionendイベントとanimationendイベントを知った。 transitionendイベントはCSSトランジッションが終わったときに発生する。 HTMLElement: transitionend イベント - Web API | MDN 最初書いたときはtransitionedとタイポした。過去形を表すedでは…