- HTML 페이지(index.html, aboutme.html, photo.html)
- Servlet 1개(TodayServlet)
- Tomcat 서버 위에서 동작
-
index.html
- 정렬과 배치, 간격을 일정하게 유지
- 홈, 자기소개, 내사진, 몇시에요 간격은 같아야 함
- 모든 콘텐츠는 가운데 정렬
- 같은 list태그를 사용하는 것들은 같은 높이와 넓이의 크기를 가져야 함
- 네모난 UI는 그림자효과를 주어야 함
- 지도는 이미지형태로 추가
- 링크해당하는 영역은 마우스를 올렸을때 커서모양이 손 모양으로 변경
- 내용은 내 소개를 하면 됨
- 하단(footer)를 적어라.
-
aboutme.html
- 간격과 배치를 동일하게 유지
- 같은 수준의 태그에서는 같은 크기의 글자크기를 유지함.
- 우측화면처럼 세 가지 영역으로 크게 나눠지고, 세가지 영역간의 간격(높이)는 같아야함
-
photo.html -간격과 배치를 동일하게 유지해야 함
- 줄간격과 글자크기는 일관되며, 동일해야 함.
- 사진에는 테두리가 존재함.
- header/footer는 다른페이지와 같이 유지
-
현재시간보기(TodayServlet)
- java.time.LocalDateTime 이용
- 서블릿 URL : localhost:8080/aboutme/today
- 다른 페이지에서 현재 시간이란 메뉴를 선택하면 오른쪽과 유사하게 서블릿을 이용해서 결과를 출력
- 서블릿으로 결과를 출력하기 때문에, 디자인은 최대한 간단한 형태로
- 메인화면 버튼을 클릭하면 메인화면으로 이동
- 웹프론트엔드
- html layout tag 사용
- classname은 일정한 컨벤션 유지
- 의미에 맞는 tag를 최대한 사용(div 사용은 최대한 자제)
- postion속성과 float를 사용해서 element를 배치
- 라이브러리를 사용한 레이아웃 안됨(부트스트랩 등)
- id와 class등의 다양한 selector문법을 잘 활용해야 함
- 웹백엔드 기술요구사항
- 톰캣서버를 통해서 자기소개 페이지가 동작해야 함.(localhost:8080/index.html)
- 서블릿페이지하나를 생성해서 url을 입력했을때 시간데이터가 화면에 노출되야 함.
- 프로젝트 이름을 aboutme로 Dynamic Web Project를 생성
- 서블릿 클래스의 이름은 TodayServlet으로 하고, 해당 서블릿 URL경로는 localhost:8080/aboutme/today로 하는 서블릿 클래스 생성
- header와 footer 제작
- index.html 제작
- aboutme.html 제작
- photo.html 제작
- 오류 수정
- 웹 동작 동영상 및 프로젝트 PPT 작성
- 부스트코스 코드리뷰 신청
- 코드리뷰 확인 후 프로젝트와 PPT 수정
- 프로젝트 생성(init())
- 서블릿 제작
- header와 footer 제작
- index.html 제작
- aboutme.html 제작
- photo.html 제작
- 오류 수정
- 코드리뷰 확인 후 수정