Hi,
In the react-datocms package, we are given 2 functions renderMetaTags() & renderMetaTagsToString().
I understand the latter generates the string and can be used on server side.
As, I’m using NextJS with PAGES ROUTER. So, I wanted to ask whether both functions are same for me or one preferred on another?
If there are any other differences, then please also guide me.
Thanks!
renderMetaTags() returns JSX elements. This is normally the one you’d use if you’re writing Next/React code, since you can put it inside the JSX code directly (like in Next’s <Head> component, which is not the same as the HTML <head> tag): Components: <Head> | Next.js
For example:
export default function Head() {
return (
<>
{ renderMetaTags([{tag: 'title', content: 'This is my title'}]) }
<meta content="width=device-width, initial-scale=1" name="viewport"/>
<link rel="icon" href="/images/favicon.ico"/>
</>
);
}
Will you give the expected tab title:
But if you use renderMetaTagsToString(), it will literally output that string onto the page, which is almost never what you want:
The latter might be useful if you were, say, doing string manipulation and editing raw HTML templates (instead of JSX). In that case it might be useful to have the raw strings instead of JSX elements. But for the most part in a Next project you probably won’t need it.
Hope that helps!
