30초만에 API를 연결하고 싶다면? 이 방법을 사용해보자. #커스텀인스턴스 #객체리터럴코드 복붙은 맨 아래에 기본코드 실사용예 위 코드를 사용하는 방법Swagger API 명세서 Spring swagger는 API 명세서 작성을 자동화하고 테스트, 문서화까지 할 수 있는 편리한 오픈 소스 소프트웨어다. 포스트맨과 같은 툴로 API를 확인하는 것이 아닌 웹사이트에서 버튼 딸깍으로 쉽게 테스트를 할 수 있으며, API가 controller별로 정리되어있으니 프론트는 백엔드로부터 스웨거 명세서를 받았다면 편리한 유지보수를 위해서 문서 그대로 작성하는 것이 좋다. 따라서 controller 종류별로 API를 정리하도록 하자. 아래의 사진을 자세히보자. 추후에 react-query를 적용하기 위해 useFrie..

문제상황 프론트엔드라면 서버를 통해 API를 호출하면서 렌더링 문제를 마주하게 된다. useEffect와 useState를 통해 데이터를 설정해놔도 다시 호출하면서 다시 빈 데이터가 등록되거나 데이터가 사라지고 실시간 연동이 안되는 등 너무나도 코드가 지저분해지는 문제가 발생했다. 따라서 깔끔하게 API를 관리하는 방법의 필요성을 느꼈다. 특히 리액트는 컴포넌트별로 관리하기 때문에 개발을 하다보면 내부의 컴포넌트에 API를 호출하면서 중복호출 되는 경우가 생긴다. 깔끔하게 코딩하는 방법에 대해 알아보자. 아래의 글에서 API 요청 관리를 관리하는 사례가 적혀있다. 아래를 참고하여 작성하였다. https://github.com/Ubermensch0608/organize-api-requests GitHub ..