MVC 패턴 익히기 | 간단한(전혀 간단하지 않다.) 퀴즈 앱 MVC 패턴으로 만들기

냅다 시작합니다. 왜냐하면 나는 바닐라로 함수범벅인 코드만 짜봤기에 .. 해보고 싶어졌다. 내 머리로. 과연 ..

 

---

5:42pm

 

---

5:57pm

 if (this.data.data[this.data.currentIndex].answerIndex === parseInt(selectedIndex)) {
            this.data.upScore();
            console.log("정답")
        } else {
            console.log("오답")
        }

 

이것. 뭐예요~?

---

6:15pm

 

얼추 완성. 어디서 어떻게 접근해야하는지는 감이 잡혔음.

 

허나, 

MVC 패턴의 관점에서 현재 코드를 분석해보겠습니다.

현재 코드는 MVC 패턴의 기본적인 구조는 가지고 있지만, 몇 가지 개선이 필요한 부분이 있습니다:

1. **Model (Model 클래스)**
- ✅ 데이터 관리와 비즈니스 로직을 담당
- ✅ 점수 계산, 다음 문제 이동 등의 핵심 로직 포함
- ❌ `isFinished()` 메서드가 alert를 직접 호출하는 것은 View의 역할을 침범

2. **View (View 클래스)**
- ✅ UI 요소 렌더링 담당
- ✅ DOM 조작과 이벤트 바인딩 처리
- ❌ `renderQuestion()`과 `renderOptions()`에서 `isFinished()`를 직접 호출하는 것은 Model의 로직을 직접 사용하는 것

3. **Controller (Controller 클래스)**
- ✅ Model과 View를 연결
- ✅ 사용자 입력 처리
- ❌ View에 직접 controller 인스턴스를 할당하는 방식이 이상적이지 않음

 

 

ㅎㅎ.