我们不能 SEO Mern Stack 应用程序和 reactjs 应用程序吗？

Question

我是开发新手，我最近创建了一个 MERN 堆栈应用程序，它使用 reactjs 作为前端，使用 express 作为后端的 Nodejs，以及 MongoDB 作为数据库。之后，我搜索了一些方法来对这个应用程序进行 SEO。但是在互联网上的许多文章中，他们提到我们不能对 Reactjs 应用程序进行 SEO，而是需要实现 SSR（服务器端渲染）。所以现在我有以下问题。有人可以解释一下吗？

1. 我们可以将现有的 MERN 应用程序升级到 NextJs 吗？
2. 还有其他方法可以对这个 MERN 应用程序进行 SEO 吗？
3. 那么我是否必须避免在我未来的项目中使用 React 作为前端？相反，我是否需要在未来的项目中使用 Nextjs？如果是的话reactjs没用了？

谢谢。

Answer 1

是的，您不能对 react 应用程序执行 SEO。您必须为此使用 SSR。

您问题的答案：

1.我们可以将现有的 MERN 应用程序升级到 NextJs 吗？

• 是的，您可以，但这是一个冗长的手动过程。您可以直接使用所有组件。有很多你需要改变的地方:

  • 路由（NextJs有不同的路由方式）
  • 样式导入方式
  • 运行 package.json
  中的脚本
  • 如果您使用过浏览器，例如 window 对象，localStorage 那么您必须在 SSR
  中处理它们
  • 在 运行 应用
  期间，您可能会遇到其他问题

2。有没有其他方法可以对这个 MERN 应用程序进行 SEO？

• 不行，SSR是必须的

3。我是否必须避免在未来的项目中使用 React 作为前端？相反，我是否需要在未来的项目中使用 Nextjs？如果是的话reactjs没用了？

• 如果 SEO 是必须的并且您想要 SSR（例如：电子商务网站、个人网站），请选择 NextJs
• 如果没有 SEO（例如：管理面板、基于特定用户的 Web 应用程序），则选择 React

Answer 2

Surjeet 很好地回答了你的第一个问题。在回答你的第二个和第三个问题时，有一些工具，例如 React Router 和 React Helmet，它们可以为 React 项目添加一些 SEO。这里有一篇有用的文章：

https://medium.com/@prestonwallace/3-ways-improve-react-seo-without-isomorphic-app-a6354595e400

快速总结是 React Router will allow you to generate a uri for each new route. React Helmet 在组件的 header 中创建元数据标签，例如标题或页面描述，然后 googlebot 可以获取这些标签。