리액트 컴포넌트 스타일링하기
이번에는 리액트 컴포넌트를 스타일링하는 방법에 대해서 알아보도록 하겠습니다. 리액트에서 컴포넌트를 스타일링 할 때에는 다양한 기술이 사용될 수 있습니다.
리액트에서 컴포넌트를 스타일링 하는 가장 기본적인 방법은 css 파일을 만들어서 컴포넌트에서 import
해서 사용하는 것 입니다. 이 방법은 어떤 사람들에게는 충분히 편리할 수도 있겠지만, 컴포넌트를 스타일링 할 때 다른 도구들을 사용하면 훨씬 더 편하게 작업을 할 수 있습니다.
이 튜토리얼에서는 리액트 프로젝트에서 컴포넌트를 스타일링 할 때 자주 사용되는 다음 기술들에 대하여 다뤄보게 됩니다.
- Sass
- CSS Module
- styled-components
위 기술들을 다뤄보게 되면서, 단순히 사용법만 알아보는걸 떠나서 나중에 여러분들이 실무를 다루게 될 때에도 충분히 도움이 될 수 있는 재사용성이 높은 버튼을 만드는 방법, 커스텀 체크 박스를 만드는 방법, 그리고 모달을 만드는 방법을 알아보겠습니다.