Dynamic Routing Implementation

[BartoszLobejko]

Hi,

I have an app based on creat-react-app. I'm considering to implement react-snap in order to improve SEO indexing. The problem that I'm facing is I'm not sure how our current dynamic routing will work with your package.

Is react-snap will go trough my dynamic routes and pull current URLs and then generate pages? Below is part of the code responsible for routing and loading content:

part of index.jsx

const pagesNesting = [...Array(3)];
let pageSlug = '';

<Switch>
{pagesNesting.map((item, key) => {
              pageSlug += `/:slug${key}`;
              return (
                <Route
                  // eslint-disable-next-line react/no-array-index-key
                  key={key}
                  exact
                  path={pageSlug}
                  component={Page}
                />
              );
            })}
</Switch>

Page component takes route URL and request data using GraphQL from backend. After that Page component renders page content.

part of page.jsx

export function slugParamsToSlug(props) {
  let uri;
  const { match } = props;
  if (match.path === '/' || match.path === '/index.html') {
    uri = SLUG_HOMEPAGE;
  } else if (match) {
    uri = Object.keys(match.params)
      .map(key => match.params[key])
      .join('/');
  }
  return uri;
}

const uri = slugParamsToSlug(props);

[BartoszLobejko]

I found out that this is not a relevant question as react-snap includes to every static page the actual app so routing stays the same.