20170723 면접? 다 그냥 운임.

떨어진 곳은 안가서 다행인거고
붙은곳은 갔어도 구릴 확률이 높고.

온갖 회사 자랑으로 구인한다고 해놔도,
그 사람들이 구릴수도 있는거고,
정작 입사해도 나랑 안맞는 문화가 있을 수 있고,
떨어지고 봐도 나는 적응 못할것 같은 문화일 수 있고...

지원했던 회사 합격한 사람들이랑 떨어진 나랑 크게 차이날 것들도 없을거고,
그냥 운임. x같은 운.

20170706 React.js 리스트에 key를 넣어주는 이유

뜻하지 않게 서버 개발자(로 일해본 기간도 매우 짧지만..ㅠㅠ)의 커리어는 접혔고,
프론트 엔드 개발을 시작하게 되었습니다.

React.js를 사용하게 되었습니다.

젤 처음 의문을 가졌던 key라는 녀석에 대해서 썰을 풀어봅니다.

리엑트는 리스트(순회 구조 아이템들)를 그릴때 key를 넣지 않으면 콘솔에서 막 경고를 막막 줍니다.
그래서 이것저것 넣었는데 특별한 이유가 있었습니다.

1. 리엑트가 그림을 그리는데 중복을 체크합니다.
2. 마지막에 추가하는 것이 아니라 처음 혹은 중간에 추가할 경우 변경된 노드부터 모두 다시 그리게 됩니다.
3. 성능에 영향을 줍니다.

예를 들어,
<div>
  <li>1</li>
  <li>2</li>
</div>
를
<div>
  <li>1</li>
  <li>2</li>
  <li>100</li>
</div>

으로 바꾼다고 할 때,
리엑트 친구는 위에서부터
  <li>1</li> 비교
  <li>2</li> 비교
엇?! 100이 없네? 그려!

의 방식으로 작동하게 됩니다.
만약 100이 처음에 있다면. 리엑트 틴구는 빙구처럼 처음부터 그리게 되겠지요.

근데 여기에 key값을 줘봅니다.
<li key="some.id"> 정도로요.

그럼 리엑트 틴구는 신나서 키만 비교하고 빠진것만 그려넣게 됩니다.

성능상의 이점도 잡을 수 있죠.
그래서 키는 보통 사용자(혹은 리엑트)가 식별할 수 있는 정보를 주게 되어있습니다.
1. 유일할 것
2. 예측 가능할 것
3. 안정적일 것
키가 가져야 할 마음가짐 입니다.

그럼 이제 일하러.