두 함수의 선택 기준

• 데이터가 변경되는 주기
• request 객체에 대한 엑세스가 있는지 여부에 따라 달라진다.

export async function getStaticProps(context){
	const meetupId = context.params.meetupId;
	
	return {
		props : {
			mettupData : {
					image : "url/asd/123/zxsdfsdfsf.pdf",
					title : "헬로우 맨",
					address : "Some Street 5, Some city",
					description : "This is a first meetup",
					id : meetupId
			}
		}
	}
}

• 기존 리액트 컴포넌트에서는 useRouter로 url의 특정 slug에 접근 할 수 있지만…
• getStaticProps는 리액트의 함수가 아니므로 useRouter를 사용 해서 url의 특정 slug에 없다..
• context.params로 [meetupId]같은 slug에 접근 하는 방법을 사용 해야한다.
• 실제로 컴포넌트 함수에도 props로 전달 할 수 있다.

GetStaticPaths

• getStaticPaths 함수는 pages 컴포넌트 파일에서 내보내야 하는 함수로, 동적 페이지이며 getStaticProps를 이용할 때 이 함수를 필요합니다.
• async, await 을 사용함.

GetStaticPaths는 왜 필요한가?

• getStaticProps는 빌드할때 모든 페이지를 사전 생성(static generation)한다.
• 그렇 다면 동적페이지( [postId] 이런 류의 페이지들) 에 대해서는 100개가 될 수도있고, 1000개가 될 수도있고 상세 데이터의 갯수에 따라 만들어야 하는 페이지가 계속 늘어날 것이다.
• Next.js는 이런 동적페이지를 만들때 어떤 id값에 대해 페이지가 사전 생성 되어야 하는지 알아야 페이지를 만들 수 있을 것이다. → 해당 Id들을 모른다면 페이지를 만들 수 없다.