본문 바로가기
반응형

리액트6

[REACT] Components Import & Export - 공식 문서랑 같이 공부하기 시리즈2 -목차- [1] ROOT Component란? [2] 컴포넌트 Export & Import 하기 [3] 같은 파일에서 컴포넌트 여러 개를 Export & Import 하기 Root Component란 개인 환경마다 다르겠지만, 보통 Root Component는 App.js 파일이다. create-react-app으로 실행할 경우 앱이 실행되는 지점은 App.js라고 보면 된다. 만약에 Next.js처럼 파일 기반으로 라우팅하는 경우라면 페이지별로 root 컴포넌트가 다를 수 있다. (Next.js를 안 써봐서 정확하게 와닿지는 않는다.) function Profile() { return ( ); } export default function Gallery() { return ( Amazing scient.. 2023. 11. 14.
[REACT] Components - 공식 문서랑 같이 공부하기 시리즈1 컴포넌트 컴포넌트는 리액트의 핵심 개념 중 하나이다. HTML에서는 markup이 웹의 UI를 구성한다. 리액트는 markup과 css, javascript를 컴포넌트로 결합하여 '재사용가능'한 UI 요소를 만든다고 생각하면 된다. (markup은 , 과 같은 것을 이야기한다.) 컴포넌트를 구성하는 방법 export default function Profile() { return ( ) } 1. 컴포넌트를 Export 한다. (내보내기) - 이 부분으로 인해 다른 파일에서 내보낸 function을 import할 수 있게 해주는 것이다. 2. function을 정의한다. - function Profile() { } 이 부분에서 Profile이라는 이름을 정해준다. 이때 이름을 대문자로 쓰지 않으면 작동하지.. 2023. 11. 14.
728x90
반응형