spring.rest.ver2

restfull

뷰가 없고 data만 만듬
text

> xml
> json
> text

>d
<
클라이언트가 자원(DB)을 가져갈수있도록 서버입장에서 표현을 해야(만들어야)합니다.
표현은 크게 - 주소

rest api 만든다는것은
주소 +요청방식(get, post)
하나의 rest open api로 표현식
client가 자원을 가져가게 하기위해 주소를 만들어주는것
자바, 파이썬 접속 api 든 가져올수 있습니다.

jsp도 쓰지않고 분리

@RestController
@RequestMapping("/api")

List bookList(){
}
파이썬이 읽어갈때
타입을 바꾼다. JSON 구조로 바꿉니다.
통일성
lightweight data-interchange format 데이터 바꾸는 포맷(가벼움) name/value pairs
json.org

xml : 의미 , 태그를 붙여서 용량이 커집니다.

---

  private  final BookService bookService;

@RequiredArgsConstructor

생성자 주입방식
아니면 오토와이드 사용

package kr.smhrd.restcontroller;

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

import java.util.List;

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

  private  final BookService bookService;

  @GetMapping("/bookList")
  public List<Book> bookList(){
      List<Book> list=bookService.bookList();
      return list;
  }
}

여기서 라이브러리가 하나 있어야겠습니다.

implementation 'com.fasterxml.jackson.core:jackson-databind:2.13.0'

스프링이 내부적으로 해줍니다.
; // MessageConverter API 동작(jackson-databind)

스프링 부트는 기본장착입니다.

통신하는 거 설치 > 포스트맨



여기서 테스트 확인합니다. 뷰 없이(벡엔드)
c r u d 할 수 있게 합니다.

분리개발하려고 합니다.
Rest 만들고 파이썬에서 만들고 파이썬에서 가져갈 수 있습니다.
파이썬도 플라스크로 Rest 만들고 할 수 있습니다.

PostMapping("/book") // title, price, author, page
파라미터 날리면, form 등 으로 하면 통일성x
post는 데이터 받는거
resst는
json으로 데이터 받음
// {
"title":"딥러닝",
"price":40000,
"author":"나길동",
"page":500
}
JSON받아서 북으로 넘김
@RequestBody Book book
book으로 변환

리턴 통일 방법필요 나중에함

Rest | 파이썬
View

자바에서 서버 포트 8081 , 8082 나눠서 해볼수도 있습니다.

자신이 쓰려면 컨트롤 만들고 jsp 갔다가 rest를 갔다가 옵니다.

package kr.smhrd.restcontroller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

// React.js, Next.js : Route
// http://localhost:8081/s02/list --> list.jsp
@Controller
public class RouteController {

  @GetMapping("/list")
  public String list(){
      //책 목록을 데이터 베이스에서 가져온다(X) GET: http://localhost:8081/s02/api/book
      return "list"; //list.jsp
  }

}

list 요청
list.jsp 줍니다.

web + react, next.js >> web 풀스택
web + ai >> 깊게 학습 필요 , 밸런스부족..

위 리소스 map
아래 리소스 자바, css
자바스크립트js를 외부에 만듭니다.

@리스트컨트롤을 쓰기위해

list.jsp가 list.js가 불러와야합니다.

function bookListFn(){
  //console.log("bookListFn()");
  // Rest API 통신
 // GET : http://localhost:8081/s02/api/book
 // $.ajax()
 fetch().then().then().catch();

}

바닐라js

밖으로 빼거나

안으로 넣거나

람다식

매개변수 1개면
.then(response=>{ })
() 를 제거
1줄이면
.then(response=>{ return response.json(); })
아래처럼
.then(response=> response.json())

.

.then(response=>{
      if(!response.ok){
          throw new Error("Network error");
      }
  return response.json();
 })

.

      books.forEach(function(){   });
    books.forEach(()=>{});
    books.forEach(book=>{

}

            html+="<td>book.id</td>"; # 이거는 고정

          html+="<td>"+book.id+"</td>";

          html+=`<td>${book.id}</td>`;
백틱 사용방법

function bookListFn(){
  console.log("bookListFn()");
  // Rest API 통신
 // GET : http://localhost:8081/s02/api/book
 // $.ajax()
 // get방식 . 응답 callback함수 .  .  .
 fetch("http://localhost:8081/s02/api/book")
 .then(response=> response.json())
 .then(books=>{
       // 동적으로 뷰를 만들어서 출력...
      let html="";
      books.forEach(book=>{
          html+="<tr>";
          html+=`<td>${book.id}</td>`;
          html+=`<td>${book.title}</td>`;
          html+=`<td>${book.price}</td>`;
          html+=`<td>${book.author}</td>`;
          html+=`<td>${book.page}</td>`;

          html+="</tr>";
      });
      document.getElementById("blist").innerHTML=html;

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

 });

}