개발감성

요약 웹 페이지를 컴포넌트라는 단위로 조각낸다. 페이지 갱신이 필요할 때 바뀌는 컴포넌트들만 쏙쏙 골라서 갱신한다. 22년인 현재까지도 프론트엔드 생태계의 우량아, 쓰는 사람이 많다는 것 다른 이유도 더 많겠지만 리액트 찬양론자는 아니기 때문에 꼭 알아야 할 핵심 내용만을 적어봅니다. 페이스북은 리액트를 왜 만들었을까? 프론트엔드 개발 씬에 SPA, Single Page Application이 생겨난 후에 SPA계에선 Angular, React, Vue 삼대장이 탄생했다. 구글에서 만든 앵귤러는 사실 망해가는 추세, 1인 기업 에반 유가 만든 Vue는 오픈소스의 특징을 강하게 띄고 있으며, 페이스북에서 만든 React가 셋 중 가장 사용자를 많이 보유하고 있는 편이다. 위는 페이스북의 화면인데, 화면의 ..

렌더링, 화면에 변화를 보이다 렌더링 이란 웹 페이지상에서 해당 페이지의 구성요소를 조립하여 사용자에게 보여주는 행동이다. p 태그안에 state.name변수를 나타내도록 하고 버튼을 클릭하면 온클릭 이벤트로 name변수를 new로 변경하도록 해본다. 예상대로라면 name변수가 old에서 new로 변경되니 Hi new의 문장으로 변경되어 표현될 것이다. 하지만 버튼을 아무리 눌러도 name변수는 new로 변경되지만 화면의 old는 변경되지 않는다. SPA를 위한 React의 렌더링은 임의의 상태가 변화할 때 Re-rendering을 하여 변동사항을 갱신하여 보여준다. 분명 클릭이벤트로 인해 name변수는 new로 변경이 되었는데 왜 리렌더링이 일어나지 않았을까 Re-rendering이 일어날 조건과 변수..