NYchicken's blog ;

Component 란? 컴포넌트는 html 을 반환하는 함수이다. UI 를 기능별로 여러 조각으로 나눠 사용할 수 있게한다. 앱의 일부를 렌더링 하는 재사용 가능한 모듈이라고 할 수 있다. Component 선언하기 컴포넌트는 항상 대문자로 시작해야한다. function Hello(){ return hello, this is React! } React 는 파스칼-케이스(pascal-case) 변수 이름을 사용한다. 정규 Html 태그가 아니라는 것을 명시하기 위해서다. 1. 간단한 컴포넌트 예시입니다. function App() { return ( This is title. Hello! This is content area. ); } 2. 같은 JS 파일에서 컴포넌트를 작성했을 시 function App..

state 란? 리엑트에서 state 란 내부에서 동작하는 모든 동적 데이터, 혹은 동적인 상태를 뜻한다. 컴포넌트를 내부적으로 상태 관리할때 사용한다. 리엑트의 state는 정보를 클라이언트 단에 일시적으로 저장하기 위해 만들어졌다. 상태 기반은 event trigger 를 기본으로 동작한다. 데이터를 변화시키는게 아니라, 데이터를 state로 취한 후 새로운 객체(state) 를 반환해 새로운 데이터의 상태를 얻는 개념이라고 볼 수 있다. state 자체는 Object 이며 변수나 데이터를 담을 수 있다! 그리고 이 state 에 들어간 데이터는 변경될 수 있다. state 선언하기 // let [작명(=데이터를 담고있음), 작명(=state의 변경을 도와주는 함수)] = useState(보관할 자료..

React 공식 문서를 공부하며 작성하게 되었다. 모든 예제의 컴포넌트는 신문법인 function 으로 작성될 예정이다. (공식 홈페이지에서도 권장함!) 물론 function 과 class의 기능적 차이는 크지 않다. 하지만 useState 같은 Hook을 자주 사용하게 된다면 function 에 유용한 기능이 더 많고, LIfecycle Hook을 더 자세하게 쓰고 싶다면 class 컴포넌트를 사용하면 된다. 참고하시길 ^v^! 1. JSX 란? const element = Hello, world!; 이 문법은 문자열도 아니고, HTML 도 아니다. Javascript 를 확장한 문법으로, Javascript 안에서 HTML 문법을 사용해 View 를 구성 할 수 있게 하는 자바스크립트 문법이다. 사용..