avatar
컴포넌트에 이미지 src 지정해주는것에 이슈가 조금 있었지만 해결!css height
처음 css를 설정 할 때 width와 height를 %로 지정해주었다. 그러고 나서 position relative / absolute 로 <span>
태그의 위치를 정해주었다. 그런데 창을 줄이면 내가 원하는 위치로 고정되지 않고 변하였던 것.. 해결법은 사이즈를 지정해주는 sizer <div>
를 하나 생성해서 height를 0을 주고 padding bottom을 이미지 비율대로 주는 것.
리액트 컴포넌트의 재사용에 관하여..
생각보다 리액트를 리액트스럽게 사용하지 않았다는 것을 깨달았다.. 컴포넌트의 재사용을 늘리기 위해서 prop을 적극적으로 사용하고 잘게 쪼개는 연습을 더 해야될거 같다..
+) 예를 들어 Home.js 의 멤버 소개란의 경우 멤버들의 name이나 position을 객체로 저장해, 멤버 카드 컴포넌트를 생성해 이 정보를 prop으로 넘겨준다. 이렇게 할 경우 컴포넌트의 재사용을 늘릴 수 있다...!
반응형
mui를 쓰고 있어서 이왕이면 적극적으로 활용을 하자..! 라는 코치님의 코멘트에 따라 grid, container를 사용하고, breakpoint를 이용할 생각이다..!
boardgame detail
처음 보드게임 데이터를 불러올때, id를 통해 get 요청을 하려고 했는데, 그럼 id는 어디서 가져오지..? 란 생각을 했다. 상의한 바로는 내가 담당하는 디테일 페이지 전 페이지를 담당하는 팀원 분께서 id를 받아 이를 navigate로 path를 지정해서 보내주시면 나는 이를 params로 뽑아와 사용하는 것으로 결정. 이전 프로젝트에서도 했던 방식인데, 우리 프로젝트에서는 정렬과 카테고리화가 이루어져서 조금 복잡했었다..!
화이태잉ㅠㅠㅠㅠ