개발자

코딩공부 4개월차입니다..

2023년 09월 25일조회 179

부트캠프에서 프로젝트를 진행중입니다. 풀스택과정이라 스프링부트와 리액트를 사용해서 게시판을 만드려고 하는데 타임리프로 만들어져 있는 게시판을 리액트로 변환하고 싶습니다. html로 작성되어 있는 파일들을 리액트로 새로만들어주면 되는건가요? Axios나 fetch를 사용하여 API요청하라고 하는데 무슨소리인지 이해가 잘안갑니다 ㅜㅜ

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 0

답변이 없을 때 보이는 아이콘

첫 답변을 기다리고 있어요.

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

AI 답변
커리어리 AI 봇 프로필 이미지

커리어리 AI 봇

GPT가 달아주는 답변입니다.

2023년 09월 25일

네, 타임리프로 작성된 코드를 리액트로 변환하려면 기본적으로 HTML을 JSX 형식으로 바꿔야 합니다. 여기서 Axios나 Fetch는 비동기 통신을 위한 JavaScript 라이브러리입니다. 데이터를 주고 받거나 페이지를 새로 고침하지 않고도 서버에서 데이터를 가져오거나 데이터를 서버에 보낼 때 사용합니다. 자바스크립트에서 동작하는 웹 애플리케이션은 클라이언트가 서버에 요청(request)을 보내고, 그 요청에 대한 응답(response)을 받아 어떠한 동작이든 수행합니다. 이때, 이 요청과 응답은 HTTP(Hypertext Transfer Protocol)라는 프로토콜(규약)을 통해 이루어집니다. 그런데 웹 페이지 전체를 다시 로드하지 않고도 필요한 부분만 갱신할 때 사용하는 것이 Ajax(Asynchronous JavaScript And XML)입니다. 이 Ajax를 쉽게 구현하기 위해서는 jQuery의 $.ajax 함수 또는 ES6의 fetch API, axios 등의 라이브러리가 일반적으로 사용됩니다. Spring Boot와 같은 백엔드 시스템에서 생성된 API와 통신하기 위해 Axios나 Fetch같은 라이브러리를 사용합니다. 흔히 이런 통신을 RESTful API 호출이라고 합니다. 예를 들어, 게시판의 경우 웹 페이지가 로드될 때 서버로부터 게시글 목록 데이터를 받아와야 하는데, 이때 Axios나 Fetch를 사용해 해당 API를 호출하고 응답받은 데이터를 웹 페이지에 표시합니다. 이렇게 하면 페이지 전체를 새로 고침하지 않고도 필요한 데이터만 가져와 업데이트할 수 있습니다. 정리하자면, 리액트로 애플리케이션을 만들 때는 Axios나 Fetch같은 라이브러리를 사용하여 Spring Boot 서버에서 생성된 RESTful API를 호출하고, 그 응답으로 받은 데이터를 처리해서 전체 페이지가 아니라 필요한 부분만 동적으로 업데이트하는 방식으로 구현하는 것입니다.

목록으로

지금 가입하면 모든 질문의 답변을 볼 수 있어요!