[React.js] static page last

강의를 듣다 보면 유료 결제해야 가능하다고 하는 과제들이 있는데 상단 부분에 x(skip) 버튼을 누르면 강의는 계속 진행되기 때문에 스스로 해보고 스킵을 눌러 정답을 보면 문제없이 강의를 들을 수 있습니다.

React component?

React element를 렌더링 하는 class 또는 function입니다. 과거에는 class를 사용해서 만들었지만 현재는 function을 사용해서 만듭니다.

 

Fragments

React component는 하나의 element만을 반환해야 하기 때문에 여러 html 요소들을 묶어서 반환해야 합니다. 이때 div나 어떤 태그를 사용해서 감싸게 되면 실제 html에 필요 없는 요소들이 많아질 것입니다. 이를 대체하기 위해서 사용됩니다.

[React] Fragment

 

Parent, Child

컴포넌트는 내부에 또 다른 컴포넌트를 사용할 수 있습니다. 이때 외부에 있는 컴포넌트를 Parent, 내부에 있는 컴포넌트를 Child라고 부릅니다.

 

HTML tag property

React에서는 몇몇 html 태그 속성을 다른 이름으로 사용합니다. 예를 들어 class의 경우 className, for은 htmlFor입니다.

 

또한 style의 경우에는 기존에는 문자열로 전달하는 것과 다르게 객체로 전달하고, 스타일 속성의 이름을 kebab-case가 아닌 camelCase로 작성합니다.

 

project1 reactfacts

강의에서 원하는 디자인에 맞게 프로젝트를 진행합니다.

 

margin-block은 block의 상하 margin을 컨트롤할 수 있는 CSS 속성

 

참고

https://developer.mozilla.org/en-US/docs/Web/CSS/margin-block

https://scrimba.com/learn-react-c0e