React 디자인 입히기

module.css

https://velog.io/@kwonh/React-CSS를-작성하는-방법들-css-module-sass-css-in-js

css 파일의 이름을 ComponenetName.module.css 로 작성

컴포넌트에서 import 하고, 클래스를 객체처럼 사용

ex.

/* Button.module.css */
.button {
	 background-color: blue;
	 color: white;
	 padding: 10px;
	 border: none;
	 border-radius: 5px;
	 cursor: pointer;
}

// Button.js
import styles from './Button.module.css';

// CSS 모듈을 불러오기
function Button() {
	 return <button className={styles.button}>Click Me</button>;
}

export default Button;

✳️ 디자인프레임워크 소개

1. bootstrap

Buttons

• table, button
• bootstrap 디자인 설정