useReducer 의 장점 로직 분리로 인해 다른곳에서도 재사용 가능 import React, { useEffect, useReducer, useState } from 'react'; import axios from 'axios'; function reducer(state, action) { switch (action.type) { case 'LOADING': return { loading: true, data: null, error: null }; case 'SUCCESS': return { loading: false, data: action.data, error: null }; case 'ERROR': return { loading: false, data: null, error: action.err..

일단 axios 를 설치하자 둘중에 하무거나 npm 쓰면 npm yarn 하면 yarn npm install axios yarn add axios 설치후 package.json 에 설치가 잘 되어 있는지 확인하자~ useState 와 useEffect 로 데이터 로딩 요청에 대한 상태를 관리 할 때에는 총 3가지 상태를 관리해 줘야한다 1. 요청의 결과 2. 로딩 상태 3. 에러 일단 컴포넌트에 Users.js 생성 import React, { useEffect, useState } from 'react'; import axios from 'axios'; function Users() { const [users, setUsers] = useState(null); const [loading, setLoad..

스프링에서 REST 방식을 지원할 때 가장 기본이 되는 데이터 형식은 JSON이다. 그렇기 때문에 JSON을 사용할 때에는 데이터 타입이 JSON이라는 것을 굳이 명시할 필요가 없다. 설정을 해두지 않으면 Content-Type이 JSON인지 아닌지 확인하거나, 응답할때 Content-Type을 JSON으로 설정해서 보내준다. 이 과정은 서블릿의 핸들러아 메세지 컨버터가 자동으로 진행한다. 그러나 XML을 사용하기 위해서는 해당 데이터가 XML 형식이라는 것을 명시해줘야 한다. XML 데이터를 받거나 전송할 Dto(VO) 클래스에 어노테이션을 통해 이 객체의 변환 형식은 XML이라는 것을 표시해주면 이를 인지하고 처리해준다. Dto(VO) 객체에 어노테이션을 추가하는 것 외에는 JSON을 사용할 때와 동..