KDT0_CyinHayeon 디아블로 홈페이지 클론코딩

[Sinary00]

디아블로4 홈페이지 클론 코딩

사이트 주소

• 원본 링크 : https://diablo4.blizzard.com/ko-kr/
• 클론 코딩 배포 링크 : https://gleaming-mooncake-584e00.netlify.app/
• 새 PR : KDT0_CyinHayeon 디아블로 홈페이지 클론코딩 (기존 pr closed) #74
  (closed 후 새 pr을 작성하였습니다. 새 pr 확인 부탁드립니다.)

작업 기간

2023년 7월 27일 ~ (진행중)
(과제 제출 후에도 보완 할 예정)

기술 스택

• HTML
• CSS
• Javascript
• Jquery

구현 내용

• 시멘틱 태그 사용
• CSS만을 이용한 드롭다운 메뉴
• 동영상 재생 클릭 시, 연령 확인 후 쿠키 저장 -> 연령 미달 시 동영상 재생 불가 구현
• 새소식 반응형을 고려하여 슬라이더로 대체
• 마우스를 따라가는 백그라운드 이미지 설정
• 비주얼 백그라운드 동영상 재생/정지 버튼 커스텀
• 탭 기능 구현 (게임플레이/이야기)

아쉬운 점

• 반응형을 고려하여 작업 진행했으나, 클론 코딩 사이트를 급하게 변경해 시간 부족으로 반응형 미구현
• 사이트 로딩에 오래걸림, 최적화 작업 필요
• 콘솔 오류 확인 필요
• 구매하기 모달 창 및 메뉴 버튼 스크롤 js 미구현
• swiper.js 사용하면 한 슬라이더에서 두개의 pagination 작동 불가, 다른 슬라이더 대체 또는 해결 방안 연구 필요

[netlify]

✅ Deploy Preview for mellifluous-gnome-003496 ready!

Name	Link
🔨 Latest commit	3f2d3d0
🔍 Latest deploy log	https://app.netlify.com/sites/mellifluous-gnome-003496/deploys/64c3d46ca83250000816a0de
😎 Deploy Preview	https://deploy-preview-65--mellifluous-gnome-003496.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[JitHoon]

클론 사이트 멋져요,,! 잘 봤습니다~

리드미에 언급하신 콘솔 오류가 Failed to load resource: the server responded with a status of 404 () 이신 것 같은데, 구글링 결과 이 오류의 경우 대부분 이미지 경로나 스크립트, 스타일 파일 경로를 잘못 작성했을 때 나오는 오류라고 합니다!

[Sinary00]

클론 사이트 멋져요,,! 잘 봤습니다~

리드미에 언급하신 콘솔 오류가 Failed to load resource: the server responded with a status of 404 () 이신 것 같은데, 구글링 결과 이 오류의 경우 대부분 이미지 경로나 스크립트, 스타일 파일 경로를 잘못 작성했을 때 나오는 오류라고 합니다!

감사합니다 :)
해당 오류는 이미 확인한 건으로 다른 오류 경고 메세지의 사항을 확인하고 싶었습니다
말씀해주신 오류는 바로 fix하도록 하겠습니다.

[netlify]

✅ Deploy Preview for chipper-rugelach-272280 ready!

Name	Link
🔨 Latest commit	21980e5
🔍 Latest deploy log	https://app.netlify.com/sites/chipper-rugelach-272280/deploys/64c3fb9b6a43590008cba3b5
😎 Deploy Preview	https://deploy-preview-65--chipper-rugelach-272280.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[KittelLee]

짧은시간안에 디테일에 엄청 신경쓰신게 눈에 보이네요 고생하셨습니다 :)