This app lets you:
- Create tasks
- Read tasks
- Update tasks
- Delete tasks
Different versions avaialble with respective branch names:
- master: Latest version
- tanstack-query: Implementation of Tanstack Query (React Query) with JSON Server
- jotai: Implementation of Jotai as the state manager
- zustand: Implementation of Zustand as the state manager
- context-api: original version using react context API
- Simple form input
- Simple list that display entered tasks
- Data stored in
JSON Server
- A button to delete all tasks
- A button to edit task
- A button to delete each task
- A button to toggle task as completed
- In the console: run command
npm run front-and-back
- ReactJS
- SCSS
- TypeScript
- Jotai: Frontend State Management
- Tanstack Query: Backend Data Interaction
- JSON Server
- React Icons
"dependencies": {
"@tanstack/query-core": "^5.7.2",
"@tanstack/react-query": "^5.7.2",
"axios": "^1.6.0",
"jotai": "^2.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-icons": "^4.10.1",
"uuid": "^9.0.0"
},
"devDependencies": {
"@types/react": "^18.2.15",
"@types/react-dom": "^18.2.7",
"@types/uuid": "^9.0.2",
"@typescript-eslint/eslint-plugin": "^6.0.0",
"@typescript-eslint/parser": "^6.0.0",
"@vitejs/plugin-react": "^4.0.3",
"concurrently": "^8.2.2",
"eslint": "^8.45.0",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.3",
"sass": "^1.65.1",
"typescript": "^5.0.2",
"vite": "^4.4.5"
}