[start project] 연락처 앱 마크업하기 - 1. 화면 설계

[start project] 연락처 앱 마크업하기 - 1. 화면 설계

[start project] 연락처 앱 마크업하기 - 2. 메인화면

[start project] 연락처 앱 마크업하기 - 3. 상세화면

[start project] 연락처 앱 마크업하기 - 4. 정리

 

✨ 프로젝트 목표

위 화면을 html, css 로 구현할 것이다.

애니메이션 등의 고급진 스킬들은 다루지 않는다.

앞서 정리한 box model, position, flex, margin auto 등등만을 이용해 구현할 계획이다.

 

✨ 화면 구성

메인 화면

- 헤더

- 내 프로필

- 검색바

- 연락처 리스트

 

상세 화면

- 프로필

- 상세 정보

- 옵션메뉴