오늘부터 리액트 입문 부분으로 넘어간다
현재 1주차 반정도를 듣고 있는데 component, props, state의 개념을 알려줬다!
근데!
다행히도!
vue수업을 들어 본적이 있어서 수월하게 공부하고 있다:)
1-9까지 수강했는데, 너무 급하게 공부하면 체할 듯 싶어서 오늘은 1-9까지 강의를 수강하고 2일 동안 16까지 들으면 좋겠다! 정도의 계획을 세웠다.
이마에 빵꾸나서.. 병원도 꾸준히 가야하니까... 급하게 모든 것을 해결하지 않기로..ㅎㅡㅎ...ㅜㅜ
아무튼 강의를 들으면서 적은 용어나 개념에 대해 간단하게 적어두었다.
렌더링
html이나 리액트의 코드를 눈으로 볼 수 있도록 그려주는 것이 렌더링이다.
jsx
html 문법을 자바스크립트 코드 내부에 쓴 것으로 빌드시 바벨에 의해 자바스크립트로 변환된다고 한다.
jsx 사용시 주의해야할 점은 태그는 항상 닫혀있어야하며 형제 요소는 작성할 수 없으며 반드시 div태그로 감싸여 있어야한다.
component
레고블럭으로 비교해보자면 하나의 컴포넌트(레고 블럭)들을 모두 합쳐 하나의 페이지를 완성할 수 있는 것 이라고 한다.
컴포넌트를 잘게 쪼개면 재사용이 가능하기 때문에 많은 부분에서 재사용할 수 있는 부분이라면 컴포넌트화하는 것이 좋다.
props
자식 컴포넌트가 부모 컴포넌트에서 전달받은 데이터를 의미하며, 다른 언어로 선언해서 쓸 수 있지만 전달을 위해 보통은 props로 선언한다.
또한 props는 자식>자식에게 데이터를 전달할 수 없으며 수정 역시 불가하다.
state
state는 useState를 사용한다.
여기서 const나 let을 사용하지 않는 이유는 lifeCycle에 따라 값이 변했을 때 변화된 값을 리렌더링을 하는 조건이 state값이 변경되었을 때 이기 때문이다.
할당은 가능하지만 변경된 값이 화면에 바로 반영되지 않기 때문에 state를 사용한다.
useState는 리액트에서만 제공하는 그리고 리액트에서만 존재하는 개념, 기능이다.
그리고 기능은 hook이라고 부를 수 있다.
궁금증과 결론
vue에서는 컴포넌트들을 mixin으로 섞을 수도 있었는데 리액트는 가능할지...?잘 모르겠음
은 검색해보고 왔는데 맨 앞줄이 mixin은 해롭다 여서 어... ? 상태가 되었다.
만약 배우게 되도 차차 배우게 되겠지... 싶은 개념이다.
그리고 lifecycle(특: 이게 이해하기 제일 어려웠음 솔직히 지금도 이해못한 것 같음...)의 개념은 같이 사용하는 것으로 보인다
그래서...쬑금... 슬퍼졌다...
아직은 기본만 보느라 가져가는 부분들이 비슷비슷한 것같은데 vue의 html/css/js영역분리 라던가 제공해주는 것만 사용한다는 점 빼면 거진 비슷할지 않을지... 라는 생각이 들어서 조금은 두근두근해졌다.
공부하는 내내 틈틈히 코테와 js 심화 강의를 듣는다면 리액트하면서 덜막히겠지?? 싶다.
