리액트 컴포넌트를 ‘레고 블록’으로 만들고, props와 state라는 ‘두 개의 엔진’으로 움직이며, setState라는 ‘새로고침 버튼’으로 상태를 바꾼다는 사실을 이해하자, 팀원들은 마지막 퍼즐 조각에 대한 질문을 던졌다.
“그럼 componentDidMount나 componentWillUnmount 같은 복잡한 생명주기 메서드들은 이 모델에서 어떤 역할을 하는 건가요?”
조던 워크는 마지막 멘탈 모델을 제시할 준비가 되어 있었다. 그는 화이트보드에 리액트 컴포넌트라는 레고 블록 옆에, 안경을 쓴 비서의 모습을 그렸다.
“생명주기 메서드는, 컴포넌트의 출생, 성장, 소멸이라는 중요한 이벤트를 관리하는 유능한 ‘개인 비서’입니다.”
그는 컴포넌트의 삶의 여정을 따라 비서의 역할을 설명했다.
- 출생 신고 (Mounting)
- “컴포넌트라는 레고 블록이 조립되어 처음으로 세상(화면)에 놓이는 순간, 이 비서는 즉시 리액트로부터 ‘출생 보고’를 받습니다. 그리고는 약속된 서류, 즉
componentDidMount파일을 펼치죠.” - “개발자는 이
componentDidMount서류 안에 ‘컴포넌트가 태어났으니, 지금부터 해야 할 일들’을 미리 적어둘 수 있습니다. 예를 들어, ‘서버에 데이터 요청하기’, ‘1초마다 시간 업데이트하는 타이머 켜기’, ‘외부 라이브러리 연결하기’ 같은 작업들이죠. 비서는 이 지시에 따라 모든 준비 작업을 깔끔하게 처리합니다.”
- 성장 보고 (Updating)
- “컴포넌트가 살아가는 동안, 외부(
props변경)나 내부(state변경)의 요인으로 변화를 겪게 됩니다. 그럴 때마다 비서는 또 다른 보고를 받습니다.” - “비서는
shouldComponentUpdate라는 서류를 먼저 확인합니다. 이 서류에 ‘이번 변화는 사소하니, 굳이 모습을 바꿀 필요 없음’이라고 적혀 있다면, 비서는 업데이트 절차를 중단하여 컴포넌트의 에너지를 아껴줍니다.” - “만약 모습을 바꿔야 한다면, 업데이트가 완료된 직후 비서는
componentDidUpdate라는 서류를 펼칩니다. 개발자는 여기에 ‘모습이 바뀌었으니, 스크롤을 맨 아래로 내려주세요’ 같은 후속 조치를 적어둘 수 있습니다. 비서는 이 지시사항을 빠짐없이 이행합니다.”
- 사망 신고 (Unmounting)
- “컴포넌트의 수명이 다해 세상에서 사라져야 할 때, 비서는 리액트로부터 ‘사망 예정 통보’를 받습니다. 그리고 마지막 서류,
componentWillUnmount파일을 꺼내 들죠.” - “이 서류에는 컴포넌트가 세상을 떠나기 전에 반드시 해야 할 ‘뒷정리’ 목록이 적혀 있습니다. ‘켜뒀던 타이머 끄기’, ‘연결했던 외부 라이브러리 해제하기’, ‘등록했던 이벤트 리스너 지우기’ 등. 비서는 이 모든 정리 작업을 완벽하게 수행하여, 컴포넌트가 세상에 아무런 쓰레기(메모리 누수)도 남기지 않고 깨끗하게 떠나도록 돕습니다.”
이 ‘개인 비서’라는 멘탈 모델은 생명주기의 역할을 완벽하게 설명했다.
생명주기 메서드는 개발자가 직접 호출하는 함수가 아니었다.
그것은 리액트와 개발자 사이의 약속된 소통 창구였다. 리액트가 컴포넌트의 삶에서 중요한 이벤트가 발생할 때마다 비서(리액트)를 통해 개발자에게 알려주고, 개발자는 각 이벤트에 맞는 서류(메서드)에 해야 할 일을 적어두기만 하면 되었다.
“가장 중요한 것은, 이 비서는 오직 ‘부작용(Side Effect)’에만 관여한다는 점입니다.” 조던이 강조했다. “컴포넌트의 본질적인 임무, 즉 무엇을 그릴지는 render가 담당합니다. 비서는 render의 일에는 절대 간섭하지 않죠. 오직 render만으로는 할 수 없는 외부 세계와의 소통과 정리 작업만을 전담합니다. 이 역할 분담이 리액트를 깨끗하고 예측 가능하게 만드는 비결입니다.”
팀원들은 이제 리액트의 전체 그림을 완벽하게 이해했다.
공장에서 생산된 레고 블록이, 두 개의 엔진을 달고, 새로고침 버튼으로 상태를 바꾸며, 유능한 비서의 도움을 받아 자신의 삶을 살아가는 모습.
이 네 가지 멘탈 모델은 리액트라는 복잡한 시스템을, 누구나 이해할 수 있는 단순하고 강력한 이야기로 바꾸어 놓았다. 이것은 훗날 수많은 개발자들이 리액트의 세계로 들어오는 길을 밝혀주는 등대가 될 터였다.


