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

summer님의 프로필 이미지

작성한 질문수

풀스택 리액트 토이프로젝트 - REST, GraphQL (for FE개발자)

서버사이드 렌더링

pages > index.js에서 궁금한 로직이 있는데요!

해결된 질문

21.09.16 23:29 작성

·

125

0

 
import React from 'react';
import MsgList from '../components/MsgList';
import fetcher from '../fetcher';

export default function Home({ smsgs, users }) {
return (
<>
<h1>SIMPLE SNS</h1>
<MsgList smsgs={smsgs} users={users} />
</>
);
}

export const getServerSideProps = async () => {
const smsgs = await fetcher('get', '/messages');
const users = await fetcher('get', '/users');
return {
props: { smsgs, users }
};
};
 
안녕하세요! 강의를 보다가 pages에 있는 index.js에 궁금한 로직이 있습니다.
 
getServerSideProps 함수에서 return 값이 어떻게 위 Home 리액트 컴포넌트에 props로 넘어갈 수 있는건가요?
 
궁금합니다!! ㅎㅅㅎ

답변 1

1

정재남님의 프로필 이미지
정재남
지식공유자

2021. 09. 17. 00:09

next.js에서 그렇게 동작하도록 정의했기 때문입니다.

https://nextjs.org/docs/basic-features/data-fetching#getserversideprops-server-side-rendering

 

summer님의 프로필 이미지
summer
질문자

2021. 09. 17. 00:10

next.js 특징이었군요! 감사합니다~!

summer님의 프로필 이미지

작성한 질문수

질문하기