sergio-august / tasks-react-redux

Tasks - React/Redux test app

Demo

https://tasksreactapp.surge.sh/

• Login: admin
• Password: 123

Tasks App (Test task)

Functionality:

• Tasks consist of: Username/Email/Text
• The start page is a list of tasks with the ability to sort by Username/Email/Status.
• The output of tasks must be done with pagination by 3 items per page.
• Any visitor (without registration) can see a list of tasks and create new.
• The administrator has the ability to edit the text of the task and mark task as completed.
• Completed tasks in the general list are displayed with the corresponding mark.

Backend description

Approach

State tree

Mockups

Main page (everyone can add task, but not edit)

Login page

Admin page

Editing task (Admin)

How to build/run from sources

npm start # Runs the app in the development mode on localhost:3000

npm run build # Builds for production

Todo

• Rewrite with Material-UI
• Try some another Redux pattern

Tech/framework used

• React
• React Hooks
• Redux
• Redux-Thunk
• Redux-Form

Credits

• Pagination in ReactJS by Agoi Abel
• The best way to architect your Redux app by Lusan Das
• Redux FAQ: Code Structure
• React and Redux Design Patterns @learnhowtoprogram.com

License

MIT © Sergio Gromov