Todo-list

creating todo list by React, todo demo

In addition: Counter todo ...

Todo App functionality

• correct deploy on github pages
• check deepcode https://www.deepcode.ai/app/gh/julia-dizhak/react-blog-posts/4dc7a5c701378274d0f4e5a2f68795771d80b614/_/javascript%2Feslint%2Fno-unused-vars/dashboard/
• displaying todo itmes
• adding todo items on the submit
• check if todo is empty and display error message
• removing items
• animating items as they are added or removed
• styling

Todo for Todo-list app:

• concat instead shift or object assign?
• loading when js, https://jsonplaceholder.typicode.com/todos
• ask about deploy
• catch error
• migrate to state and show how many tasks now in DisplayCounter
• new challenge: operation +, -, ... (add multiple, division)
• move file to utils
• action.type

Todo Users:

• add action USER_LIST_FAILED

Counter

• desc ...

Technologies

• animation by FlipMove

Menu by react-motion

• animating property value changes;
• synchronizing animations on a timeline;
• staggering animations across a range of elements;
• animate an element before it appears, or animate it before it gets removed;
• animate an element across views/routes;
• the spring function takes care of interpolating values from a starting point to an ending point;

Redux

• difference between actions and dispatches

Working with external data

• app makes a request for some data to a remote service;
• the remote service recieves the request and sends some data back;
• app receives the data;
• app formats and displays data to the user;

Tests with Jest

• yarn test
• should write tests first
• test immutability of state
• react-test-renderer
• enzyme
• toMatchSnapshot