2023-01-01から1年間の記事一覧

クラシック yarn パッケージ マネージャー

以前にyarnの有効化のことを書いた。 その時に公式には corepack enable とあるにもかかわらず、 npm i -g yarn との案内も多いと書いた。 その時は古い情報という印象を持っていたのだが、相応の理由もあるようだ。 Yarn Classic ライン (1.x) クラシック安…

Photoshop からAffinity Designer 2 へ

最初にこの移行は特に意味のあるものでなく、タイミングと好奇心ぐらいのものだ。 サブスクリプションには抵抗のある人たちも存在するようだが、自分はサブスクには恩恵を受けてきたほうだろう。 ただ、解約時期というタイミングがあって、ちょうどその時期…

副作用とはなんなのか! Effect = 作用?

一般的なプログラミングについての副作用とReactでの副作用、シャープに理解しているとは言い難い。 自分用に書いてみた。(このブログはすべて自分用だが) 一般的なプログラミングでの副作用とは、 返り値を返す以外に発生する影響のこと 代入によって変数…

yarnを有効化、インストール

なんとなくいつもnpmしていますが、yarnも。 ネットの記事では、npm i -g yarn等をみかける。 公式サイトだとcorepack enableとあるので、自分はそうしている。 Yarn を管理する推奨される方法は、プロジェクトごとに、Node.js にデフォルトで付属するツール…

vercelのダッシュボードでanalyticsを見ることができた

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

NextjsにReact Spectrumを導入する時の一手間

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

React Spectrumはトランスパイルされると<div>がたくさん

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を配置したとき、なぜかブロックいっぱいの幅で配置されてしまう。センタリングされて配置されているみたいに。 ContextualHelpのあるブロックは<Grid>と<Flex>で囲っているので、justifyContentで制御</flex></grid>…

React Spectrumを少し触っていて。。。

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