Props 2

[React] Props의 개념과 사용법

프로퍼티(Props)란 ? 프로퍼티는 props(properties의 줄임말)로, 상위 컴포넌트가 하위 컴포넌트에 값을 전달할때 사용합니다.(단방향 데이터 흐름) 프로퍼티에 문자열을 전달할 때는 큰따옴표(" ")를, 문자열 외의 값을 전달할 때는 중괄호{ }를 사용합니다. 그리고 true와 false와 같은 Boolean 자료형의 경우, 중괄호로 감싸서 전달할 필요 없이 프로퍼티의 이름만 선언하면 됩니다. 이전에 Component 게시물에서도 언급했듯, props는 읽기 전용이기 때문에 하위 컴포넌트에서는 상위 컴포넌트의 프로퍼티를 수정할 수 없습니다. ⭐️⭐️⭐️ import React, { Component } from 'react'; import Header from './component/Head..

React 2023.02.07

[React] Components의 종류(선언형/클래스형) 및 사용법

Component 란 ? 리액트로 만들어진 앱을 이루는 최소한의 단위로, 데이터(props)를 입력받아 View(state) 상태에 따라 DOM Node를 출력하는 함수 또는 클래스 👉🏻 'props'라고 하는 인자를 받은 후, 화면에 어떻게 표시되는지를 기술하는 React Element를 반환 기존의 웹 프레임워크는 MVC방식으로 분리하여 관리하여 각 요소의 의존성이 높아 재활용이 어렵다는 단점이 있었습니다. 반면 컴포넌트는 MVC의 뷰를 독립적으로 구성하여 재사용을 할 수 있고 이를 통해 새로운 컴포넌트를 쉽게 만들 수 있습니다. React에서는 소문자로 시작하는 컴포넌트를 DOM 태그로 인식하기 때문에 컴포넌트 이름은 항상 대문자로 시작해야 합니다 ⭐️⭐️ Components let you spli..

React 2023.02.07