React9 css 적용하기 1. 인라인스타일로 적용 css 속성은 객체로 작성 대쉬바가 필요한 속성 ( ex : border-right ) 은 카멜케이스로 작성 숫자는 따옴표 필요 없이 그냥 작성 2.스타일시트로 작성 별도의 css 파일을 만든 후 불러오기 3. CSS Module css 가 중첩되는걸 방지하기 위해 사용 Box.module.css .Box { background: black; color: white; padding: 2rem; } Box.js import React from "react"; import styles from "./Box.module.css"; function Box() { return {styles.Box}; } export default Box; className 설정시에는 {styles. cs.. 2021. 7. 18. props state https://studyingych.tistory.com/52 React Props, State 이해 및 사용법 Props / State props 와 state는 React에서 데이터를 사용할 때 다루는 개념이다. 실습 코드샌드박스(https://codesandbox.io/s/dank-pond-pfyvq) 를 사용하여 실습 Props props는 부모 컴포넌트가 자식 컴포넌트.. studyingych.tistory.com props : 부모 컴포넌트가 자식 컴포넌트에 값을 전달할 때 사용 state : 컴포넌트가 가지고 있는 데이터 (setState로 변경가능) 2021. 6. 23. 5. Component(코딩애플) 어떤걸 Component로 만드는게 좋을까? 반복출현하는 HTML 덩얼이들 자주 변경되는 HTML UI들 1. 한 페이지 내에서 생성 function 컴포넌트이름() { return( 원하는 HTML담기 ) } . . . 필요한 곳 가서 or 넣기 Component 유의사항 이름은 대괄호 return() 안에 있는건 태그 하나로 묶어야함 (형제태그x) -정 여러태그 써야한다면 function 컴포넌트이름() { return( // 로 감싸기 ) } 2021. 6. 22. 4. 이벤트 리스너(핸들러)장착하는 법(코딩애플) 1. html 태그에 onClick {console.log(1) } } icon //span태그 속 아이콘을 누르면 1이 출력이 된다. 2.state 지정 2021. 6. 21. 이전 1 2 3 다음
