10.2.3 TodoListItem과 TodoList 만들기

이제 일정 관리 항목이 보일 TodoListItem과 TodoList를 만들 차례입니다.

먼저 TodoListItem 컴포넌트부터 만들어 봅시다. components 디렉터리에 TodoListItem.js와 TodoListItem.scss를 생성하세요.

그다음에는 TodoListItem.js를 다음과 같이 작성해 보세요.

TodoListItem.js

import React from 'react';
import {
  MdCheckBoxOutlineBlank,
  MdCheckBox,
  MdRemoveCircleOutline,
} from 'react-icons/md';
import './TodoListItem.scss';
 
const TodoListItem = () => {
  return (
    <div className="TodoListItem">
      <div className="checkbox">
        <MdCheckBoxOutlineBlank />
        <div className="text">할 일</div>
      </div>
      <div className="remove">
        <MdRemoveCircleOutline />
      </div>
    </div>
  );
};
 
export default TodoListItem;

---