'열품타' 랜딩 사이트 제작 프로젝트1
프로젝트의 첫 시작으로 랜딩페이지를 만들었다.
- 열품타라는 앱을 소개하는 랜딩페이지이다.
아래 url로 접속해보면 사이트를 볼 수 있다.
http://gunny.dothome.co.kr/
아래 url을 접속해보면 코드를 볼 수 있다.
https://github.com/gunnysis/project/tree/main/project_landingSite
랜딩페이지 기능 소개
- 레이아웃
- html5 시맨틱 태그 사용
- display는 flex 사용
- 미디어쿼리를 사용하여 애플 기준으로 아이폰, 아이패드의 크기에 맞는 적응형 페이지 작성
- 기능
- 애니메이션을 이용하여 각 구간마다 타이머, 캘린터, 그룹 앱 화면이 유동적으로 보임
- 부트스트랩을 이용하여 이미지 슬라이더, 토스트 기능 사용
- 블러 기능과 사용방법을 알 수 있게 버튼 클릭하면 팝업창이 나타나며 동영상 시청 가능
후기
- 화면 크기가 줄어들면 자동적으로 너비나 요소들이 맞춰지는 작업이 잘 되지 않았다.
- 기능적인 부분이 화려하지 못해 많이 아쉬웠다.
다음 챌린지
-> db와 php를 활용하여 회원가입 기능을 추가할 예정이다.
제작한 랜딩페이지 화면
ASD programmer