실습 - App.css 초기화

• src/App.css

일반 CSS

• 장점 - 익숙하고 간단함
• 단점 - ****클래스 이름 충돌 가능, 전역 스타일링으로 인해 예기치 않은 스타일 변경 발생 가능
• src/components/Card1.css
• src/components/Card1.jsx
• src/components/Card2.css
• src/components/Card2.jsx
• src/App.jsx

CSS Modules

React에서 CSS Modules을 사용하면, 클래스 이름이 고유하게 변환되어 렌더링됩니다. 이는 CSS 클래스 이름의 충돌을 방지하고, 각 컴포넌트의 스타일이 다른 컴포넌트와 겹치지 않도록 하기 위한 것입니다.

• Card1.css → Card1.module.css
• Card2.css → Card2.module.css
• Card1.jsx
• Card2.jsx