How to set up robots and sitemap in react?

Question

Search Engine Optimization

Good evening. Can you please tell me how to work with different pages in react for search engines?
Let's say we have /home and /meet. I want to throw on /meet only when searching for meat, and on home when searching for site.ru. How can I implement this?

Thank you.

Answer 1

Hello. In principle, there are not many options, or rather there are many options, but, normal 1-2, I will give them below:
You can use react-helmet.
For example:

import React       from 'react'
import Helmet      from 'react-helmet'
import { useIntl } from 'react-intl'

import messages    from './messages'

export const Seo = () => {
  const intl = useIntl()

  const title = intl.formatMessage(messages.title)
  const description = intl.formatMessage(messages.description)

  return (
    <Helmet
      htmlAttributes={{ lang: intl.locale }}
      title={title}
      titleTemplate={`%s | ${title}`}
      meta={[
        {
          name: 'description',
          content: description,
        },
        {
          property: 'og:title',
          content: title,
        },
        {
          property: 'og:description',
          content: description,
        },
        {
          property: 'og:type',
          content: 'website',
        },
        {
          name: 'twitter:card',
          content: 'summary',
        },
        {
          name: 'twitter:title',
          content: title,
        },
        {
          name: 'twitter:description',
          content: description,
        },
      ]}
    />
  )
}

For sitemap you can use react-router-sitemap

import { Router, Route, IndexRoute, Redirect, IndexRedirect } from 'react-router'
import React from 'react';

export default (
    <Router>
        <Route path="/">
            <IndexRoute/>
            <Route path="test" />
            <Route path="posts(/:page)" />
            <Route path="article/:hrefTitle" />
            <Route path="tags/:tagName" />
            <Route path="tags/pages/(:page)" />
            <Route path="archive(/:searchKey)" />
            <Redirect path="*" to="/" />
        </Route>
    </Router>
)