[프로젝트] 3일차 회고

YIM_JI·2023년 4월 19일
0

[프로젝트] 3일차 회고

현재 시각 새벽 3:12:49 이다. 너무 졸리지만 회고는 쓰고 잠이 들어야 될 거 같아서 작성해본다.

배너, 추천 상품

드디어 오늘부터 구현에 들어갔다. 어제 길고 길었던 기획을 끝마쳤다.
일단 우리 팀원들끼리 메인페이지부터 같이 개발하자고 의견이 좁혀져서 메인페이지부터 개발하였다.
나는 메인페이지에서 배너, 추천상품을 맡았다.
배너가 상당히 나를 괴롭게 했는데 이미지 width는 1240px로 고정이고 view width - 1240px 한 부분은 이미지와 같은 배경색으로 채워줘야 됐다.
여기서 문제는 나는 fade-in-out 방식으로 구현하고 싶어서 opcity와 background-color에 transition 속성을 추가했다. 그런데 계속 화면이 깜빡이듯 바뀌어서 아주 보기가 안좋았다.
이 문제로 2~3시간 고민하고 코드 수정한 끝에 해결책을 찾았다.
transition duration을 10초로 늘려서 천천히 관찰해봤더니 바뀌어야 하는 순서가

  1. 전체 배경색
  2. 이미지
  3. 이미지를 제외한 배경색

이었다. 그래야 자연스럽게 이미지가 변환됐다. 이렇게 배너를 끝마치고 다음은 추천 상품으로 넘어갔다.
이 부분은 크게 어려운 게 없었다. 전체 width: 1240px로 주고 flex wrap으로 흐르게 만들었다.
총 3x2 규격이고 아이템이 총 6개 있다. 1, 6번 아이템은 608x310으로 했고 2~5번 아이템은 292x310으로 줬다. 마지막으로 gap: 24px로 줘서 깔끔하게 레이아웃을 마쳤다.

오피스아워

오늘 오피스아워는 프론트 시간이었다.
나는 궁금한 게 너무 많아서 일부만 gitlab issue에 올리고 나머지는 따로 정리해갔다.
가장 기억에 남는 답변은 내가 '라이브러리 쓸 때 몇 kb정도 되어야 가볍다고 할 수 있나요? 추가적으로 고려해야 할 사항이 있을까요?'issue를 남겼다.
코치님의 답변은 리액트에서 아주 큰 라이브러리들은 크기를 고려해봐야하지만 요즘은 브라우저 성능이 매우 좋아져서 작은 라이브러리들은 성능에 영향을 미치지 않는 정도라고 하셨다. 안심하고 써도 될 것 같다.

마무리

졸리다. 자러 가야겠다.

0개의 댓글