I am trying to learn the react and I have built and small TODO application which allows you to add and delete TODOS and it interacts with REST server.
I am using Redux for handling state and thunk as middleware to interact with rest API.
The code is working, however, at this point I have no idea how to make it better.
I have the following structure:
src ├── App.css ├── App.js ├── App.test.js ├── actions │ ├── add_todo_actions.js │ ├── delete_todo_actions.js │ ├── dialog_actions.js │ └── list_todo_actions.js ├── components │ ├── add_todo_dialog.js │ └── todo_list.js ├── containers │ ├── add_todo_container.js │ └── todo_list_container.js ├── index.css ├── index.js ├── reducers │ └── index.js └── serviceWorker.js
I won't be able to show the whole code here, however, if you guys won't mind I have put that https://github.com/Gaurang033/docker-compose/tree/with_redux_modularize_actions/web/src
My questions are:
- I have only two components one for Add button (with modal dialog) and another for listing todos. Should I divide them into another smaller components?
- Should I create different reducers for corresponding actions or components?