Uthibitishaji wa Yaliyomo kwenye Mfumo wa NextJS

Katika somo zilizopita, tulijaribu kutengeneza aina mbili za vitengo - vitengo vya server na vitengo vya mteja. Hebu tuhakikishe kwamba, katika vitengo vya server, tatizo la SEO limetatuliwa. Hii inamaanisha tunapaswa kuthibitisha kwamba kivinjari kinapokea muundo wa HTML na maandishi ya kipengele chetu. Hebu tufanye hivyo.

Hebu kipengele chetu cha server kiwe na muundo ufuatao:

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

Fungua ukurasa wenye kipengele hiki kwenye kivinjari. Kisha bonyeza Ctrl + U. Hii ni mchanganyiko wa vitufe unaofungua msimbo wa asili wa HTML wa ukurasa. Huu ndio msimbo unaofika kutoka kwa server. Hii ni kabla ya kuwekewa msimbo wa JavaScript wa kivinjari. Hivi ndivyo mitandao ya utafutaji inavyoona ukurasa wetu. Kwa hiyo, fungua msimbo wa asili uisome kwa makini. Hapo utapata maandishi ya kipengele chetu.

Hebu kwa mfano sasa tutengeneze kipengele cha mteja:

'use client';

import { useState } from 'react';

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

Bonyeza tena Ctrl + U na uchunguze msimbo wa asili. Hutaweza kupata maandishi ya kipengele chetu, kwa sababu maandishi yake yanaundwa kiwakati kwenye kivinjari.

Huu ndio tofauti kuu kati ya vitengo vya server na vitengo vya mteja.

Fanya hatua zilizoelezewa kwenye somo.

Elezea kwa nini kuna tofauti kati ya vitengo vya server na vitengo vya mteja kutokana na SEO.

Kando na SEO, ni tofauti gani zingine zilizopo kati ya vitengo vya mteja na vitengo vya server?