[HTML 요약정리] 07-1. 프로젝트 구조 설계

 

 

1. 웹 앱의 구조도 작성

 

• 웹 앱 구조도
  [My Favorites] 웹 앱의 구조를 한눈에 파악할 수 있는 개괄적인 구조도는 앱의 전체 흐름을 파악하는데 도움을 준다
  메인 페이지로부터 각 주요 화면의 연결 구조를 계층 구조로 작성해서 표현한다
  주요 화면에 딸린 내용이 많을 경우 다시 그에 따른 각각의 하위 화면도 구조에 포함시킨다

ex)

가상의 앱을 위한 구조도의 예

 

2. 필요 페이지 명세서

 

[My Favorites] 웹 앱의 메인 화면과 주요 화면에 해당하는 페이지의 명세서 작성

학습용 [My Favorites] 웹 앱의 메인 화면과 주요 화면에 해당하는 페이지의 명세서를 작성한다

페이지의 명세서에는 각 페이지가 표시하거나 처리하는 내용 등을 간략히 기술해서 페이지를 실제로 구현할 때 사용한다

 

<필요 페이지의 명세서 예>

페이지명	파일명	페이지가 표시하는 내용
[main] 페이지	index.html	사이트의 개략적인 소개와 메인 페이지에서 각 주요 화면으로 이동하는 내비게이션 바 제공
[movies] 페이지	s1.html	좋아하는 영화의 개략적인 설명과 유튜브 링크를 제공 주요화면으로 이동하는 내비게이션 바 제공
[games] 페이지	s2.html	좋아하는 게임의 개략적인 설명과 유튜브 링크를 제공 주요화면으로 이동하는 내비게이션 바 제공
[books] 페이지	s3.html	좋아하는 책의 개략적인 설명과 유튜브 링크를 제공 주요화면으로 이동하는 내비게이션 바 제공

 

 

2024.09.02