KDP(電子出版)のメモ 急急如律令

Amazon Kindleダイレクト・パブリッシングでの電子出版や電子書籍の作成販売について、文章やイラストの作成や編集方法について書いています。

React-Paginateを入れて表示を分割した。

 今やろうとしているのがpaginationで画面の表示数を分割したい。そうしないとページが重たいのでページの読み込みが長くなり評価が落ちる。使いたいのがReact-Paginateなのだが、useEffect, useStateの使い方がよくわからなかった。表示するだけなんで現在のページ数を覚える必要がない。

 基本的な操作はreact-paginateの説明通りにやったが操作が面倒なのでコンポーネントで分割した。詰まったところはどうやってデータを渡したり分割しているのかが触ってコンソールログに表示するまでわからなかった。 zenn.dev

github.com

Gatsbyにもページャーのやり方はあるがこの場合はページを分割するのでなんか違う気がした。

www.gatsbyjs.com

https://www.freecodecamp.org/learn/

freecodecampのreactをやっている。というのも作っているサイトがreactがベースのGatsbyなので覚えないと細かい設定ができない。

freecodecampは日本語ではないが、説明がわかりやすいので問題がない。 最近のサイトはreactで書かれているものが増えているので、使いたいライブラリがreactしかないことが増えている。

stackoverflow.com