A simple and intuitive checklist app made with React.
Tech used: HTML, CSS, JavaScript, React
- Using Styled Components: This is my first time trying out CSS-in-JS, and I used styled components for this app. I liked adding organized styles directly to a React component and being able to change styles based on state/props. For example, different styles were applied to a task based on its completion status.
- Prevent creation of empty tasks
- Make tasks editable
- Put new tasks on the top of the list
- Apply styles based on completion status (e.g. checkmark display, line-through text, lower opacity)
- Save tasks in local storage
- Create media queries for responsiveness
- Display message if there are no tasks
- Implement light/dark mode