コピペ用『TypeScriptとReact/Next.jsでつくる 実践Webアプリケーション開発』の環境構築用コマンド

モダンなフロントエンド開発を学びたくて『TypeScriptとReact/Next.jsでつくる 実践Webアプリケーション開発』を購入して学習しているが、環境構築用のコマンドの手打ちが辛かったので、誰かのために残しておきます。

サンプルアプリのソースコードや正誤表は下記サポートページから参照できます。
https://gihyo.jp/book/2022/978-4-297-12916-3/support

やったところまで記述して、適宜追記していきます。

5.2.1

npx create-next-app@latest --ts 
cd nextjs-gihyo-book
npm run dev

5.2.2

npm install styled-components
npm install --save-dev @types/styled-components

5.2.3

npm install --save-dev prettier eslint typescript-eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-config-prettier eslint-plugin-prettier eslint-plugin-react eslint-plugin-react-hooks eslint-plugin-import

npm run lint
npm run format

5.2.4

npx sb init
npm install --save-dev @storybook/addon-postcss tsconfig-paths-webpack-plugin @babel/plugin-proposal-class-properties @babel/plugin-proposal-private-methods @babel/plugin-proposal-private-property-in-object tsconfig-paths-webpack-plugin @mdx-js/react
npm run storybook

5.2.5

npm install react-hook-form

5.2.6

npm install swr

5.2.7

npm install react-content-loader
npm install --save-dev @types/react-content-loader

5.2.8

npm install @mui/material @mui/icons-material @emotion/react @emotion/styled

5.2.9

 npm install --save-dev @testing-library/jest-dom @testing-library/react jest jest-environment-jsdom