keemtj / project-applekorea

📝 Apple korea 클론 코딩

리액트로 구현한 Apple사이트 클론 코딩입니다. 현재 메인페이지와 Mac제품 페이지에 대한 작업을 진행하고 있습니다. 클론하면서 중점적으로 공부하게된 부분은 Grid 레이아웃에 대한 이해와 적용, 스크롤 위치에 따른 특정 효과 기능 구현입니다.(인터넷 강의 X)

💄 UI Design

• Apple 공식 홈페이지를 참고하여 디자인 작업
• 레이아웃 재사용을 염두하여 Grid Layout 작업(메인, Mac 페이지에 동일한 Grid layout 컴포넌트를 사용)

🧑🏻‍💻 Feature

주요 기능 구현

• React-router를 이용하여 SPA 구현
• 메인 페이지와 Mac 페이지 구현
• Intersection Observer API를 이용하여 특정 스크롤에서 동영상 재생 및 효과를 넣는 기능 구현(Custom Hooks 적용)

2차 기능 목표

2차 기능 목표는 위의 주요 기능 구현으로는 사이트에 대한 완성도가 부족해서 추가적으로 기능 작업을 하고 있거나 염두해 두고 있는 목표입니다.

• 리액트 Portals를 이용하여 모달 기능 구현 및 작업 진행중(Portals는 현재 적용)
• iphone, ipad, music등 추가 페이지 작업을 통해 전체적인 사이트 완성도 높이기
• react-redux를 이용하여 각각의 페이지 및 필요한 부분에 대해 상태값 적용하기

🛠 Techs

↩️ Commit History

내 커밋 히스토리 보러가기