강의

멘토링

로드맵

Inflearn brand logo image

인프런 커뮤니티 질문&답변

신영 유님의 프로필 이미지
신영 유

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

SSR시 쿠키 공유하기

왜/어떻게 nextjs를 사용하면 백엔드를 사용할 필요가 없나요?

작성

·

13K

·

수정됨

0

안녕하세요 제로초님.

NextJS에 대해 자세히 공부하고 싶은데 공부할 설명자료가 구글에 빈약한 거 같아 실무경험이 있는 제로초님께 쉬운 답변을 얻고 싶습니다.

왜 nextjs를 사용하면 백엔드를 사용할 필요가 없는지 구글링을 해봤고 대충 비슷한 답변을 얻은 거 같긴 한데 아직도 좀 잘 모르겠는 부분이 있습니다.

아래는 제가 찾은 답변을 구글 번역한 것입니다:

그러나 SPA(단일 페이지 애플리케이션)의 등장으로 프런트엔드와 백엔드의 구분이 모호해졌습니다. SPA에서 전체 애플리케이션은 사용자의 브라우저에 로드되고 백엔드는 Node.js와 같은 서버 측 프레임워크에서 처리됩니다.

Next.js는 한 단계 더 나아가 백엔드 프레임워크의 필요성을 제거합니다. 이를 통해 완전히 서버 렌더링되는 React 애플리케이션을 만들 수 있습니다. 이것은 사용자의 브라우저가 JavaScript 파일, CSS 파일 및 이미지와 같은 필요한 모든 자산을 포함하여 완전한 HTML 페이지를 다운로드한다는 것을 의미합니다. 또한 React 구성 요소에 대한 지원 기능이 내장되어 있으므로 라우팅, 상태 관리 및 기타 일반적인 프런트엔드 문제에 대해 걱정할 필요 없이 정교한 사용자 인터페이스를 만들 수 있습니다.

-> 그래서 "어떻게" 백엔드 프레임워크가 필요하지 않다는 건지 아직도 이해가 안 됩니다 ㅠㅠ 예시를 들어 설명해 주시면 정말 감사하겠습니다!!

예를들어, 제가 궁금한 점은, DB에서 node를 거치지 않고 Nextjs에서 바로 data를 가져올 수 있는지? 등등

원문:

However, with the rise of single-page applications (SPAs), the distinction between frontend and backend has become less clear. In a SPA, the entire application is loaded in the user’s browser, and the backend is handled by a server-side framework like Node.js.

Next.js eliminates the need for a backend framework by taking it one step further. It allows you to create React applications that are completely server-rendered. This means that the user’s browser will download a complete HTML page, including all the necessary assets like JavaScript files, CSS files, and images. It also ships with built-in support for React components, so you can create sophisticated user interfaces without having to worry about routing, state management, and other common frontend concerns.

 

참고: https://matcha.fyi/nextjs-intro/#:~:text=js.-,Next.,%2C%20CSS%20files%2C%20and%20images.

 

답변 2

0

신영 유님의 프로필 이미지
신영 유
질문자

그러면 DB에서 next.js의 서버 코드를 통해 바로 data를 가져올 수가 있는 건가요?

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

네 가능합니다. 간단한 백엔드라면 next에서 그렇게 바로 하는 경우도 있습니다

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

next.js에는 서버 코드가 내장되어 있습니다. 거기서 서버 코드를 작성하면 서버처럼 작동합니다. next를 사용하면 백엔드가 필요없는게 아니라 next 자체가 백엔드입니다.

그렇다면 구성하기 에 따라

Next 자체를 프론트용 서버로 하고
SpringBoot를 이용해 백엔드 서버를 구성해도 되겠네요?

Client -> Next(프론트서버) -> Spring(백엔드서버)
_______<-_________________ <-___________________

 

 

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

네 매우 흔한 구성 방식입니다

신영 유님의 프로필 이미지
신영 유

작성한 질문수

질문하기