본문 바로가기
Java

서블릿과 데이터베이스 연동

by 개발자공부 2024. 7. 1.

web과 관련된 파일은 webapp 폴더 안에 생성

더보기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Todo Form</title>
<style type="text/css">
body {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	margin: 0;
	font-family: arial, sans-serif;
	background-color: #f4f4f4;
}

.todo-form {
	background-color: #fff;
	padding: 20px;
	border-radius: 8px;
	width: 400px;
	box-shadow: 0 0 10px rgba(0, 0, 0, .1);
}

form {
	display: flex;
	flex-direction: column;
}

label {
	margin-bottom: 5px;
	font-weight: bold;
}

input[type="text"] {
	margin-bottom: 15px;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
}

button {
	padding: 10px;
	background-color: #28a745;
	color: white;
	cursor: pointer;
	border: none;
	border-radius: 10px;
}
</style>
</head>
<body>
	<!-- form 태그에서 데이터를 서버로 제출할 때 반드시 name 속성이 있어야 한다. -->
	<div class="todo-form">
		<h2>ADD Todo</h2>
		<p>http://localhost:8080/s02/todo-add.html</p>
		<!-- 절대 경로 -->
		<!-- / 부터 시작한다면 절대 경로를 의미하고 context-root부터 시작이다. -->
		<form action="/s02/todo-insert" method="post">
			<label for="title">Title : </label> <input type="text" id="title"
				placeholder="Enter todo title" name="title" value="코딩하기"> <label
				for="description">Description : </label> <input type="text"
				id="description" placeholder="Enter todo description"
				name="description" value="html 연습">
			<button type="submit">Save</button>
		</form>
	</div>
</body>
</html>
더보기
package com.tenco.controller;

import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.SQLException;

// 주소설계 - http://localhost:8080/s02/todo-insert
@WebServlet("/todo-insert")
public class TodoServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	public TodoServlet() {
		super();
	}

	// 정적 초기화 블록 - 단 한 번 호출
	static {
		try {
			// JDBC 드라이버 로드(MySQL)
			Class.forName("com.mysql.cj.jdbc.Driver");
		} catch (ClassNotFoundException e) {
			e.printStackTrace();
		}
	}

	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		System.out.println("TODO-INSERT POST 호출됨");

		// HTTP 메세지에서 데이터 추출하기
		// form 태그에서 name 속성이 있어야 값을 추출할 수 있다.
		String title = request.getParameter("title");
		String description = request.getParameter("description");

		// 데이터베이스 연동하는 코드 작성해야 한다.
		String jdbcURL = "jdbc:mysql://localhost:3306/db_todo?serverTimezone=Asia/Seoul";
		String username = "root";
		String password = "asd123";

		String insertTodoSQL = " INSERT INTO tb_todo(title, description) VALUES (?, ?) ";

		// auto close resource
		try (Connection conn = DriverManager.getConnection(jdbcURL, username, password);
				PreparedStatement pstmt = conn.prepareStatement(insertTodoSQL)) {
			pstmt.setString(1, title);
			pstmt.setString(2, description);
			int rowCount = pstmt.executeUpdate();
			System.out.println(rowCount);
		} catch (SQLException e) {
			e.printStackTrace();
			response.getWriter().print("Error : " + e.getMessage());
            return;
		}

	response.getWriter().println("Todo added successfully");

//		System.out.println("title : " + title);
//		System.out.println("description : " + description);
	}

}
더보기
create database db_todo;
use db_todo;

-- 테이블 생성
create table tb_todo(
	id int auto_increment primary key,
    title varchar(255) not null,
	description text not null,
	completed boolean not null default false,
    created_at timestamp default current_timestamp
);

desc tb_todo;
select * from tb_todo;

 

name 값을 삭제하고 실행한 결과 파라미터 값을 읽지 못해서 null 값이 나온다. 데이터베이스에 not null로 설정한 영역에 데이터를 넣지 못하니 오류가 발생한다.