2021-01-01から1年間の記事一覧
概要 Next.js は多言語化機能を提供している。 Advanced Features: Internationalized Routing | Next.js 例えば、 <html> タグの lang 属性は自動で書き換えてくれる。 しかし、hreflang の設定は、必要とあらば自前で実装する必要があった。 hreflang とは そも</html>…
概要 HTML の <textarea /> には autofocus という属性があり、これを指定するだけでフォーカスが効きます。 textarea - HTML: HyperText Markup Language | MDN ただし、初期状態でテキストが入力されている場合、文頭にカーソルが置かれてしまいます。 そんな時は、set</textarea>…
Angular v11 から HMR（Hot Module Replacement） が利用できるようになった。 Version 11 of Angular Now Available | by Mark Techson | Angular Blog ng serve --hmr とフラッグをつけるだけなので、設定が非常に簡単。 環境ごとに区別したい場合は、npm …
概要 React アプリを開発しているときに、ルーティング遷移前に確認モーダルを出したい時がある。 「このページを離脱してもいいですか？」のような。 React Router の Prompt を利用すると、簡単に確認モーダルを実装できる。 React Router: Declarative Ro…
概要 Angular を v6 の頃から利用しており、ずっと TSLint を利用していた。 しかし、TSLint が deprecated になってしまったので、ESLint に移行した。 やったこと angular-eslint による移行 以下の記事を読む。 Angular: ESLintサポートの現状 2020 Autum…
概要 Lighthouse でパフォーマンス計測 計測値を Datadog に送信 以上の2つを severless framework 上で定期実行する仕組みを構築していきます。またコードは TypeScript で書けるようにします。 パッケージ バージョン 本記事の執筆時点での serverless fra…
概要 shareReplay を使うと複数の subscribe を一本化できて便利です。 stream$.pipe(shareReplay()) パフォーマンス改善の対処法としてよくやります。（share だと初期値の null が流れてきてしまうので、個人的には shareReplay の方が好みです。 参考: an…
問題 echarts では複数線形チャートが作れる。 参考: https://echarts.apache.org/examples/en/editor.html?c=line-stack ここで、MarkArea を利用して部分的な背景色を適用したい場合がある。以下の画像で言うところの、薄青色の部分。 参考: https://echar…
本記事の執筆時点での TypeScript のバージョンは 4.1.5。 localStorage.setItem の型定義を見てみると、 setItem(key: string, value: string): void; となっている。 なので、以下のように number 型を渡すと型エラーとなる。 localStorage.setItem('ここ…
概要 Angular のバージョンを上げるので、その記録を書く。 基本的には、 https://update.angular.io/ に従うだけ。 ただ、関連するパッケージのアップデートや破壊的変更に伴うコード修正は必要だと思われる。 使用しているライブラリは「Angular CDK、Nebu…
