본문 바로가기

웹개발45

스프링부트 api응답을 json으로 하기 먼저 User라는 클래스를 만든다. package com.example.myapp; import lombok.AllArgsConstructor; import lombok.Getter; import lombok.Setter; @Setter @Getter @AllArgsConstructor public class User { String email; String name; } controller에 User정보를 받아오는 api를 만든다. @RequestMapping("/api/v1/user") @ResponseBody public User getUser(){ return new User("user@email.com","user name"); } http://localhost:8080/api/v1/user를 .. 2021. 2. 18.
리액트에서 api호출하고 데이타를 받아와서 보여주기 먼저 서버에서 데이타를 받아올 api 함수를 먼저 만든다. api.js 파일을 생성해서 만들자 fetch라는 함수를 이용해서 api를 만든다. fetch함수 사용법은 다음url을 참조한다. developer.mozilla.org/ko/docs/Web/API/Fetch_API/Fetch%EC%9D%98_%EC%82%AC%EC%9A%A9%EB%B2%95 Using Fetch - Web API | MDN Fetch API를 이용하면 Request나 Response와 같은 HTTP의 파이프라인을 구성하는 요소를 조작하는것이 가능합니다. 또한 fetch() 메서드를 이용하는 것으로 비동기 네트워크 통신을 알기쉽게 기술할 수 있 developer.mozilla.org 호출할 서버는 이전에 만든 스프링부트의 url을.. 2021. 2. 18.
스프링부트 CORS 적용하기 클라이언트에서 api 호출시 다음과 같은 에러가 날때가 있다. Access to fetch at 'http://localhost:8080/api/v1/hello' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. 이오류에 대해서는 다음을 참조하자 developer.mozilla.org/.. 2021. 2. 17.
IntelliJ 스프링 부트 Hellow world 프로젝트 만들기 IntelliJ ultimate 버젼을 이용하여 스프링부트 프로젝트를 생성하는 방법을 알아본다. 방법은 두가지가 있다 1. Intellij에서 스프링 부트 프로젝트를 모두 생성하는 방법 2. https://start.spring.io/ 에 접속해서 기본 프로젝트 생성후 zip파일로 받아서 IntelliJ에서 소스 import해서 생성하는 방법 여기서는 2번방법으로 생성을 해본다. 스프링부트 프로젝트 파일 만들기 https://start.spring.io/ 에 접속한다. Project : Gradle 선택 Language: Java 선택 Spring Boot 버젼: 2.3.2 선택 Project Metadata: 생성프로젝트에 맞게 입력 Packaging 방법: jar 선택 Java버젼: 마음에 드는 버젼.. 2021. 2. 16.
Visual Studio Code를 이용한 리액트 hello world 프로젝트 생성 참조 : code.visualstudio.com/docs/nodejs/reactjs-tutorial React JavaScript Tutorial in Visual Studio Code React JavaScript tutorial showing IntelliSense, debugging, and code navigation support in the Visual Studio Code editor. code.visualstudio.com Node js 설치 nodejs.org/en/download/ Download | Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org visual studio.. 2021. 2. 15.