안녕하세요, 여러분의 든든한 백엔드 길잡이 데브프리입니다.
지난 시간에는 H2 데이터베이스를 연결하고 Board 엔티티를 만들어 데이터베이스에 게시판 테이블을 띄우는 것까지 성공했습니다. 혹시 아직 DB 연결과 404 에러를 해결하지 못하셨다면, 반드시 아래 이전 글을 먼저 확인하시고 뼈대를 튼튼하게 세워두고 오시길 바랍니다!
https://devlog-tech.tistory.com/entry/spring-boot-database-jpa-board-setup
2026 스프링 부트 게시판 만들기 ①: 가장 쉬운 DB 연결과 JPA 세팅 (H2 404 에러 완벽 해결)
안녕하세요, 여러분의 든든한 백엔드 길잡이 데브프리입니다. 지난 시간, 우리는 스프링 부트 프로젝트를 처음 생성하고 웹 브라우저에 'Hello World'를 띄우는 감격스러운 순간을 맞이했습니다.
devlog-tech.tistory.com
DB라는 튼튼한 창고를 지었으니, 이제 사용자가 웹 브라우저에서 직접 글을 적고 그 글을 창고에 저장할 수 있도록 '글쓰기 화면(HTML)'과 '중간 관리자(Controller)'를 만들어보겠습니다.
오늘은 데이터 이동을 도와줄 '롬복(Lombok)' 설정부터 시작하여, 프론트엔드 화면과 백엔드를 매끄럽게 연결해 보겠습니다. 바로 시작할게요!
0. 시작하기 전에: 필수 라이브러리 추가 (Lombok & Thymeleaf)
본격적인 코드 작성에 앞서, 오늘 과정이 매끄럽게 진행되도록 두 가지 필수 도구를 먼저 장착하겠습니다.
사용자가 글쓰기 폼에서 입력한 데이터(제목, 내용)를 자바 코드로 무사히 가져오려면 데이터를 넣고 뺄 수 있는 Getter와 Setter 함수가 필요합니다. 이를 단어 하나로 자동 생성해 주는 마법의 도구가 바로 Lombok(롬복)입니다.
또한, 우리가 작성할 웹 화면(HTML)을 스프링 부트가 정상적으로 읽고 띄워주기 위해서는 Thymeleaf(타임리프) 템플릿 엔진 라이브러리가 필수입니다.

build.gradle 파일을 열고 dependencies 괄호 안에 아래의 라이브러리들을 추가한 뒤, 새로고침(코끼리 아이콘)을 꼭 눌러서 다운로드해 줍니다.
dependencies {
// ... (기존에 추가했던 web, jpa, h2 라이브러리 유지) ...
// ⭐️ 화면(HTML)을 띄워주기 위한 타임리프 템플릿 엔진 라이브러리 추가
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
// ⭐️ Getter, Setter 코드를 줄여주는 롬복 라이브러리 추가
compileOnly 'org.projectlombok:lombok'
annotationProcessor 'org.projectlombok:lombok'
}
이제 롬복이 설치되었으니, 지난 시간에 작성했던 Board.java 파일을 열고 클래스 이름 위에 @Data 어노테이션을 추가해 줍니다.
package com.데브프리.demo.entity;
import jakarta.persistence.*;
import lombok.Data;
@Entity
@Data // ⭐️ 추가: Getter, Setter를 자동으로 만들어주는 마법의 어노테이션
public class Board {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
@Column(length = 200, nullable = false)
private String title;
@Column(columnDefinition = "TEXT", nullable = false)
private String content;
}
1. Repository 생성: DB와 소통하는 마법의 지팡이
스프링 부트에서는 DB에 데이터를 저장할 때 복잡한 SQL문을 쓰지 않습니다. 대신 Repository(레포지토리)라는 인터페이스만 하나 만들어주면, 스프링이 알아서 데이터를 넣고 빼는 기능을 제공합니다.
- com.데브프리.demo 폴더 안에 repository 패키지(폴더)를 새로 만듭니다.
- 폴더 안에서 [New] > [Java Class]를 누른 뒤, 종류를 Interface로 선택하고 이름은 BoardRepository로 짓습니다.

package com.데브프리.demo.repository;
import com.데브프리.demo.entity.Board;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.stereotype.Repository;
@Repository
// JpaRepository<다룰 엔티티 클래스, 그 엔티티의 ID(기본키) 타입>
public interface BoardRepository extends JpaRepository<Board, Long> {
}
끝입니다! 이 두 줄만 적어주면 DB에 글을 저장할 준비가 모두 끝났습니다.
2. Controller 생성: 교통정리 경찰관
이제 사용자가 "글쓰기 화면 보여줘!"라고 요청하면 화면을 띄워주고, 폼에서 "이 글 저장해 줘!"라고 하면 DB에 저장해 주는 Controller(컨트롤러)를 만들 차례입니다.
- com.데브프리.demo 폴더 안에 controller 패키지를 만듭니다.
- 그 안에 BoardController.java 클래스를 만들고 아래 코드를 작성합니다.
package com.데브프리.demo.controller;
import com.데브프리.demo.entity.Board;
import com.데브프리.demo.repository.BoardRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
@Controller // 이 클래스가 컨트롤러 역할을 한다고 선언
public class BoardController {
@Autowired
private BoardRepository boardRepository; // 1번에서 만든 지팡이를 가져옵니다.
// 1. 글쓰기 화면을 보여주는 역할 (GET 방식)
@GetMapping("/board/write")
public String boardWriteForm() {
return "boardwrite"; // resources/templates 폴더 안의 boardwrite.html을 찾아가라는 뜻!
}
// 2. 작성한 글을 DB에 저장하는 역할 (POST 방식)
@PostMapping("/board/writepro")
public String boardWritePro(Board board) {
boardRepository.save(board); // 화면에서 넘어온 데이터를 DB 창고에 쏙 저장
return "redirect:/board/write"; // 저장이 끝나면 다시 글쓰기 화면으로 돌려보냄
}
}
3. Thymeleaf HTML 생성: 사용자 웹 화면
마지막으로 사용자가 마주할 웹 화면을 만들어 줍니다. 스프링 부트는 뷰 템플릿으로 타임리프(Thymeleaf)를 사용하며, HTML 파일들은 무조건 resources/templates 폴더 안에 있어야 합니다.
- 좌측 탐색기에서 src > main > resources > templates 폴더를 우클릭합니다.
- [New] > [HTML File]을 클릭하고 파일 이름을 boardwrite.html로 만듭니다. (컨트롤러의 return 값과 똑같아야 합니다.)

<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>게시글 작성</title>
<style>
body { font-family: sans-serif; padding: 50px; }
.layout { width: 500px; margin: 0 auto; }
input, textarea { width: 100%; padding: 10px; margin-bottom: 15px; border: 1px solid #ccc; border-radius: 4px; }
button { padding: 10px 20px; background-color: #00ED64; border: none; border-radius: 4px; font-weight: bold; cursor: pointer; color: black; }
</style>
</head>
<body>
<div class="layout">
<h2>새 게시글 작성하기</h2>
<form action="/board/writepro" method="post">
<input type="text" name="title" placeholder="제목을 입력하세요" required>
<textarea name="content" rows="10" placeholder="내용을 입력하세요" required></textarea>
<button type="submit">작성완료</button>
</form>
</div>
</body>
</html>
4. 실행 및 H2 콘솔에서 데이터 확인하기!
드디어 테스트 시간입니다! 우리가 만든 뼈대와 로직이 잘 맞물려 돌아가는지 확인해 보겠습니다.
- 메인 클래스를 실행하여 서버를 켭니다.
- 브라우저를 열고 http://localhost:8080/board/write 에 접속합니다.
- 방금 만든 심플한 폼에 제목과 내용을 마음껏 적고 [작성완료] 버튼을 누릅니다. (화면이 깜빡이면서 폼이 비워지면 데이터 전송 성공입니다!)
- 데이터가 잘 저장되었는지 확인하기 위해 http://localhost:8080/h2-console 로 접속합니다.
- BOARD 테이블을 클릭하고 SELECT * FROM BOARD 쿼리를 실행(Run)해 보세요!

마무리
오늘은 Lombok 설정을 시작으로 Repository, Controller, 그리고 Thymeleaf 템플릿을 연결하여 사용자의 화면(프론트)부터 백엔드 DB 창고까지 이어지는 하나의 파이프라인을 완벽하게 관통해 보았습니다.
이전 포스팅에서 DB 환경 설정을 탄탄하게 해둔 덕분에, 뷰를 띄우고 데이터를 밀어 넣는 비즈니스 로직은 생각보다 단순하고 강력하게 동작합니다.
우리가 열심히 적어둔 글들이 DB 창고에 차곡차곡 쌓여있으니, 다음 시간에는 창고에 저장된 글들을 예쁜 리스트 형태로 웹 화면에 쫘르륵 불러오는 '게시글 목록(List) 보기 기능'을 구현해 보겠습니다.
오늘도 코딩하시느라 수고 많으셨습니다. 막히는 에러가 발생했다면 언제든 댓글로 남겨주세요. 지금까지 데브프리였습니다!
'🛠️ IT 실전 가이드 (SW 도구)' 카테고리의 다른 글
| 2026 스프링 부트 게시판 만들기 ④: 내용이 궁금해! 게시글 상세 보기 기능 구현 (0) | 2026.06.11 |
|---|---|
| 2026 스프링 부트 게시판 만들기 ③: 데이터 쫙 불러오기! 글 목록(List) 구현 (0) | 2026.06.10 |
| 2026 스프링 부트 게시판 만들기 ①: 가장 쉬운 DB 연결과 JPA 세팅 (H2 404 에러 완벽 해결) (0) | 2026.06.08 |
| 엑셀 VLOOKUP #N/A 오류, 딱 3가지만 확인하면 1분 만에 해결! (0) | 2026.06.06 |
| 2026 스프링 부트(Spring Boot) 시작하기: 프로젝트 생성부터 Hello World 출력까지 (0) | 2026.06.05 |