アクセス解析といえば、Google Analyticsだと思っていたが、vercelのダッシュボードでanalyticsを見ることができるようだ。 まずはインストール。 npm i @vercel/analytics 次に下記のように、@vercel/analytics/reactをインポートして、returnの一番最後に…

NextjsにReact Spectrumを導入する時は一手間かける必要がある。 next.config.jsに挿入する。 react-spectrum.adobe.com @adobe/react-spectrum 3.29.0 next 13.4.19 以上のバージョンだと上記の公式通りで動作した。 以下は、少し前の環境で動作した例。 @a…

React Spectrumには独自のタグが存在するが、トランスパイルされて書き換えがされる。 ビルドといったほうが正解か？ 独自タグ -> 変換後 <Header> -> <header> <Heading> -> <h1>など <Content> -> <section> <Footer> -> <footer> <Provider>, <Flex>, <Grid>, <View>, <Well> -> <div> <Text> -> <span> <Link> -> <a> こんな感じである。 サイトをとりあえず構築して感じたことは、初期</a></link></span></text></div></well></view></grid></flex></provider></footer></footer></section></content></h1></heading></header></header>…

ContextualHelpを利用して少々困ったことがあった。 ContextualHelpを配置したとき、なぜかブロックいっぱいの幅で配置されてしまう。センタリングされて配置されているみたいに。 ContextualHelpのあるブロックは<Grid>と<Flex>で囲っているので、justifyContentで制御</flex></grid>…

React Spectrumを少し触っています。 SpectrumはAdobeのデザインシステムのひとつで、Reactで扱いやすいように、各パーツがコンポーネント化されていて、ReactやNextでの開発に容易に組み込めるようになっています。 特に深く修得しているわけではありません…