MVC 및 Servlet 을 사용한 직원 정보 검색

소개

이 프로젝트에서는 MVC 아키텍처와 Servlet 2.x 를 사용하여 직원 정보 검색 기능을 구현하는 방법을 배우게 됩니다. 사용자가 검색할 직원 ID 를 입력할 수 있는 검색 상자를 인덱스 페이지에 만들고, 별도의 페이지에 직원 정보를 표시합니다.

👀 미리보기

🎯 과제

이 프로젝트에서 다음을 배우게 됩니다:

• 사용자가 직원 ID 를 입력할 수 있도록 인덱스 페이지에 검색 상자를 만드는 방법
• 직원 데이터를 나타내는 엔티티 클래스를 구현하는 방법
• 데이터베이스 연결을 얻기 위해 JDBC 유틸리티 클래스를 구현하는 방법
• 데이터베이스에서 직원 정보를 검색하기 위해 DAO 클래스를 구현하는 방법
• 요청을 처리하고 직원 데이터를 JSP 페이지로 전달하기 위해 컨트롤러 클래스를 구현하는 방법
• 쿼리된 직원 정보를 표시하기 위해 JSP 페이지를 구현하는 방법

🏆 성과

이 프로젝트를 완료하면 다음을 수행할 수 있습니다:

• MVC 아키텍처를 사용하여 웹 애플리케이션을 구조화할 수 있습니다.
• Servlet 2.x 를 사용하여 HTTP 요청 및 응답을 처리할 수 있습니다.
• JDBC 를 사용하여 데이터베이스와 상호 작용할 수 있습니다.
• JSP 를 사용하여 웹 페이지에 동적 데이터를 표시할 수 있습니다.

검색 상자 생성

이 단계에서는 사용자가 검색할 직원 ID 를 입력할 수 있는 검색 상자를 인덱스 페이지에 만듭니다.

1. EmployeeInfo/src/main/webapp 디렉토리에 있는 index.jsp 파일을 엽니다.

2. 다음 HTML 코드를 추가하여 검색 상자를 만듭니다:

<form action="/findEmpByEid" method="get">
  <input type="text" name="employeeId" /><input type="submit" value="search" />
</form>

이 양식은 사용자가 "search" 버튼을 클릭하면 employeeId 매개변수를 사용하여 /findEmpByEid URL 로 GET 요청을 보냅니다.

Employee 엔티티 클래스 구현

이 단계에서는 employees 테이블의 필드를 기반으로 Employee.java 엔티티 클래스를 구현합니다.

1. EmployeeInfo/src/main/java/org/labex/entity 디렉토리에 있는 Employee.java 파일을 엽니다.

2. 다음 코드를 추가하여 필드와 해당 getter 및 setter 를 정의합니다:

public class Employee {
    private Integer id;
    private String name;
    private Integer gender;
    private String phone;
    private String email;
    private String address;

    // Getters and setters
    public Integer getId() {
        return id;
    }

    public void setId(Integer id) {
        this.id = id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    // Implement the rest of the getters and setters
}

JDBC 유틸리티 클래스 구현

이 단계에서는 데이터베이스 연결을 가져오는 메서드를 제공하기 위해 JdbcUtil.java 클래스를 구현합니다.

1. EmployeeInfo/src/main/java/org/labex/jdbc 디렉토리에 있는 JdbcUtil.java 파일을 엽니다.

2. 다음 코드를 추가하여 getConn() 메서드를 구현합니다:

public class JdbcUtil {
    private static final String URL = "jdbc:mysql://localhost:3306/test";
    private static final String USERNAME = "root";
    private static final String PASSWORD = "";

    static {
        try {
            Class.forName("com.mysql.jdbc.Driver");
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        }
    }

    public static Connection getConn() {
        Connection conn = null;
        try {
            conn = DriverManager.getConnection(URL, USERNAME, PASSWORD);
        } catch (SQLException e) {
            e.printStackTrace();
        }
        return conn;
    }
}

이 메서드는 제공된 URL, 사용자 이름 및 암호를 사용하여 데이터베이스 연결을 반환합니다.

DAO 클래스 구현

이 단계에서는 직원 정보를 검색하는 메서드를 제공하기 위해 EmployeeDao.java 클래스를 구현합니다.

1. EmployeeInfo/src/main/java/org/labex/dao 디렉토리에 있는 EmployeeDao.java 파일을 엽니다.

2. 다음 코드를 추가하여 getEmployee() 메서드를 구현합니다:

public class EmployeeDao {
    public Employee getEmployee(Integer employeeId) {
        Connection conn = JdbcUtil.getConn();
        String sql = "select * from employees where employee_id = ?";
        PreparedStatement preparedStatement = null;
        ResultSet resultSet = null;

        Employee employee = null;
        try {
            preparedStatement = conn.prepareStatement(sql);
            preparedStatement.setInt(1, employeeId);
            resultSet = preparedStatement.executeQuery();
            if (resultSet.next()) {
                employee = new Employee();
                employee.setId(resultSet.getInt(1));
                employee.setName(resultSet.getString(2));
                employee.setGender(resultSet.getInt(3));
                employee.setPhone(resultSet.getString(4));
                employee.setEmail(resultSet.getString(5));
                employee.setAddress(resultSet.getString(6));
            }
        } catch (SQLException throwables) {
            throwables.printStackTrace();
        }
        return employee;
    }
}

이 메서드는 JdbcUtil.java의 getConn() 메서드를 사용하여 데이터베이스 연결을 가져온 다음, 컨트롤러에서 전달된 직원 ID 를 사용하여 데이터베이스를 쿼리하고 Employee 객체를 반환합니다.

컨트롤러 클래스 구현

이 단계에서는 직원 정보를 검색하기 위한 요청을 처리하는 EmployeeController.java 클래스를 구현합니다.

1. EmployeeInfo/src/main/java/org/labex/controller 디렉토리에 있는 EmployeeController.java 파일을 엽니다.

2. 다음 코드를 추가하여 doGet() 및 doPost() 메서드를 구현합니다:

@WebServlet("/findEmpByEid")
public class EmployeeController extends HttpServlet {
    EmployeeDao employeeDao = new EmployeeDao();

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doGet(req, resp);
    }

    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String employeeId = req.getParameter("employeeId");
        Employee employee = employeeDao.getEmployee(Integer.parseInt(employeeId));
        req.setAttribute("employee", employee);
        req.getRequestDispatcher("info.jsp").forward(req, resp);
    }
}

doGet() 메서드는 요청에서 employeeId 매개변수를 검색하고, EmployeeDao 클래스를 사용하여 직원 정보를 가져와 요청에 저장한 다음, 요청을 info.jsp 페이지로 전달하여 직원 정보를 표시합니다.

JSP 페이지 구현

이 단계에서는 쿼리된 직원 정보를 표시하기 위해 info.jsp 파일을 구현합니다.

1. EmployeeInfo/src/main/webapp 디렉토리에 있는 info.jsp 파일을 엽니다.

2. 다음 코드를 추가하여 직원 정보를 표시하는 테이블을 생성합니다:

<%@ page import="org.labex.entity.Employee" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Employee Information</title>
    <style>
        th, td {
            border: 1px solid black;
            padding: 8px;
        }
    </style>
</head>
<body>
    <% Object employeeObj = request.getAttribute("employee");
    if (employeeObj != null) {
        Employee employee = (Employee) employeeObj; %>
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Gender</th>
                <th>Phone Number</th>
                <th>Email</th>
                <th>Address</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td><%= employee.getId() %></td>
                <td><%= employee.getName() %></td>
                <td><%= employee.getGender() == 1 ? "man" : "woman" %></td>
                <td><%= employee.getPhone() %></td>
                <td><%= employee.getEmail() %></td>
                <td><%= employee.getAddress() %></td>
            </tr>
        </tbody>
    </table>
    <% } else { %>
    <p>Information not found.</p>
    <% } %>
</body>
</html>

이 JSP 페이지는 요청에서 employee 객체를 검색한 다음, 테이블에 직원 정보를 표시합니다.

3. EmployeeInfo 디렉토리로 전환하고 다음 명령을 사용하여 서비스를 시작합니다.

cd ~/project/EmployeeInfo/
mvn clean tomcat7:run

쿼리된 직원 정보의 예상 결과는 다음과 같습니다:

요약

축하합니다! 이 프로젝트를 완료했습니다. LabEx 에서 더 많은 랩을 연습하여 기술을 향상시킬 수 있습니다.