Spring MVC + MyBatis 실습

🧩 Spring MVC + MyBatis 실습 정리

이 글은 Spring MVC + MyBatis 실습을 파일별로 뜯어보며, XML 문법 포인트와 프로젝트 실행 전 초기 세팅, 그리고 MVC 계층에서 데이터가 오가는 흐름을 단계별로 정리합니다.

---

❶ 프로젝트 구조

---

❷ 실행 전 초기 세팅 (application.properties / mybatis-config / Mapper 위치)

🔧 application.properties

spring.application.name=SpringBootMVCDBMybatis2

spring.mvc.view.prefix = /WEB-INF/jsp/
spring.mvc.view.suffix = .jsp


server.servlet.session.persistent=false

# DataSource(Connection Pool)
# Spring Boot use Hicari Connection Pool

spring.datasource.url=jdbc:mysql://localhost:3306/madang?useUnicode=true
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver

# Mybatis
mybatis.config-location=classpath:/config/mybatis-config.xml
logging.level.com.mycom.myapp =debug

 

🧩 mybatis-config.xml

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE configuration
  PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
  "https://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
	
	
	<settings>
	<setting name ="mapUnderscoreToCamelCase" value="true"/>
	</settings>
  <mappers>
    <mapper resource="mapper/Emp-mapper.xml"/>
    <mapper resource="mapper/Emp-mapper-2.xml"/>
  </mappers>
  
</configuration>

mapUnderscoreToCamelCase=true 설정은 first_name → firstName 자동 매핑에 유용합니다. 

mybatis 관련 설정들은 공식 홈페이지에서 확인해보면서 수업을 진행하였습니다.

---

❸ DTO (EmpDto.java)

package com.mycom.myapp.dto;

public class EmpDto {
    private int employeeId;
    private String firstName;  // first_name 매핑
    private String lastName;   // last_name 매핑
    private String email;
    private String hireDate;   // 타입을 LocalDate/LocalDateTime으로 바꿔도 됨

    public EmpDto() {}

    public EmpDto(int employeeId, String firstName, String lastName, String email, String hireDate) {
        this.employeeId = employeeId;
        this.firstName = firstName;
        this.lastName = lastName;
        this.email = email;
        this.hireDate = hireDate;
    }

    public int getEmployeeId() { return employeeId; }
    public void setEmployeeId(int employeeId) { this.employeeId = employeeId; }

    public String getFirstName() { return firstName; }
    public void setFirstName(String firstName) { this.firstName = firstName; }

    public String getLastName() { return lastName; }
    public void setLastName(String lastName) { this.lastName = lastName; }

    public String getEmail() { return email; }
    public void setEmail(String email) { this.email = email; }

    public String getHireDate() { return hireDate; }
    public void setHireDate(String hireDate) { this.hireDate = hireDate; }
}

✅ JSON 키는 getter 이름 기준으로 직렬화됩니다. getEmployeeId()가 employeeId 키를 만듭니다.

---

❹ DAO (EmpDao.java)

package com.mycom.myapp.dao;

import java.util.List;
import java.util.Map;

import com.mycom.myapp.dto.EmpDto;

public interface EmpDao {
    List<EmpDto> listEmp();
    EmpDto detailEmp(int employeeId);
    int insertEmp(EmpDto empDto);
    int updateEmp(EmpDto empDto);
    int deleteEmp(int employeeId);

    // 검색/실습
    List<EmpDto> listEmpLike(String searchWord);
    List<EmpDto> listEmpMap();
    List<EmpDto> listEmpWhereIf(Map<String,String> map);
}

---

❺ Mapper XML ① (Emp-mapper.xml) — resultType + alias

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
  PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
  "https://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="com.mycom.myapp.dao.EmpDao">

  <select id="listEmp" resultType="com.mycom.myapp.dto.EmpDto">
    SELECT 
      employeeId,
      first_name  AS firstName,
      last_name   AS lastName,
      email,
      hire_date   AS hireDate
    FROM emp
  </select>

  <select id="detailEmp" resultType="com.mycom.myapp.dto.EmpDto">
    SELECT 
      employeeId,
      first_name  AS firstName,
      last_name   AS lastName,
      email,
      hire_date   AS hireDate
    FROM emp
    WHERE employeeId = #{employeeId}
  </select>

  <insert id="insertEmp" parameterType="com.mycom.myapp.dto.EmpDto">
    INSERT INTO emp (employeeId, first_name, last_name, email, hire_date)
    VALUES (#{employeeId}, #{firstName}, #{lastName}, #{email}, #{hireDate})
  </insert>

  <update id="updateEmp" parameterType="com.mycom.myapp.dto.EmpDto">
    UPDATE emp
    SET first_name = #{firstName},
        last_name  = #{lastName},
        email      = #{email},
        hire_date  = #{hireDate}
    WHERE employeeId = #{employeeId}
  </update>

  <delete id="deleteEmp" parameterType="int">
    DELETE FROM emp
    WHERE employeeId = #{employeeId}
  </delete>

</mapper>

✅ 문법 포인트
- resultType : SELECT 결과를 DTO로 변환(프로퍼티명과 컬럼/alias 매칭)
- parameterType : 전달 파라미터 타입 지정 (생략 가능하나 명시가 가독성↑)
- 세미콜론(;)은 보통 XML 내부에 쓰지 않습니다.

---

❻ Mapper XML ② (Emp-mapper-2.xml) — <where> / <if> / resultMap

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
  PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
  "https://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="com.mycom.myapp.dao.EmpDao">

  <!-- resultMap : 컬럼명이 애매하거나 조인/복합 매핑에 유용 -->
  <resultMap id="empMap" type="com.mycom.myapp.dto.EmpDto">
    <id     property="employeeId" column="employeeId"/>
    <result property="firstName"  column="first_name"/>
    <result property="lastName"   column="last_name"/>
    <result property="email"      column="email"/>
    <result property="hireDate"   column="hire_date"/>
  </resultMap>

  <select id="listEmpMap" resultMap="empMap">
    SELECT employeeId, first_name, last_name, email, hire_date
    FROM emp
  </select>

  <!-- where/if : 조건파라미터가 있을 때만 WHERE 절을 구성 -->
  <select id="listEmpWhereIf" parameterType="map" resultType="com.mycom.myapp.dto.EmpDto">
    SELECT employeeId,
           first_name AS firstName,
           last_name  AS lastName,
           email,
           hire_date  AS hireDate
    FROM emp
    <where>
      <if test="firstName != null">
        first_name = #{firstName}
      </if>
      <if test="lastName != null">
        AND last_name = #{lastName}
      </if>
      <if test="email != null">
        AND email = #{email}
      </if>
    </where>
  </select>

</mapper>

✅ 문법 포인트
- <where>는 내부 조건이 하나라도 참이면 자동으로 WHERE를 붙이고, 첫 조건 앞의 AND는 생략가능하다.
- resultMap vs resultType : 간단 매핑은 resultType + alias, 복잡 매핑/조인/컬럼명이 애매하면 resultMap.

---

❼ Service 계층

EmpService.java

package com.mycom.myapp.service;

import java.util.List;
import java.util.Map;
import com.mycom.myapp.dto.EmpDto;

public interface EmpService {
    List<EmpDto> listEmp();
    EmpDto detailEmp(int employeeId);
    int insertEmp(EmpDto empDto);
    int updateEmp(EmpDto empDto);
    int deleteEmp(int employeeId);

    List<EmpDto> listEmpLike(String searchWord);
    List<EmpDto> listEmpMap();
    List<EmpDto> listEmpWhereIf(Map<String,String> map);
}

EmpServiceImpl.java

@Service
public class EmpServiceImpl implements EmpService {

    private final EmpDao empDao;

    public EmpServiceImpl(EmpDao empDao) {
        this.empDao = empDao;
    }

    @Override public List<EmpDto> listEmp() { return empDao.listEmp(); }
    @Override public EmpDto detailEmp(int employeeId) { return empDao.detailEmp(employeeId); }
    @Override public int insertEmp(EmpDto empDto) { return empDao.insertEmp(empDto); }
    @Override public int updateEmp(EmpDto empDto) { return empDao.updateEmp(empDto); }
    @Override public int deleteEmp(int employeeId) { return empDao.deleteEmp(employeeId); }

    @Override public List<EmpDto> listEmpLike(String searchWord) { return empDao.listEmpLike(searchWord); }
    @Override public List<EmpDto> listEmpMap() { return empDao.listEmpMap(); }
    @Override public List<EmpDto> listEmpWhereIf(Map<String,String> map) { return empDao.listEmpWhereIf(map); }
}

 

✅ 서비스는 비즈니스 로직을 담당합니다. 지금은 단순 위임이지만, 추후 트랜잭션/검증/조합 로직을 여기에 넣습니다.

---

❽ Controller 계층

EmpController.java (데이터 JSON 응답)

@RestController
@RequestMapping("/emps")
public class EmpController {

    private final EmpService empService;

    public EmpController(EmpService empService) {
        this.empService = empService;
    }

    @GetMapping("/list")
    public List<EmpDto> listEmp(){ return empService.listEmp(); }

    @GetMapping("/detail/{employeeId}")
    public EmpDto detailEmp(@PathVariable Integer employeeId){
        return empService.detailEmp(employeeId);
    }

    @GetMapping("/listEmpWhereIf")
    public List<EmpDto> listEmpWhereIf(@RequestParam Map<String,String> map){
        return empService.listEmpWhereIf(map);
    }
}

PageController.java (뷰 라우팅)

@Controller
public class PageController {
    @GetMapping("/emps") public String emps(){ return "emps"; }
    @GetMapping("/salaries") public String salaries(){ return "salaries"; }
    @GetMapping("/stores") public String stores(){ return "stores"; }
}

✅ 데이터는 @RestController(혹은 @Controller + @ResponseBody)에서 JSON으로 보내고, JSP 화면 이동은 별도 PageController가 담당하면 역할이 분리되어 깔끔합니다.

---

❾ View (emps.jsp) + fetch Ajax

<h1>사원 관리</h1>
<table id="empTable" border="1">
  <thead><tr>
    <th>employeeId</th><th>firstName</th><th>lastName</th><th>email</th><th>hireDate</th>
  </tr></thead>
  <tbody id="empTbody"></tbody>
</table>

<script>
  window.onload = () => listEmp();

  async function listEmp(){
    const res = await fetch('/emps/list');
    const data = await res.json();
    render(data);
  }

  function render(list){
    const rows = list.map(emp => `
      <tr data-employeeid="${emp.employeeId}" style="cursor:pointer">
        <td>${emp.employeeId}</td>
        <td>${emp.firstName}</td>
        <td>${emp.lastName}</td>
        <td>${emp.email}</td>
        <td>${emp.hireDate}</td>
      </tr>`).join('');
    document.querySelector('#empTbody').innerHTML = rows;

    document.querySelectorAll('#empTbody tr').forEach(tr => {
      tr.onclick = () => detailEmp(tr.getAttribute('data-employeeid'));
    });
  }

  async function detailEmp(employeeId){
    const res = await fetch('/emps/detail/' + employeeId);
    console.log(await res.json());
  }
</script>

✅ JSP 안 백틱 템플릿에서 ${...} EL 충돌을 피하려면 스크립틀릿/EL을 사용하지 않는 순수 JS로 구성하는 게 안전합니다.

---

❿ 데이터 흐름 이해 (요청 → 응답)

[브라우저 emps.jsp] --fetch--> [EmpController /emps/list]
   → EmpService.listEmp()
     → EmpDao.listEmp()
       → Emp-mapper.xml (select id="listEmp")
         → DB(emp 테이블) 조회
       ← List<EmpDto>
     ← List<EmpDto>
   ← JSON (List<EmpDto>)
[브라우저] 테이블 렌더링

핵심은 Controller URL과 Mapper id, 그리고 Service/Dao 인터페이스 시그니처가 정확히 맞물리는가입니다.

 

 

---

마무리

이번 실습의 핵심은 MVC 계층의 순서와 책임을 정확히 이해하고, DTO 이름/Getter, Mapper XML의 id/alias, Controller URL이 유기적으로 맞물리게 하는 것입니다. 이 글의 순서(DB → DTO → Mapper(XML) → DAO → Service → Controller → JSP)를 습관화해두면, 새 기능을 추가할 때도 흔들림 없이 진행할 수 있습니다.