스타일링 썸네일형 리스트형 [React] 리액트의 스타일링: CSS 모듈과 스타일드 컴포넌트 리액트로 작업을 할 때, 컴포넌트 단위로 스타일을 적용하고 싶다면 쓸 수 있는 방법이 몇 가지 있다. 여러 라이브러리, 프레임워크 등등... 그 중 기존의 CSS만 알아도 쉽게 사용할 수 있는 CSS 모듈과 스타일드 컴포넌트(styled-components)에 대해 알아보자. 1. CSS Module ✔CSS에서: 파일의 이름을 파일명.module.css의 형식으로 한다. ✔리액트에서: import styles from '파일명.module.css'; 로 불러와 적용한다. ⭕장점: 자체적으로 고유 해시값을 붙인 클래스를 생성해주기 때문에, 동일 프로젝트 내에서 CSS클래스의 이름 중복이 가능 → 따라서 네이밍 규칙이 간소화됨. 🚫단점: CSS파일의 수가 많아져 관리가 번거로워질 수 있음. 예시 코드 /*.. 더보기 이전 1 다음
