컴포넌트2 [React] Prop(속성)으로 컴포넌트 재사용 Props컴포넌트의 주요 장점 중 하나는 재사용이 가능하다는 것이다.재사용 가능한 컴포넌트를 사용할 때마다 다른 데이터를 전달하고자 할 때 props가 사용된다.커스텀 컴포넌트는 커스텀 props을 추가할 수 있다.title, description, image들은 커스텀 속성으로 리액트에선 이걸 props라고 부른다.props의 값으로 스트링, 숫자, 객체, 배열 등 모든 형태를 전달할 수 있다. Props 사용하기일반 자바스크립트 함수에서 입력값을 받아 사용하려면 한 개 이상의 매개변수를 추가하면 된다.function fnName(param1, param2) {} 리액트도 비슷하지만 일반적으로 props라고 불리는 하나의 매개변수만 사용한다.function CompName(props) {} 커스텀 .. 2024. 7. 5. [React] JSX와 리액트 컴포넌트 JSXJavaScript Syntax Extension 자바스크립트 문법 확장자HTML 마크업 코드를 작성하여 HTML 요소를 설명하고 생성할 수 있게 한다.리액트는 UI 전체와 부분을 설명하고 생성하기 위한 것이므로 JSX가 리액트 컴포넌트로 사용된다하지만 브라우저는 JSX를 읽을 수 없다.리액트 프로젝트에서는 개발 서버가 실행되면 리액트 빌드 프로세스가 브라우저에서 사용 가능한 코드로 변환한다..jsx 대신 .js만 사용하는 리액트 프로젝트로 있다.빌드 프로세스가 .js 파일 안에서도 JSX 코드를 찾을 수 있기 때문이다.리액트에서 컴포넌트로 인식되기 위한 두 가지 규칙이 있다.함수 제목이 대문자로 시작되어야 함함수에서 렌더링 가능한 값이 반환되어야 함 컴포넌트 생성function Haeader() .. 2024. 7. 5. 이전 1 다음 반응형