이 단계에서는 실제 개발 전에 "무엇을 만들지"를 정의하는 과정인 백로그(Backlog)와 스토리보드(Storyboard)의 개념을 이해하고, ncafe 프로젝트에 적용해 볼게요.

1-1. 백로그와 스토리보드란?

백로그(Backlog) 는 개발할 기능 목록을 우선순위에 따라 정리한 리스트입니다. "무엇을 만들지"에 대한 요구사항을 담고 있습니다. 스토리보드(Storyboard) 는 각 기능이 화면에서 어떻게 흘러가는지, 어떤 URL(경로)로 구현할지 시각적으로 또는 텍스트로 설계하는 과정입니다. "어디에서 어떻게 보여줄지"에 대한 설계도를 담고 있습니다.

1-2. ncafe 백로그 예시

다음은 ncafe 카페 앱의 초기 백로그 예시입니다.

ID	기능 명세 (User Story)	우선순위
B-01	고객이 메뉴를 보고 고르고 바로 시킬 수 있다.	High
B-02	관리자가 메뉴를 편하게 관리(추가/수정/삭제)할 수 있다.	High
B-03	고객이 자기 계정을 만들어서 주문 이력을 볼 수 있다.	Medium

1-3. 스토리보드 설계 (URL 매핑)

백로그의 기능을 실제 웹 페이지(URL)로 매핑해 보겠습니다.

1. B-01 (고객 주문)
   • 고객이 들어오는 첫 화면: / (루트)
   • 메뉴를 보는 화면: /menus
   • 참고: 실제 주문 처리 로직은 나중에 API와 함께 다룹니다. 지금은 화면(페이지)만 만듭니다.
2. B-02 (관리자 관리)
   • 관리자가 들어오는 대시보드: /admin
   • 메뉴를 관리하는 화면: /admin/menus
3. B-03 (고객 계정/이력)
   • 로그인 화면: /login
   • 회원가입 화면: /signup
   • 내 정보/대시보드: /my
   • 내 주문/메뉴 이력: /my/menus

✅ 확인

• 백로그가 "기능 목록"이고, 스토리보드가 "URL 설계"임을 이해했습니다.
• 위 표와 같이 8개의 URL(/, /menus, /admin, /admin/menus, /login, /signup, /my, /my/menus)이 도출되었음을 확인했습니다.

🎓 newlec 쌤의 코멘트

개발을 시작하기 전에 "무엇을 만들지"를 명확히 하는 과정이 중요합니다. 백로그는 고객의 니즈를 기능으로 번역하는 과정이고, 스토리보드는 그 기능을 화면의 흐름(URL)으로 배치하는 과정입니다.

실무에서는 이 과정을 Jira나 Trello 같은 도구로 관리하지만, 초보자는 텍스트 문서나 화이트보드로 충분히 연습할 수 있습니다.

왜 이렇게 미리 계획하는가? 코드를 짜다가 "아, 이 페이지는 어디에 두지?" 하고 헤매지 않기 위해서입니다. URL 구조는 앱의 뼈대입니다. 뼈대를 먼저 세우고 살(코드)을 붙이는 것이 순서입니다.

❌ 자주 하는 실수

증상	원인	해결
"백로그가 코드인가?"	개념 혼동	백로그는 기능 목록(텍스트)입니다. 코드가 아닙니다.
URL을 /menu 와 /menus 로 혼용	명명 규칙 불일치	복수형(/menus)으로 통일하거나, 단일형(/menu)으로 통일하고 일관되게 사용하세요. 이번 실습에서는 아래 단계의 URL을 그대로 따르세요.

📝 이 단계의 핵심

• 백로그(Backlog): 무엇을 만들지 (기능 목록)
• 스토리보드(Storyboard): 어디서 어떻게 보여줄지 (URL/화면 설계)
• ncafe의 핵심 URL 8가지를 도출했습니다.

---