Palvelinkomponentit NextJS-kehyksessä

Tarkastellaan komponenttia, jonka loimme edellisessä oppitunnissa:

src/app/test/page.jsxexport default function Test() {
  return <h1>hello, user!</h1>;
}

Kuten aiemmin mainittiin, oletusarvoisesti NextJS:ssä kaikki komponentit ovat palvelinkomponentteja. Samaan aikaan meillä on käytettävissämme kaikki JSX-kielen ominaisuudet, lukuun ottamatta tilojen käsittelyä ja muita vastaavia hookkeja.

Esimerkkinä luodaan muuttuja ja tulostetaan se käyttöliittymässä:

src/app/test/page.jsxexport default function Test() {
  let name = 'user';
  return <h1>hello, {name}!</h1>;
}

jsxlet prods = [
  'prod1',
  'prod2',
  'prod3',
];