Hello everyone, I recently started developing with Nextjs and as always I went through the tutorial to get an idea how it works.

In section 7 of the Tutorial ("Fetching Data"), they query the db from a server component by making the whole component async. In the documentation though, I have found no mention of this pattern.

getServerSideProps on the other hand seems to be the correct and preferred way of fetching data, as it happens asynchronously and the result is passed as prop. To my understanding, this means that the component will always return some html and not a Promise, and will rerender once the props are fetched.

My confusion comes from the fact that the example of fetching inside a component is part of the official tutorial, putting it at least on the same level as getServerSideComponent.

So the questions are, how does Next deal with components that return a promise? And is it safe to fetch data inside a component at render time? How does this impact the rendering?

Thanks 🙂