DEV Community

Discussion on: Next.js Trash Course - Part 3/3

Collapse
 
bmangust profile image
Макс

There's some mismatch. You said:
«At the top of the file (pages/dev/index.js) we must import it.»
And then just create this function in the same file.
I think these "special" function need a bit more explanation. As I can understand, is fired just before rendering component, and - before that call.
Are there any rules in syntax, props, return values, ordering them in file? I guess only the name is important? And how is passed from one to another? Any other similar functions exist?

Thanks for the course, though)

Collapse
 
vinicius77 profile image
Vinicius Cerqueira Bonifácio

Good catch, Макс! Thanks for pointing it out.

I have just correct that. I meant export instead import since ´Next.js´ uses those function internally. :) But indeed, the sentence was a little bit confusing and mismatching, sorry for that.

Answering (Or trying to )


  • "... As I can understand, is fired just before rendering component, and - before that call ..."

    If you export an async function called getStaticProps from a page, Next.js will pre-render this page at build time using the props returned by getStaticProps.

    Source: Next.js Docs

  • "... I think these "special" function need a bit more explanation ..."
    I totally agree with you. I really tried hard to fit all the basics concepts in only three posts but as I have mentioned before unfortunately it was not enough.
    I am planning to release one or two more extra posts to explain things more in deep. 🙏🏻

  • Are there any rules in syntax, props, return values, ordering them in file? I guess only the name is important? And how is passed from one to another?

Yes, there are some rules, for example:

  • When you use getStaticProps on a page with dynamic route parameters, you must use getStaticPaths;
  • getStaticPaths should be used together with getStaticProps;
  • You cannot use getStaticPaths with getServerSideProps.
  • etc ...

As you have pointed out previously, the function name is also important because Next.js will define the order of each function call based on their names. Where they are placed inside of the file doesn't matter for that reason.

  • "... Any other similar functions exist? ..." Yes, e.g. getInitialProps and getServerSideProps.

I really hope I could clarify some of your doubts, Макс.

I am not an expert in Next.js by any means.

The concepts I brought in this series are from the Next.js Official Documentation . I would really recommend you to give a glance there. 😎

Again, thanks for participating.

Collapse
 
bmangust profile image
Макс

Thanks for the reply, Vinicius. I will definitely try Next.js out with one of next projects.