Building a Todo app with React.js (2) - Improve Component & Remove Component

在這節，我們要改進Components，並刪除項目。讓使用者可以刪除項目和當項目項目已經完成，項目的復選框可以被標記。

Building a Todo app with React.js

這是我首次嘗試用React-JS建立一個待辦事項應用。React-JS是一個JavaScript庫，用於構建用戶界面，主要是因為它是由Facebook的建立。我們將學習如何使用。

讓我們開始.您可以按照從GitHub庫的步驟本教程

1. ##Demo
2. ##Download
3. ##Practice

Building a Todo app with React.js (5) - sort item

下一步是允许用户使用拖放来改变ToDoListItem的序列（ DND）

我们将允许用户进行排序使用拖放一个数组。我们首先创建li元素。

var placeholder = document.createElement("li");
    placeholder.className = "placeholder";

Building a Todo app with React.js (4) - Multiple Todos

下一步将是添加多个待办事项的能力。例如，我们可能有仅用于grocey列出清单，其他的可能是计划的博客文章列表或的事情要做今天的名单。这就是为什么有在不同的列表中的待办事项进行排序能力是很重要的。

- TODO CATELOG FORM
- TODO CATELOG

Building a Todo app with React.js (3) - Adding Filters for Search and showing complete/incompleted tasks

如果我们有很多待办事项，很难通过它们进行搜索，并找到一个特定的待办事项。它也变得更容易看到所有的完成，未完成任务的一次。

- TODO APP
    - TODO BANNER
    - **TODO FILTER**
    - TODO FORM
    - TODO LIST
        - TODO LIST ITEM #1
        - TODO LIST ITEM #2
        ...
        - TODO LIST ITEM #n

Building a Todo app with React.js (2) - Improve Component & Remove Component

在这节，我们要改进Components，并删除项目。让使用者可以删除项目和当项目项目已经完成，项目的复选框可以被标记。

Building a Todo app with React.js

这是我首次尝试用React-JS建立一个待办事项应用。React-JS是一个JavaScript库，用于构建用户界面，主要是因为它是由Facebook的建立。我们将学习如何使用。

让我们开始.您可以按照从GitHub库的步骤本教程

1. ##Demo
2. ##Download
3. ##Practice

Building a Todo app with React.js (5) - sort item

The next step is to allows users to change the sequence of ToDoListItem using drag and drop (DnD)

We will allow user to sort an array using drag and drop. We create li element first.

var placeholder = document.createElement("li");
    placeholder.className = "placeholder";

Building a Todo app with React.js (4) - Multiple Todos

The next step will be the ability to add multiple todos. For example we might have a list that is used only for grocey lists, the other might be a list of planned blog posts or a list of the things to do todays. That’s why it’s important to have ability to sort the todos in different lists.

- TODO CATELOG FORM
- TODO CATELOG

Building a Todo app with React.js (3) - Adding Filters for Search and showing complete/incompleted tasks

If we have a lot of todos, it becomes difficult to search through them and to find a particular todo. It also becomes easier to see all the completed and incompleted tasks at once.

- TODO APP
    - TODO BANNER
    - TODO FILTER
    - TODO FORM
    - TODO LIST
        - TODO LIST ITEM #1
        - TODO LIST ITEM #2
        ...
        - TODO LIST ITEM #n