react(4) & 스프링부트 연동

Json 파일 리액트에서 호출하기 

       import로 가져온다음
       const로 선언하고
       map으로 호출해준다 

 

Axios로 백엔드 서버 및 DB와 연동

 

백엔드 서버 셋팅 (Naver Cloud , Spring Boot, MySql) 

-IntelliJ, Gradle, NaverCloud(MySql),  MyBatis,  lombok

-

 

1. @RestController: 이 어노테이션은 컨트롤러를 REST 스타일로 사용하게 만드는 스프링 MVC 어노테이션입니다. 이 어노테이션을 클래스에 추가하면, 그 클래스의 모든 메소드는 기본적으로 HTTP 응답 본문에 직접 쓰여지게 됩니다. 즉, @ResponseBody가 없어도 뷰를 통해 데이터가 반환되지 않고, 데이터가 그대로 클라이언트에게 전달됩니다.
2. @AllArgsConstructor: 이 어노테이션은 Lombok 라이브러리의 일부로, 모든 필드 값을 매개변수로 받는 생성자를 만들어 줍니다. 즉, 클래스 내부에 있는 모든 멤버 변수를 인자로 하는 생성자를 자동으로 생성해줍니다.
3. @CrossOrigin: 이 어노테이션은 웹 브라우저에서 발생하는 CORS(Cross-Origin Resource Sharing, 교차 출처 리소스 공유) 문제를 해결하는 데 사용됩니다. 이 어노테이션을 사용하면, 다른 도메인에서 오는 요청에 대해 서버가 응답을 할 수 있게 해줍니다.
4. @PostMapping: 이 어노테이션은 HTTP POST 요청을 특정 메소드에 매핑하는 데 사용됩니다. @PostMapping으로 표시된 메소드는 POST 요청을 받아 처리합니다.
5. @GetMapping: 이 어노테이션은 HTTP GET 요청을 특정 메소드에 매핑하는 데 사용됩니다. @GetMapping으로 표시된 메소드는 GET 요청을 받아 처리합니다.
6. @ResponseBody는 스프링에서 HTTP 요청을 처리하는 메소드에서 사용되는 어노테이션입니다. 이 어노테이션을 메소드에 사용하면, 해당 메소드의 반환 값이 View를 통해 전달되는 것이 아니라, HTTP 응답 본문(Response Body)에 직접 쓰여집니다. 이는 주로 데이터를 직접 클라이언트에게 전달해야 하는 RESTful 웹 서비스에서 사용됩니다.
7. @RequestBody는 클라이언트가 전송하는 HTTP 요청의 본문(body) 내용을 자바 객체로 변환해주는 역할을 하는 스프링 어노테이션입니다. 주로 POST, PUT과 같이 HTTP 요청 본문에 데이터를 포함시켜 전송하는 메소드에서 사용됩니다. HTTP 프로토콜에서는 요청 본문(body)에 데이터를 담아 전송하는 방식을 지원합니다. @RequestBody 어노테이션은 이렇게 본문에 담긴 데이터를 원하는 타입의 객체로 변환해주는 역할을 합니다.

TestDto

                      @Data,  @Alias  의 역할에 대해 기억하자   

 

 

TestSql.xml

                    parameterType, resultType 의 역할에 대해 기억하자