Kontrolli i Përmbajtjes në NextJS Framework

Në mësimet e mëparshme ne u përpoqëm të bëjmë dy lloje komponentësh - server dhe klient. Le të sigurohemi që, në komponentët server, problemi me SEO është zgjidhur. Kjo do të thotë ne duhet të kontrollojmë, që në shfletues vjen HTML me tekstin e komponentit tonë. Le ta bëjmë këtë.

Le të supozojmë se komponenti ynë server ka pamjen e mëposhtme:

export default function Test() {
	let name = 'përdorues';
	return <h1>përshëndetje, {name}!</h1>;
}

Hapni faqen me këtë komponent në shfletues. Pastaj shtypni Ctrl + U. Ky është kombinimi i tasteve që hap kodin burimor HTML të faqes. Ky është kodi që vjen nga serveri. Kjo do të thotë, para aplikimit të JavaScript-it të shfletuesit. Kështu e shfaqin faqen tonë sistemet e kërkimit. Pra, hapni kodin burimor dhe studiojeni atë. Aty do të gjeni tekstin e komponentit tonë.

Tani, për shembull, le të bëjmë një komponent klient:

'use client';

import { useState } from 'react';

export default function Test() {
	let [name, setName] = useState('përdorues');
	return <h1>përshëndetje, {name}!</h1>;
}

Shtypni përsëri Ctrl + U dhe studioni kodin burimor. Nuk do të gjeni tekstin e komponentit tonë, pasi teksti i tij formohet në mënyrë dinamike në shfletues.

Kjo është dallimi kryesor midis komponentëve server dhe atyre klient.

Kryeni manipulimet e përshkruara në mësim.

Shpjegoni cili është dallimi midis komponentëve server dhe atyre klient nga këndvështrimi i SEO.

Përveç SEO, çfarë dallimesh të tjera kanë komponentët klient dhe server?