【JS】 date-fns-tzによるタイムゾーンを考慮した時刻format
date-fns-tz date-fns-tzは、タイムゾーンを考慮した日時の「やりくり」に関する機能を提供するライブラリです。下のように実装することで、タイムゾーンに合わせた日時をフォーマットできます。 `formatInTimeZone`の第２引数にタイムゾーンを文字列で指定、第３引数でどのような形式でフォーマットするかを指定しています。 ちなみに、指定できるタイムゾーンの一覧は[こちら](h […]
TAG
フロントエンド
【CSS】DOM要素の非表示に関するTips
CSSには、DOM要素を非表示にする方法がいくつかあります。ここではその方法とそれぞれの違いをTipsとしてまとめます。 display / visibility / opacity はじめにまとめてしまいますが、DOMの非表示のために用いることができるCSSのプロパティはdisplay / visibility / opacityの３つです。 それぞれは、以下のように実装することでDOMの非表示 […]
【React】useCallbackのキホン
ここではReack hookのひとつ、useCallbackについて紹介していきたいと思います。 このhookはReactにおけるパフォーマンス最適化戦略と関わってくるところが大きいので、まずはそこから見ていきましょう。 Reactのパフォーマンス最適化 Reactでは、パフォーマンス最適化のためには「不要な再計算やコンポーネントの再レンダリングを抑える」ことが基本的な戦略です。 その実現のために […]
.tsxファイルについてドキュメントを読む（その２）
前回に引き続き、TypeScriptドキュメントのJSX章を読んで得た知見をまとめます。今回はコンポーネントと属性の型チェックについて。
.tsxファイルについてドキュメントを読む（その１）
.tsx拡張子ファイルは、Reactなどで利用するJSX構文をTypescriptで書いた際に保存される拡張子ファイルです。今回、typescriptの公式ドキュメントをのぞいてみたところ、少し普通の.tsファイルと比べた制約など学びを得たので、まとめていきたいと思います。 型アサーションに山括弧<>は使えない 型アサーションは、Typescriptによる型推論、あるいは既に型定義済み […]