What I learned/TIL

[Fri/1/7/2021] Today I Learned

Millie 2022. 1. 8. 01:16

1. CodeSquad Day 5

벌써 5일이라니, 시간이 믿기지 않는 속도로 빠르게 흘러가고 있다.

정말 기록을 제대로 남기지 않으면 손가락 사이로 모래알이 빠져나가듯 배운 것들이 흘러갈 것만 같다.

README를 상세하게 쓰는 것도 미션의 일부인데, 이것을 쓰는 게 정말 좋은 것 같다.

어색했던 마크다운도 점점 익숙해지고 있다. 

남들이나 미래의 내가 보았을 때도 이해하기 좋은 README를 남길 수 있도록 해야겠다.

 

2. React Project

(1) Mock data 추가, 커뮤니티 페이지에 카테고리 map 돌려서 그려주기

아직 백엔드 API와 연동이 되지 않아서, data.json에 mock data를 더 추가했다.

카테고리를 추가해서, map을 돌려서 그려낼 수 있도록 했다.

 

(2) 커뮤니티 페이지의 표에 작성자가 제대로 출력되지 않는 부분 수정

작성자의 경우 중첩된 객체 안에 있었는데, 그럴 땐 render 함수를 추가적으로 이용해서 내부에 있는 것을 풀어 줘야 한다.

 

(3) 커뮤니티 표 개별 항목 클릭 시, URL 주소에 id가 반영되도록 하기 

어떻게 해야 하나 고민이 많았는데, Ant Design에서 제공하는 record라는 매개변수를 전달하면 깔끔하게 가능했다.

https://stackoverflow.com/questions/48494045/how-to-add-dynamic-link-to-table-data

스택오버플로우를 참고했다.

 

(4) 디테일 페이지 : 삭제버튼 눌렀을 때 모달 띄우기

모달 디자인은 완성도를 높이기 위해서는 좀 더 손을 봐 줘야겠다.

 

원래는 Modal에 ant design의 confirm을 이용하려고 했으나 모달의 위치를 중앙으로 놓고 싶었기 때문에, 이럴 경우 confim을 쓰면 적용되지 않는 문제가 발생했다.

그래서 confirm을 쓰지 않기로 했다. 

내일은 Ok 버튼을 눌렀을 때 실제로 글이 삭제될 수 있도록 바꿔볼 예정이다.

 


 

바탕화면을 정리하고 필요없는 파일들을 삭제하면서 용량을 거의 20GB 이상을 비웠다.

바탕화면이 정말 깔끔해져서 새롭게 시작하는 느낌이 든다. 

꽤나 시간을 들인 만큼 뿌듯하다!