컴포넌트

Web Programming/React.js

#React 컴포넌트 따로 분리하기!

이때동안 컴포넌트를 App.js 이라는 같은 파일에 다 넣어 놨었다. 하지만 글자수가 많아지면서 눈도 아파 질터이니 따로 분리하도록 한다 그편이 먼 미래에 유지보수도 좋아지기 때문이다 지금부터 이 컴포넌트를 옮겨 보도록 한다 일단 component라는 폴더를 생성하고 그안에다가 따로 격리 시키도록 하자 옮기고 싶은 컴포넌트의 이름과, 동일하게 JavaScript 파일을 생성한다 그리고 간단하게 복붙하였다 근데 const 다음의 함수명이 뭔가 심상치 않다. 아파보이기때문에 문제가 있을 것이다 그리고 App.js에 가봐도, TestComponent가 피가 흐르고 있는 것을 볼 수 있다 그이유는 App.js에는 더이상 TestComponent라는 것이 없기때문이다. 그러므로 import를 하도록 하자 impo..

Web Programming/React.js

#React 새로운 Component만들기

React는 Component기반이기 때문에 Component단위로 만들지 않으면 의미가 없다고 한다. 그러기 때문에 이번엔 Component를 배워본다 컴포넌트를 만들기 위해서, 기존에 있는 코드 중에 를 추가 하였다. 근데 피가 흘리게 된다. 왜냐하면 함수를 작성하지 않았기 때문이다 * React에서 컴포넌트를 만들 땐 무조건 반드시 맨 앞에 문자는 대문자를 하도록 하자 ex ) Createcomponent, TestComponent, Rrrrrr etc.. const TestComponent = () => { return ( 안녕 난 Component야 반가워 ) } 이런 식으로 추가하면, 아까 피가 흐르던걸 지혈할 수가 있다 그러면 이렇게 컴포넌트를 분리시켰고, 화면에 나타나게 해 보았다! 다음엔..

INICO
'컴포넌트' 태그의 글 목록