# Props

yunsungyang-omc

개념적으로 컴포넌트는 JavaScript 함수와 유사하다. "props"라고 하는 임의의 입력을 받은 후, 화면에 어떻게 표시되는지를 나타내는 React 엘리먼트를 반환한다.

wiostz98kr

컴포넌트를 통해 UI를 재사용 가능한 개별적인 여러 조각으로 나눌 수 있고, 개념적으로 JavaScript 함수와 유사하다. props라고 하는 임의의 입력을 받은 후, 화면에 어떻게 표시되는지를 기술하는 React Element를 반환한다. 이는 함수 컴포넌트와 클

jaemin_0820

Props상위 컴포넌트가 하위 컴포넌트에게 내려주는 데이터React의 Data flow는 단방향 형식으로 부모에서 자식으로 이동props에 있는 데이터들은 수정이 불가능, 오직 안에 있는 값을 꺼내서 사용(읽기전용)위의 코드를 보면 element에 Welcome을 담고

sammy1101

오늘은 map 함수 적용시 key props를 부여하는 이유에 대해 알아보겠습니다.제가 직접 작성한 코드와 함께 리스트와 key 부분에 대해 소개하는 리액트 공식문서를 보면서 이해되지 않았던 부분들에 대해 다뤄보려합니다.map함수를 이용하여 댓글을 보여주는 Commen

ljo094822

we code 리액트 미션 5를 수행하기 이전에 미션 4를 진행하면서 map에 대해 잘 모르고 있다고 생각하였고 미션 5를 진행하면서 map에의 활용 법에 대해서도 다시한번 생각해 보는 계기가 되었다.

dev_tuktack

컴포넌트가 속성을 설정할 때 사용하는 요소. props 값은 해당 컴포넌트를 불러와 사용하는 부모 컴포넌트에서 설정 할 수 있다.이제 name은 무조건 문자열(String) 형태로 전달 해야 된다. 만약 지정 타입과 다른 타입으로 보낸다면, 화면에서 데이터 확인은 할

dev_tuktack

ES6의 비구조화 할당문법을 사용해, 내부값을 바로 추출하는 방법. props 값을 조회 할 때마다, props.[변수].. 이런식으로 키워드를 앞에 붙여주는 방식보다 편리하게 값조회가 가능함. > 함수의 파라미터가 객체라면 그 값을 비구조화해서 사용. 구조 분해 문

ljo094822

react 를 사용하기 위해 먼저 import를 사용합니다. 위 코드와 아래 코드 뜻은 같습니다.

choie0423

properties를 줄인 표현으로 컴포넌트의 속성을 설정할 때 사용하는 요소. props 값은 해당 컴포넌트를 불러와 사용하는 부모 컴포넌트에서 설정할 수 있다.arrayOf(다른 PropType) : 특정 PropType으로 이루어진 배열 (ex arrayOf(Pr

leehangeul

React

gojaegaebal

리액트에서 컴퍼넌트는 함수 컴퍼넌트와 클래스 컴퍼넌트로 나눌 수 있다.말 그대로 함수와 클래스로 컴퍼넌트를 각각 나타내는 것이다.컴퍼넌트의 이름은 항상 대문자로 시작해야 한다. 이유는 아래와 같다. (출처 : 리액트 공식페이지)정적인 Component 관리 가능(16.

jungjh123456

리엑트에서 배열을 렌더링 했을때 어떤 요소에 변동이 있을때 key를 사용한다. key또는 index를 넣어도 돼는데 index를 넣는 방는데 index를 넣는 방식은 선호하지 않는다.key는 React가 어떤 항목을 변경 추가 또는 삭제할지 식별하는 것을 돕는다. 성능

dev_hikun

2021-03-16. 문제가 됐던 상황이 있었다. useEffect vs useLayoutEffect의 문제인줄 알았으나 state에 의해 렌더가 되는 것이어서, React.memo를 사용하여 해결하였는데...

poohv7

몬스터 과제에 대한 내용을 벨로깅 해보겠다.

poohv7

어쩌저찌 위코드 4주차가 되었고 인스타그램 클론도 마무리 단계에 접어들었다. 따로 추가기능들을 구현할 예정이지만 공식적으로는 마무리가 되었기에 간단한 리뷰를 남기도록 하겠다. 코드리뷰 후 부족한 코드들은 보충을 하고, 잘못된 코드들도 수정을 하였고 scss 네스팅도 완

poohv7

Mock data?실제 API 에서 받아온 데이터가 아닌 프론트앤드 개발자가 필요에 의해 샘플로 만들어본 데이터mock data 를 만들어 데이터가 들어오는 상황을 미리 대비하고 UI 가 기획에 맞게 구현 되는지 확인Backend 와의 소통 - 주고 받는 데이터가 어떤

damho0514

위스타그램 메인 댓글 부분 구현을 해 왔다.. 많은 과정들과 힘듬이 있었지만 나만의 블로그로 정리를 다시 해봐야겠다.댓글 추가댓글 삭제

poohv7

map 함수에 대한 이해가 부족하다 보니, 코드를 완전히 이해하는데 시간이 걸렸던.. 미션... 하고나서 보니 막상 코드는 몇 줄 안되는데 왤케 머리를 싸매고 고민한건지 ㅠㅠ주석으로 참고 내용을 써놓긴 했지만 한번 더 봐보자면, 일단 댓글이 어떤 식으로 달릴지를 생각해

poohv7

React 과제에 대해 잠깐 정리를 해보려고 한다.로그인 ID 와 PW 입력창에 입력을 했을 때, 그 값을 state에 저장하는 것이 첫 번째 미션.일단 id 와 password 현재 값들은 state에 저장하기 위해서 state를 지정해준다. 아래 40번 라인을 보면