Клиентски компоненти во NextJS рамката

Ајде сега да го претвориме нашиот серверски компонент во клиентски. За да го направите ова, напишете ја директивата 'use client' на почетокот на датотеката на компонентата:

'use client';

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

Сега ќе ни станат достапни state-овите, креирани преку useState. Ајде за пример да создадеме state и да го прикажеме неговото содржина во markup-от:

'use client';

import { useState } from 'react';

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

Направете клиентски компонент со два input-и и копче. Нека во input-ите се внесуваат броеви. При клик на копчето прикажете во параграф збирот на внесените броеви.

Отстранете ја директивата 'use client'. Проверете дали во овој случај NextJS ќе пријави грешка поради тоа што не може да се користат state-ови во серверски компоненти.