NextJSフレームワークにおけるサーバーコンポーネント

前のレッスンで作成したコンポーネントを見てみましょう：

export default function Test() {
	return <h1>hello, user!</h1>;
}

前述のように、NextJSではデフォルトですべてのコンポーネントはサーバーコンポーネントです。その際、ステート操作やその他の類似フックを除く、JSX言語のすべての機能が利用可能です。

例として、変数を作成し、それをレイアウトに出力してみましょう：

export default function Test() {
	let name = 'user';
	return <h1>hello, {name}!</h1>;
}

商品の配列があります：

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

ループを使用して、これらの商品をあなたのサーバーコンポーネント内で ulリストとして出力してください。