プログラミング勉強 全体 自分はフロントエンド得意だと思っていたのですが、「標準のHTMLのフォームでデータ送信するときってどんな感じでやり取りするんだっけ?」「mimeTypeやHeadersって知っているけどどういう仕組みだっけ?」「Web Workerって?シングル…

動機 アップロードした画像を使って画像を加工するなどの処理の場合、どのように取り出して取り扱うか、というのが全然整理できていなかったのでその整理を込めてサンプルコードを書いた。 File オブジェクトや addEventListener もあんまり書いたことがなか…

はじめに 静的コンテンツをCDNに乗せておくとアクセス時間が早い、という話ではなく、 Next.js を SG してブラウザで閲覧した時の挙動に絞っています。 TL;DR SGした際に、 getStaticProps() 経由で渡したコンテンツは _next/data/ ディレクトリ配下に JSON …

はじめに 静的コンテンツをCDNに乗せておくとアクセス時間が早い、という話ではなく、 Next.js を SG してブラウザで閲覧した時の挙動に絞っています。 TL;DR SGした際に、 getStaticProps() 経由で渡したコンテンツは _next/data/ ディレクトリ配下に JSON …

TL;DR ローカルのリポジトリに入っていない、外部の API から取得した画像の最適化をどうするか 結局、 Vercel なら外部 URL の画像も最適化して高速で配信できるので Vercel を選択した 経由 Next.jsの getStaticProps と getStaticPaths を使ったStatic Ge…

TL;DR 第一引数に四捨五入する値を、第二引数に小数点以下の桁数を指定する関数を定義する。 /** * Rounding number with digit * Example: * round(3.14159265359, 2) = 3.14 * @param {number} value * @param {number} digits default : 0 * @returns {nu…

動機 以前から React を自作しよう を見かけてやりたいと思っていたが GW でやっとまとまった時間が取れたのでじっくり取り込んだ。 React をよく個人的に使うので、その設計と実装を経験したほうが React への理解が深まるのでは?と思った。 TL;DR 作業結果…