このviewsだけにこのJSを読み込みたい・・・！ という時があると思います。 今回はそんな時のためにJSファイルを個別に読み込む方法を紹介します。 （esbuildを使用している前提で進めていきます） 手順 package.json に記載されているビルドスクリプトのビ…

今回は、Reactでチャートを描画するライブラリ、Rechartsを使ってレーダーチャートを描画します。 早速余談ですが地名からじゃんけん力を算出してじゃんけんできるサービスをつくりました。グー力(りょく)とかが算出されます。残念ながら対人戦はできません…

2020終わり頃のApollo Client 3から、 reactive variables なるものが追加されたようです。リアクティブな変数を持たせることができるようになったということです。 New in Apollo Client 3, reactive variables are a useful mechanism for storing local s…

Next.jsで使える認証ライブラリ、next-authでGoogle認証を試してみます。 公式を参考にしつつ動くところまでやってみます。永続化とかはしません。 ちなみに今回の内容はこのあたりに何もかも書いてあります。 https://next-auth.js.org/getting-started/exa…

JavaScriptを使ってフロントエンドで日付操作をする事って結構あると思いますが、Dateオブジェクトを使うとクセが強すぎて意図しない動きになったりしますよね。 最近会社のプロジェクトで日付操作をDateオブジェクトを使っていて悲鳴をあげてたんですが、da…

photo by Josh Hallett Vue.jsのcomputed property（以下computedと表記）がどのように依存しているdataが更新されたときだけ再計算されるのかを調べてみました。 基本的なcomputed propertyの使い方 目的の異なるcomputedが複数あるとします 依存関係が違う…

公式 TL;DR Opal導入する TL;DR 全部Rubyでかけるのがうま味？ Rubyに慣れ親しんだJS初心者は嬉しいかも？ なOpal入門してみます。導入からアプリがちょっと動くところまで。 Opal導入する 適当なプロジェクトを作成して、準備します。 GemfileにOpalを追加 …