🧩 MVC 패턴 · Annotation · IOC / DI · JSP / JS 정리

---

⚙️ [ MVC 패턴 ]

소프트웨어 공학에서 사용되는 대표적인 디자인 패턴 중 하나로, 프로그램을 깔끔하고 효율적으로 만들기 위한 설계 방법

---

🧱 MVC 종류

구분	구조	설명
🌀 MVC 1	Controller / View ↔ Model	JSP 내에서 HTML과 Java를 함께 작성 → 빠른 개발 가능하나 유지보수 / 역할분담 어려움
⚙️ MVC 2	View ↔ Controller ↔ Model	View: HTML만 담당 Controller: 제어 로직만 담당 → 로직 분리됨, 그러나 파일 관리가 어려움
🧩 MVC 2 (3Tier)	View ↔ Controller ↔ Service ↔ Model	Spring MVC에서 사용되는 패턴 Controller 역할을 제어/로직으로 분리 → 역할 분담 우수하지만 관리할 파일 증가

---

🧭 구역(레이어) 구조

구역	주요 어노테이션	역할
🎨 View	JSP / REACT (HTML, CSS, JS)	프론트엔드(화면 구현)
🚦 Controller	@RestController	HTTP 요청/응답, 타입 변환, 유효성 검사
🧠 Service	@Service	비즈니스 로직, CRUD, 검증, 연산, 트랜잭션 등 (SQL 제외)
🧰 Repository (DAO)	@Repository	DB 저장소 접근, JPA / MyBatis 사용

---

🔄 MVC 패턴 흐름도

JS -(JSON)-> Controller -(DTO)-> Service -(DTO)-> 
Dao -(SQL)-> DB -(SQL)-> Dao -(DTO)-> Service -(DTO)-> Controller -(JSON)-> JS

---

🧬 MVC에서 상속 활용

• Dao에서 공통 DB 연결 메소드를 Super 클래스로 정의하고,
  다른 Dao들이 이를 상속받아 사용
• DB 연결(conn)을 public으로 선언하여 하위 클래스에서 접근 가능하게 설정

---

🏷️ [ Annotation (어노테이션) ]

어노테이션은 코드에 직접 기능을 추가하는 것이 아닌, 컴파일 또는 리플렉션 시점에 기능이 주입되는 메타정보

어노테이션	설명
@RequestMapping	HTTP 통신의 클래스 매핑 (공통 URL 정의) 예: @RequestMapping("/member") → 해당 클래스의 모든 경로가 /member로 시작

---

🧭 [ IOC (Inversion Of Control) ]

제어의 역전 — 객체 생성 및 관리의 제어권을 개발자 → 스프링 컨테이너로 이동

항목	설명
🧠 정의	객체의 생성, 주입, 생명주기를 스프링이 관리
🎯 목적	효율적이고 규칙적인 객체 관리, 중복 및 충돌 방지
🏷️ 주요 어노테이션	@Component, @Controller, @RestController, @Service, @Repository, @Configuration
🧩 활용	MVC 패턴은 IOC 기반 구조 (Spring 핵심 패턴)

---

💉 [ DI (Dependency Injection) ]

객체를 직접 생성하지 않고, 외부(스프링 컨테이너)로부터 주입받는 방식

항목	설명
🎯 목적	결합도 낮춤, 유지보수성 향상
🧠 주요 어노테이션	@Autowired (스프링 컨테이너에서 Bean을 가져옴)
💡 장점	객체 간의 의존성을 외부에서 관리 → 테스트 용이, 코드 간결

---

🔗 [ IOC + DI ]

IOC와 DI를 함께 사용하면, 별도의 싱글톤 패턴 없이 객체를 효율적으로 관리 가능

예시 코드

@Component
class SampleDao {
    public void method() {}
}

class SampleController {
    private final SampleDao sampleDao;

    @Autowired
    public SampleController(SampleDao sampleDao) {
        this.sampleDao = sampleDao;
    }
}

🧩 @Component → Bean 등록
💉 @Autowired → 생성자를 통해 Bean 주입

---

🧱 [ JSP / JS ]

기능	설명 / 예시
📄 JSP 불러오기	<jsp:include page="jsp 경로"></jsp:include>
📁 JSP 파일 위치	JSP는 webapp 하위 폴더 내에 위치해야 인식됨
🔁 fetch 순서	① fetch option 정의 → ② fetch response(await) → ③ fetch data(await)
🔍 마크업 접근	document.querySelector('.class') / document.querySelector('#id')
🧩 마크업 내용 제어	element.innerHTML = 값
🌐 쿼리스트링 가져오기	new URLSearchParams(location.search).get('쿼리스트링명')

---