choekko / rxjs-todo-list

Todo-List implemented with redux-observable.

TODO-LIST with Rx.js

🗣 It is a todo-list app implemented with redux-observable.

https://rxjs-todo-list.netlify.app/

1. Preview

2. Start on Local

% git clone https://github.com/choekko/rxjs-todo-list.git
% cd rxjs-todo-list
% yarn install
% yarn start

3. How to Use

1. Select task status.
2. Enter task.
3. Click 'SAVE' button to save task.
4. To change status of the created task, drag and drop the task into other space.
5. To delete the task, click 'DELETE' button.

4. Notice

• Created tasks are automatically saved to local storage.
• When entering the page for the first time, tasks stored in the local storage are fetched, and the fetching time is as follows.

  TODO: 0.2s
  DOING: 0.3s
  DONE: 0.4s
  

  At the longest time of 0.4 seconds, all tasks are rendered at once.
  These were implemented for my Rx-js learning.

5. Stack

React.js	Typescript	Rx.js	Redux-Observable	Emotion

6. Folder Structure

src/
ㄴ actions/      // Functions for making Redux Action
ㄴ components/   // Main Components
   ㄴ Component/
     ㄴ vacs/    // View Assets Components
     ㄴ hooks/   // Custom Hooks
ㄴ constants/    // Common Constants
ㄴ epics/        // Epics for Redux-Observable
ㄴ hooks/        // Common hooks
ㄴ pages/        // Page Components
ㄴ reducers/     // Reducers for Redux
ㄴ store/        // Files for configuring Redux Store
ㄴ streams/      // Rx.js Streams
ㄴ styles/       // Files for Setting Emotion and Common Style
ㄴ types/        // Common types
ㄴ utils/        // Common Utils