プロジェクト名 [useAxiosViaRedux]

プロジェクト概要 このプロジェクトは、React、Axios、Redux、JSON Server を使用したサンプルアプリケーションです。JSON Server をバックエンドとして使用し、Axios を通じてデータを取得・更新します。Redux を使用してアプリケーションの状態を管理します。

使用技術
React
Axios
@reduxjs/toolkit
JSON Server
動作環境
Node.js (バージョン 14 以降推奨)
npm
インストール手順
リポジトリをクローンします。

git clone [リポジトリの URL]

プロジェクトのディレクトリに移動します。

cd [プロジェクトのディレクトリ名]

依存関係をインストールします。

npm install
# または
yarn install

JSON Server を起動します。

npm run server
# または
yarn server

アプリケーションを起動します。

npm start
# または
yarn start

ブラウザで http://localhost:3000 にアクセスします。

JSON Server の設定 JSON Server は restData.json ファイルを使用してデータを管理します。必要に応じて restData.json ファイルを編集してください。

Redux の構成 Redux の状態管理は src/store ディレクトリにあります。

store/slicer.ts: リデューサー store/.indexts: ストアの設定 Axios の設定 Axios は src/api.js ファイルで設定されています。

ディレクトリ構成
[プロジェクトのディレクトリ]
├── public/
│   └── index.html
├── src/
│   ├── components/
│   │   └── [コンポーネント]
│   ├── redux/
│   │   ├── actions.js
│   │   ├── reducers.js
│   │   └── store.js
│   ├── api.js
│   ├── App.js
│   └── index.js
├── db.json
├── package.json
└── README.md

今後の課題
[課題 1]
[課題 2]
[課題 3]

編集者
[RyuHazako]