Click here to preview.
This is a responsive todo list app made using typescript with drag and drop functionality for the todo tasks. It uses local storage to cache the todolist in the users machine.
Leasons Learned:
- Learned to use Typescript with React Functional Components
- Responsive Design using Media Queries
- Drag and Drop interface using 'react-beautiful-dnd' library
- Use of Create-React-App with Typescript
- Use of UseEffect Hook as a data synchronization function instead of a life cycle function
- Use of callbacks to access previous values of states in setState function
- Use of Refs for refrencing html elements
- Learned how to properly manipulate arrays from react beta docs
- Learned how to properly perform condition rendering from react beta docs
- Learned to Rebase and Squash Commits in GIT
Note: remove strict mode when running in developement server as it messes up with DND package. No Longer valid continue reading for info. This issue has been fixed, Installed another version of package to fix the issue