component2 React 컴포넌트(Component), 화살표 함수, Snippet 목차클래스형 컴포넌트 컴포넌트를 선언하는 방식 2가지 1. 함수 컴포넌트import "./App.css";function App() { const name = "리액트"; return ( {name} );}export default App; 장점선언하기 편리하다메모리 자원을 덜 사용한다최종 배포 후에도 파일 크기가 더 작다(근소한 차이. 성능과 크기면에서 큰 차이는 없음)단점state와 라이플사이클 API의 사용이 불가능하다 => v16.8이후 Hooks 라는 기능이 도입되며 해결됨리액트 공식 메뉴얼에는 함수 컴포넌트와 Hooks의 사용을 권장함 2. 클래스형 컴포넌트import { Component } from "react";class App extends Component.. 개발새발개발/React 2024. 12. 24. React로 간단한 홈페이지 만들기3(Component) 오늘할 것 :상세페이지 영역 만들기 Componentdiv가 많아지면 지저분해짐이를 개선하기 위해 component를 사용함App()도 사실은 컴포넌트임 Component 만드는 방법1function 생성function App(){} 밖에 만들어야 함함수명은 영어 대문자로 시작return() 안에 html 축약할 담기 쓰기 컴포넌트를 사용하면 좋은 상황반복적인 html 축약할 때큰 페이지로 전환할 때자주 변경되는 UI 컴포넌트 사용 시 주의사항state 가져올 때 주의state는 다른 함수에서 저장되어 있기 때문에 데이터바인딩이 안됨 컴포넌트 만드는 법2(참고)function 함수 밖에 변수 선언 let Modal = () => { return( ) } 참고1굳이 하나의.. 개발새발개발/React 2024. 12. 21. 이전 1 다음
