Gatsby与React的区别
Gatsby为前端提供了一个开源框架，以开发不同的功能，如创建一个动态和优化的网站，同时它也提供了开发的云平台。基本上，Gatsby将React、GraphQL和Webpack等功能结合到一个平台中。另一方面，React也是一个开源的前端框架，基本上React是一个开发用户界面的JavaScript库，或者我们可以说，不同的UI组件。React是由Facebook和Instagram维护和开发的。这两个框架都是用来开发前端UI的。
Gatsby与React的头对头比较（信息图）
下面是Gatsby与React之间的4大区别。
Gatsby与React的主要区别
现在让我们来看看Gatsby和React框架之间的关键区别如下。首先，让我们了解一下Gatsby框架的工作细节如下。
Gatsby是一个开源的结构，它将React、GraphQL和Webpack的有用性整合到一个单独的设备中，用于构建静态网站和应用程序。从它所支持的区域的快速展示、惊人的容器外亮点（如代码分离）和友好的设计师体验可以推断，Gatsby正在迅速变成当前网络改进的主力军。
现在让我们看看什么是静态网站生成器，如下所示:
由于Gatsby的中心是一个静态网站生成器，在进入其他领域之前，我们先调查一下这个想法。如果你碰上一个自1990年代中期以来一直在工人身上的普通HTML页面，你就找到了一个静态网站。那么，你问，什么是特别有创造力的东西，可以在网络上创建静态物质？
静态网站生成器带来的非同寻常的修复方法是动态物质堆叠。在一个习惯性的信息基础驱动的物质执行框架中，如WordPress或Drupal，一个产品层从客户那里获得资产需求，结合合适的布局和内容记录，然后，在这一点上相应地提供一个完整的HTML页面。尽管如此，静态网站生成器将内容与显示它们的布局分开。它们通过整合格式和从外部API带来的内容，在构建时产生HTML页面，然后，在这一点上，将这些页面传达给网络工作者，后者对交付的HTML做出反应。
JAMstack
静态网站生成器赋予了一种被称为 "JAMstack "的网络工程，它是 "JavaScript、API和Markup "的谐音，是组织托管和服务网络内容所需的各种资产的前沿方法，如JavaScript、API和Markup。
在Gatsby应用程序中，一个部件的容量取决于它在文件系统中的区域。src/parts下的部件是基本的页面部件，它们在取决于其文件名的URL上创建页面--例如，src/pages/index.js会产生mywebsite.com/about。页面格式部件与页面部件类似；然而，它们被放置在 src/layouts 下，适合于质疑 GraphQL 来恢复标记信息，然后填充到它们产生的页面中。
像React一样，GraphQL是在Facebook开发的，所以它有理由也许是最令人印象深刻和适应性最强的技术，用于将信息堆积到React的部分。作为一种查询语言（随后是 "QL"），GraphQL的工作方式类似于SQL，即客户在 "查询 "中描述基本信息，并在反应中返回。
对于Gatsby的安装，我们需要使用以下命令，具体如下
npm install –g gatsby-cli
安装后，我们需要创建本地目录，并按照要求进行配置。
现在让我们看看React，如下所示:
我们已经讨论过，React是JavaScript。
现在让我们来看看React中的组件，如下所示。
响应部分进行渲染()技术，接受输入信息并返回要显示的内容。这个模型使用一个类似XML的语法，称为JSX。传入部件的信息可以通过this.props的方式被render()得到。
React中的状态组件
除了获取信息（通过this.props获取），一个部件可以保持内部的状态信息（通过this.state获取）。当一个部件的状态信息发生变化时，交付的标记将被重新召唤的render()所刷新。
现在让我们看看如何创建一个React应用程序，如下所示。
Facebook做了一个Create React Application，其中包含了你组装一个React应用所需要的所有内容。它是一个改进的工作者，利用Webpack来收集React、JJSX和ES6，自动预置CSS文档。
利用道具和状态，我们可以组装一个小的做一个应用程序。这个模型利用状态来跟踪当前的事物的排列组合，就像客户输入的文本一样。尽管场合监督器有所有被内联交付的标志，但它们将利用场合分配来收集和执行。
虚拟DOM
另一个突出的组成部分是利用虚拟文档对象模型或虚拟DOM。Respond做了一个内存中的信息结构存储，注册了后续的对比，并在之后熟练地刷新程序显示的DOM。这种互动被称为妥协。
对于React的安装，我们需要使用以下命令，如下所示。
npm i npx
对于创建React应用程序，我们可以使用下面的命令。
npx create-react-app name of application
Gatsby与React的比较表
现在让我们来看看Gatsby和React的对比表，以便更好地理解如下。
Gatsby | React |
| Gatsby是一个开源的框架，用于前端开发。 | 它也是一个开源的框架，用于前端开发。 |
| Gatsby提供了静态Web应用生成器。 | 另一方面，React提供了一系列的核心功能。 |
| Gatsby有React、GraphQL和Webpack的组合。 | 另一方面，React是一个JavaScript库。 |
| Gatsby是一个免费的框架。 | React也是一个免费的框架。 |
总结
我们希望从这篇文章中你能学到更多关于Gatsby与React的知识。从上面的文章中，我们已经了解了Gatsby和React的基本区别，我们也看到了它们之间的关键区别。从这篇文章中，我们了解了如何以及何时使用Gatsby vs React。
