Spring.ver2

정재호·2024년 9월 19일
Spring

3 티어는 같고 스프링 부트로 합니다.
개체가 테이블과 관계가 있습니다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="cpath" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
  <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.slim.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
  <script src="${cpath}/resources/js/view.js"></script>
  <script>
        bookView("${id}");

  </script>
</head>
<body>

<div class="container mt-4">
  <h2>Restful Service(SOA), Rest API</h2>
  <div class="card">
    <div class="card-header">Book View</div>
     <div id="bookView" class="card-body">
        Rest 확인
     </div>
     <div class="mx-4 mb-4 ">
     <button class= "btn btn-sm btn-primary">리스트</button>
     <button class= "btn btn-sm btn-primary">수정</button>
     <button class= "btn btn-sm btn-primary">삭제</button>
     </div>
    </div>
    <div class="card-footer">웹기반 인공지능 Track2 (B) - 박매일</div>
  </div>
</div>

</body>
</html>

내용이 자바스크립트로 넘어가서 view가 간소화 되었습니다.

function bookView(id){
    console.log(id); // 상세보기 숫자 날라오는지 확인 13
    // GET : http://localhost:8081/s02/api/book/{id}
    fetch("http://localhost:8081/s02/api/book/"+id)
    .then(response=> response.json())
    .then(book=>{
        let html="";
        html+="<table class='table table-bordered'>";
        html+="<tr>";
        html+="<td>번호</td>";
        html+=`<td>${book.id}</td>`;
        html+="</tr>";
        html+="<tr>";
        html+="<td>제목</td>";
        html+=`<td>${book.title}</td>`;
        html+="</tr>";
        html+="<tr>";
        html+="<td>가격</td>";
        html+=`<td>${book.price}</td>`;
        html+="</tr>";
        html+="<tr>";
        html+="<td>저자</td>";
        html+=`<td>${book.author}</td>`;
        html+="</tr>";
        html+="<tr>";
        html+="<td>페이지</td>";
        html+=`<td>${book.page}</td>`;
        html+="</tr>";
        html+="</table>";

        document.getElementById("bookView").innerHTML=html;

    })
    .catch(error=>{
        console.log(error);
    });
}

view를 가지고 있으니 수정 눌렀을때 페이지 바꿈

fetch로 뿌려주는 방법


    @GetMapping("/update/{id}")
    public String update(@PathVariable Long id, Model model){
        model.addAttribute("id", id);
        return "update"; // update.jsp
    }

id받아서 상세보기 연동
BookRestController 쓰기위해서
다른 방법으로는
DB연동하려면 BookService 단 가야합니다.

view.jsp, view.js, update.jsp, updatae.js

Rest통신은 스크립트가 많다고 생각하시면됩니다.


서버가 다르다 플라스크로 씁니다. 5000번 

    html+="<button type='button' class='btn btn-sm btn-primary' onclick=`goUpdate(${id})`>수정</button>";

goUpdate(${id}) 만 일단 백틱으로 묶었습니다.
전체 백틱으로 묶어야 되었습니다.

function goUpdate(id){
    console.log(id); // 내가 선택한 책번호가 찍히는지
    // PUT : 수정 Rest API : 수정번호 + 수정데이터(JSON)

}
package kr.smhrd.restcontroller;

import kr.smhrd.entity.Book;
import kr.smhrd.service.BookService;
import lombok.RequiredArgsConstructor;
import org.springframework.web.bind.annotation.*;

import java.util.List;

@RestController
@RequestMapping("/api") // Open AIP(URL)
@RequiredArgsConstructor
public class BookRestController {

    private final BookService bookService;

    @GetMapping("/book")
    // <Rest API 명세서>
    // GET : http://localhost:8081/s02/api/book
    // JSON response(응답)

    /*
    [{"id":1,"title":"자바","price":23000,"author":"박메일","page":600},{"id":2,"title":" ","price":30000,"author":"홍길동 ","page":700},{"id":3,"title":"1","price":1,"author":" 1 ","page":1},{"id":4,"title":"자바2","price":20000,"author":"홍길동","page":300},{"id " :5,"title":"장고","price":40000,"author":"장고고","page":300}]

     */
    public List<Book> bookList() {
        List<Book> list = bookService.bookList();
        return list;  // MessageConverter API 동작(jackson-databind)
    }

    @PostMapping("/book")
    //title, price, author, page
    // <Rest API 명세서>
    // POST : http://localhost:8081/s02/api/book
    // request(요청) : JSON

    // {"title":"딥러닝", "price":40000, "author":"나길동", "page":500}
    public String register(@RequestBody Book book) {
        bookService.register(book);
        return "ok"; //응답
    }

    /*
        request(요청)
        DELETE : http://localhost:8081/s02/api/book/{id}
        id : 삭제할 책 번호
        response(응답) : ok
     */
    @DeleteMapping("/book/{id}") //?id=1
    public String remove(@PathVariable Long id) {
        bookService.remove(id); //  삭제

        return "ok"; // 응답
    }

    @GetMapping("/book/{id}")
    /*

    request(요청)
    책상세보기 : GET : http://Localhost:8081/s02/api/book/{id}
    id : 책 번호
    response(응답)
    {"id":18, "title":"212", "price":21, "author":"21", "page" :21}
    */
    public Book getByBook(@PathVariable Long id) {
    //Book book=bookService.view(id);
        return bookService.view(id);
    }
}

put이 없어서 만들어 줍니다.

@PutMapping("/book/{id}")
public void bookModify(Book book){
    
   {id}가 없으면
     Post하고 같이 인식이 됩니다.

@PostMapping("/book")
//title, price, author, page
// <Rest API 명세서>
// POST : http://localhost:8081/s02/api/book
// request(요청) : JSON
    @PutMapping("/book/{id}")
    public void bookModify(@PathVariable Long id, @RequestBody Book book){

    }

form방식 없고 JSON방식만 씁니다.

id book 을 db에 저장해야되서 bookservice 에


Flask, Fastapi 차이

https://start.spring.io/

스프링, 부트 버전이 서로 다릅니다.
api가 살짝 다릅니다.
부트가 스프링버전을 자동적으로 추가됩니다.

타임리프
view를 하고 싶다면 선택합니다.

부트
껍데기는 부트-설정이 편합니다.(요즘방식)
안에는 mysql할 수 있습니다. (옛날방식)

부트 - JPA

인텔리제이에서 불러오면됩니다.



부트 구조입니다.
application.properties 부트 설정 (어플리케이션)
yml JSON 형식

야믈 yml / properties yml 차이

xmlns:th="http://www.thymeleaf.org"

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    JSP => JSTL, EL
Thymeleaf =< JSTL, EL 비슷
</body>
</html>

th 접두사
타임리프 문서를 봐야합니다.

스프링부트는 독립
톰캣이 설치되있든 아니든 내장되어있습니다.
main부터 시작입니다.

DemoApplication Run

DB 연결이 안됬습니다.

mysql쓰려고
라이브러리를 추가했구나 JPA
안하려면 주석처리 //
그래들 바뀌면 리프레쉬


오라클이 쓰고있겠죠
포트 변경

프로퍼티스는 이렇게합니다.
server.port=8081

server:
port: 8081
이렇게 하면 X
server:
port: 8081
앞에 2칸 띄우기 : 뒤에 한칸 띄우면 색깔이 바뀝니다.

. __ _ _ _
/\ / ' _ () __ __ \ \ \ \
( ( )_ | ' | '| | ' \/ ` | \ \ \ \
\/ _)| |)| | | | | || (| | ) ) ) )
' |__| .|| ||| |_, | / / / /
=========||==============|__/=////
:: Spring Boot :: (v3.2.9)

로고가 나옵니다.

`
핸들러 뷰 리모트 다 뜹니다. 스캔 할 필요가 없습니다.

반드시 루트 컨트롤러 아래에 만들어야합니다.

컨트롤러 , 등등 만듭니다.

@SpringBootApplication
스캔이 숨겨져있습니다.



@Controller 어노테이션이 없는 경우, Spring Framework는 해당 클래스를 컨트롤러로 인식하지 않으므로 요청을 처리하지 못합니다. 이로 인해 매핑된 경로에 접근하면 404 에러가 발생합니다.

profile
정재호
성장하는 하루가 되자
이전 포스트

YOLOv8-가위,바위,보

다음 포스트

CNN-Segmentation

0개의 댓글