220517 프론트엔드 부트캠프 9일차 : State, refetch, map

  State의 원리

writer의 event.target.value를 찍어보면,,, 꼬부기의 'ㄲ'를 입력하는 순간 값이 들어간다.
그러나 if(writer && ... ) 여기서의 writer는 빈 문자열이다.
이는 setState를 했을 때, 바로 그 값으로 변경하는 것이 아니라, 함수가 끝날 때까지 임시메모리에 저장해뒀다가 함수가 종료되면 setState를 실행하기 때문이다! setState로 State가 변하면 렌더링 되는 페이지 전체가 다시 렌더링 되는데, 이를 리렌더링(rerender)이라고 한다. 즉 State가 바뀌면 State를 사용하고 있는 컴포넌트가 다시 만들어지고, 그럴 때마다 바로바로 페이지 전체를 렌더링 하는 것은 매우 비효율적이기 때문에 임시메모리에 저장해뒀다가 함수가 종료될 때 State를 변경한다.
+ 그렇기 때문에 고정된(정적인) 값은 함수 밖에 놓는다. 리렌더될 때 굳이 다시 그려질 필요가 없기 때문!

  refetch 

(왼)내 게시글 데뷔탕트

삭제를 누르면 아무 반응이 없는 것처럼 보이다가, 새로고침을 하면 사라진 게 보인다.
삭제 누름 -> backend API로 요청 -> (DB)엑셀에 있는 n번 데이터 삭제 -> backend API에 응답
여기서 화면을 어떻게 보여줘! 라는 말을 안 했기 때문에 동기화 되지 않고, 새로고침을 해야만 결과가 보인다.
그래서 삭제 후 다시 패치를 해줘야한다. refetch, 엑셀에 있는 새로운 10개 다시 갖다줘! 요청

  map - 따로 쓰겠음

열 번 실행하는데 그 열 번을 구분하려면, 고유한 값을 줘야 한다.
고유한 값, key를 안 주면 체크박스 체크 후 삭제시 체크가 안 사라지는 걸로 구분 못 한다는 걸 알 수 있다...
key = {el.number} or {el.id} 같은 고유한 것을 넣어주면 된다.

주의 : 맵 두 번째 인자엔 index가 들어온다. 그럼 인덱스를 키값으로 줘도 될까? ㄴㄴ 삭제하면 땡겨지니까 기존에 삭제됐던 키가 계속 만들어지므로 안됨!

<Fragment> 와 <> 의 기능은 같지만 <>안에는 key를 쓸 수 없다. key를 쓰려면 Fragment를 이용해야 한다.

  코드리뷰 시간

단축키 rfc
태그 선택 후 cmd + D 누르면 일괄 선택되어 한 번에 수정 가능하다.
스니펫

한 분이 또 가신다...이번엔 정말로 눈물이 나왔다. 일주일은 정들기엔 너무 충분한 시간이었고...,,, 과몰입병ㅎㅎ..

알고나서부턴 계속 풀 죽은 상태였다. 그래서 다 끝내진 못했지만 9시쯤에 일찍 나왔다. 집에서 하는데 , , , 맥북은 usb 꽂는 곳이 없다는 걸 까먹었지... 마우스를 쓸 수 없어서 1.4배는 불편하게 작업했다.

학원에서 퀴즈 풀이(게시글 목록에서 글 삭제), 게시글 목록/상세페이지 UI, fetchBoards, ... 등 하고 집 와서 게시글 상세페이지에서 삭제하기 만드는 걸 했는데, 집에서 하니까 정말 오래걸렸다. 그리고 어째선지 어제 오늘 계속 다리랑 발에 쥐가 나서=ㅁㅠ 웬만하면 학원에서 하고 와야겠다.

오늘 점심은 약간 별루,,,였다. 회덮밥인데 너무 대놓고 대용량 냉동회였다. 해동의 노력조차 보이지 않는 자기들끼리 붙어있는 사이좋은 칭구들이었다. 이러고 9000원을 받는다고...?! 진짜 너무해... 비싼건 뭐라할 수 없는데 그 정도 값은 해달라구욧...😞

오늘은 진짜 12시간은 공부한 것 같다,,, 물론 고3때처럼 스톱워치를 칼같이 누르진 않았지만, 정말 점심시간 빼고는 거의 쉴틈없이 공부만 한 것 같다. 근데 생각보단 안 힘들다. 물론 체력은 힘들지만... 아직은 재밌나봐,,, 그치만 그래서 더 뒤가 무섭다. 그만두고 싶어질까봐,,~~근데 안 그만두면 되지머..^^,,, 게임개발 배울 땐 아이큐 테스트나 알고리즘 푸는 것처럼 뭔가 딱 생각나지 않으면 계속 막혀있었고 공부를 하고 싶어도 할 수가 없었다. 그냥 수학 4점짜리 킬러문제처럼 하루종일 생각만 하다가 끝나기도 하고... 근데 여기는 공부하다보면 되긴 돼서 좋다. 정보도 엄청 많아서 웬만하면 검색하면 나온다!!!(진짜 게임개발 api 들어가서는 글 하나 나오면 감사했는데...!) 그래서 좋아 누구 한 명 잡고 달달달 안 물어봐도 돼서 좋아! 근데 오늘 보너스 문제는 하나도 못 풀었네..🥰