Skip to content

Conversation

@eunbime
Copy link
Collaborator

@eunbime eunbime commented Apr 14, 2025

개요

이미지 로드 및 UX 개선

PR 유형

어떤 변경 사항이 있나요?

  • 새로운 기능 추가
  • 코드 리팩토링

스크린샷 및 세부 내용 - 왜 해당 PR이 필요한지 자세하게 설명해주세요

스크린샷 2025-04-14 오후 3 17 10
  • 애니메이션 효과로 인해 초기 배너 이미지가 늦게 가져와지는 것처럼 느껴지는 현상 발견 -> tailwind를 사용한 코드로 리팩토링 -> UX 개선과 함께 애니메이션이 진행되는 동안 똑같은 이미지임에도 다시 요청하는 버그 해결
  • blur placeholder 적용
  • 이미지 상위 div에 배경색을 지정하여 깜빡임 현상 완화시킴

PR Checklist

PR이 다음 요구 사항을 충족하는지 확인하세요.

  • 커밋 메시지 컨벤션에 맞게 작성했습니다.
  • 변경 사항에 대한 테스트를 했습니다.(버그 수정/기능에 대한 테스트).

코드리뷰 검토 사항을 적어주세요

  • 코드 검토 부탁드립니다.

@github-actions github-actions bot added the refactor 코드 리팩토링 label Apr 14, 2025
Copy link
Collaborator

@k-impossible k-impossible left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

고생하셨습니다! 메인 배너가 더 잘나올것 같네요

key={index}
className={`absolute inset-0 transition-opacity duration-1000 ${
index === currentIndex ? "z-10 opacity-100" : "z-0 opacity-0"
}`}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이런 애니메이션 방법도 있군요 👍

initial={{ y: "110%" }}
animate={{ y: "0%" }}
exit={{ y: "-120%" }}
transition={{ duration: 0.5, ease: "easeInOut" }}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

transition을 줘도 사진 넘어가는거랑 글자 바뀌는 타이밍이 잘 맞던가요?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

타이밍은 잘 맞고 있습니다 머지하면 한번 확인부탁드려요!

Copy link
Collaborator

@write-code-b write-code-b left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

고생 많으셨습니다.

@eunbime eunbime merged commit 577e7a0 into dev Apr 14, 2025
1 check passed
@eunbime eunbime deleted the feature/51-gathering-modal branch April 15, 2025 00:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

refactor 코드 리팩토링

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants