간단

게시글 작성하기 save (create) 본문

Spring/SpringBoot CRUD 게시판 (Create)

게시글 작성하기 save (create)

I want to Sleep 2023. 8. 16. 21:33
728x90

다음과 같이 package를 생성

mustache 생성은 templates.member에 file을 클릭해 write.mustache라고 작성 (확장자명까지 붙여야 한다)

간단한 부트스트랩 적용으로 layout에 header와 footer를 만들어준다

● entity : 자바 객체를 DB가 이해할 수 있게 만든 것 이를 기반으로 테이블을 만들어줌

● repository : 엔티티가 DB속 테이블에 저장 및 관리될 수 있게 하는 인터페이스

 

앞으로 템플릿화 시켜서 사용할 것이니 이 코드들을 footer와 header에 작성

 

● footer.mustache

<!--site info-->
<div class="mb-5 container-fluid">
 <hr>
 <p>c CloudStudying | <a href="#">Privary</a> | <a href="#">Terms</a></p>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>


</body>
</html>

● header.mustache

<!doctype html>
<html lang="en">
<head>

 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">


 <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

 <title>Hello, world!</title>
</head>
<body>
<!--navigation-->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
 <div class="container-fluid">
 <a class="navbar-brand" href="#">Navbar</a>
 <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
 <span class="navbar-toggler-icon"></span>
 </button>
 <div class="collapse navbar-collapse" id="navbarSupportedContent">
 <ul class="navbar-nav me-auto mb-2 mb-lg-0">
 <li class="nav-item">
 <a class="nav-link active" aria-current="page" href="#">Home</a>
 </li>
 <li class="nav-item">
 <a class="nav-link" href="#">Link</a>
 </li>
 <li class="nav-item dropdown">
 <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
 Dropdown
</a>
 <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
 <li><a class="dropdown-item" href="#">Action</a></li>
 <li><a class="dropdown-item" href="#">Another action</a></li>
 <li><hr class="dropdown-divider"></li>
 <li><a class="dropdown-item" href="#">Something else here</a></li>
 </ul>
 </li>
 <li class="nav-item">
 <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
 </li>
 </ul>
 <form class="d-flex">
 <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
 <button class="btn btn-outline-success" type="submit">Search</button>
 </form>
 </div>
 </div>
</nav>

● write.html

 

{{>layout/header}}

<form class="container" action="/member/write" method="post">
 <div class="mb-3">
 <label class="form-label">제목</label>
 <input type="text" class="form-control" name="title">
 </div>
 <div class="mb-3">
 <label class="form-label">내용</label>
 <textarea class="form-control" rows="3" name="content"></textarea>
 </div>
 <button type="submit" class="btn btn-primary">sumbit</button>
 <a href="/member">back</a><
</form>

{{>layout/footer}}
{{>layout/header}}

템플릿화 생성해둔 layout/header와 footer의 디자인을 그대로 사용

 

● MemberController

@Controller
@Slf4j
public class MemberController {
//의존성 주입
@Autowired
 private MemberRepository memberRepository;

 @GetMapping("/write")
public String write(){

return "member/write";
 }

@PostMapping("/member/write")
public String writePro(MemberForm form){
//dto를 entity로 변환
 Member member = form.toEntity();
 //repository를 이용해 entity를 db에 저장
 Member save = memberRepository.save(member);
 log.info(save.toString());
 return "redirect:/member/list"; //임시
 }
}

● dto (MemberForm)

@Data
public class MemberForm {

private Long id;
 private String title;
 private String content;

 public Member toEntity() {
return new Member(id,title,content);
 }
}

●entity (Member)

@Entity
@AllArgsConstructor
@NoArgsConstructor
@Getter

public class Member {

@Id
 @GeneratedValue
 private Long id;
 @Column
 private String title;
 @Column
 private String content;
}

●repository (MemberRepository)

//Spring Data JPA에서 제공하는 인터페이스로, 데이터베이스의 CRUD (Create, Read, Update, Delete) 작업을 지원
public interface MemberRepository extends CrudRepository<Member,Long> {
}

글 작성 후 http://localhost:8080/h2-console 접속하여 

console창에 ctrl+F 누른후 jdbc 검색후  JDBC URL 복사 붙여넣기

db에 값이 들어간 것을 확인 할 수 있다.

저작자표시 비영리 변경금지 (새창열림)