10.1 프로젝트 준비하기

    10.1.1 프로젝트 생성 및 필요한 라이브러리 설치

    create-react-app을 사용하여 프로젝트를 생성하세요.

    $ yarn create react-app todo-app

    프로젝트가 생성되면 todo-app 디렉터리로 들어가서 yarn을 사용하여 필요한 라이브러리를 설치하세요.

    $ cd todo-app
    $ yarn add node-sass classnames react-icons

    이 프로젝트에서 Sass를 사용할 예정이므로 node-sass를 설치해 주었습니다. classnames는 나중에 조건부 스타일링을 좀 더 편하게 하기 위해 설치했습니다. react-icons는 리액트에서 다양하고 예쁜 아이콘을 사용할 수 있는 라이브러리입니다. 아이콘 리스트와 사용법은 https://react-icons.netlify.com/에서 확인할 수 있습니다. 이 라이브러리의 장점은 SVG 형태로 이루어진 아이콘을 리액트 컴포넌트처럼 매우 쉽게 사용할 수 있다는 것입니다. 아이콘의 크기나 색상은 props 혹은 CSS 스타일로 변경하여 사용할 수 있습니다.

    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.