GoogleカレンダーのようなカレンダーUIを簡単に作れるライブラリ「FullCalendar」を実務で使う機会があり、色々とカスタマイズして使ってみたので整理しておく。 「最もポピュラーなJavaScriptカレンダー」 FullCalendar カレンダーライブラリの選定 カレン…

やりたいこと styled-componentsでcss propsを使ってスタイリングをしたい 開発環境 開発環境はCRAで構築したReactアプリケーションであり、TypeScript、styled-componentsを採用している。 コンポーネントへのスタイル注入方法を検討中、css propsを活用し…

やりたいこと null や undefined の値をfalsyな真偽値として扱いたい 結論 Boolean() あるいは !!で二重否定を使う。 const unData = undefined; const nullData = null; const strData = ""; const arrData: string[] = []; const objData = {}; // !! をつ…

JavaScriptでの配列操作を使う機会が多いが、毎回ググってる気がするのでひとまずよく使うものについて整理してみる。 配列操作 const arr1 = [10, 20, 30]; const arr2 = [40, 50, 60]; const arrObj = [ { id: 1, name: "A" }, { id: 2, name: "B" }, { id…

すでに令和も4年。平成まではギリ西暦⇔和暦の変換ができていたけれど、令和になってからは覚えるのもめんどくさくなり、ググらないと今は令和何年なのかもわからないという人もいるのでは？ 前職は病院の事務員だったので、様々な行政の書類や日々の業務の中…

バリデーションライブラリ「Zod」の基本的な使い方についてまとめてみる。 Zodは、スキーマファーストなバリデーションライブラリ。 はじめにスキーマを定義して、パースすることでバリデーションをかけることができる。 CodeSandbox | zod スキーマを定義す…

結論は、「Presentialも、Containerも、StyledComponentも全部まとめて書きたい！」です。 Reactでコンポーネントを書くときに、PresentialとContainerの役割を分離するというのが基本みたい。 ファイルそのものを分割してそれぞれに役割を持たせるというの…

Gatsbyブログを作ったので、雑に環境構築についてメモしておく。 TypeScriptやReactのキャッチアップも兼ねていたので、ESLintやPrettier、StyleLintも入れてみた。 前回のブログでも書いたが、React+TypeScriptキャッチアップにはもってこいだと思っている…