如果您还没有听说过， Gatsby是静态站点生成器中的最新热点。 尽管许多静态站点生成器（SSG）使用诸如Handlebars或Moustache之类的模板语言，但Gatsby使用React，有助于为其“快速发展”做出贡献。
以前从未使用过SSG（尽管我已经阅读过有关它们的信息），并且在React方面的经验非常有限，这比使用Gatsby发布我的全新博客（实际上是一个博客）， ！）？
入门事实证明，开始使用dbdnht非常简单。 Gatsby网站提供了一个精彩的分步教程，它会逐步引导您启动和运行第一个网站（甚至是部署），并包含大量掌握基础知识的资源。 您不需要任何使用React的经验，尽管与Gatsby一起工作无疑使我想学习React以充分利用其功能。
禁止我发布附带项目的一件事是，想到只用一些小东西就可以用Gulp，webpack等配置整个构建设置。 这就是dbdnht真正吸引我的地方。 Gatsby提供了一个完整的现成的构建设置。 是的 运行gatsby develop ，您立即可以绕过所有配置，并开始在浏览器中构建出色的内容（实时重新加载）。 运行gatsby build和你的产品代码进行了优化（包括逐行扫描图像加载和代码分裂，其中许多其他功能 ） 与您的任何部分绝对没有努力 。 您可以在短短几分钟内建立并部署一个高性能的小型站点。 如果需要，您还可以添加自定义Webpack配置。
CSS在为组件编写CSS时，有两种选择：CSS-in-JS（使用诸如Glamor和Styled Components之类的库）或CSS模块。 由于我对编写“传统” CSS感到更加自在，因此我选择了后者。 CSS模块确实很有趣，并且与Gatsby无关。 样式默认情况下在本地范围内，并且唯一的类名是通过编程生成的，这意味着您不会像传统CSS那样遇到命名和特定性的冲突，并且可以从其他CSS组成新的选择器。 我觉得我只是摸索CSS模块的表面，并期待进一步的试验。
（旁注：这并不意味着我在传统CSS上存在问题，或者我在每种情况下都主张CSS模块！许多所谓CSS“问题”实际上都归因于滥用或错误使用。尽管如此， CSS模块和CSS-in-JS非常有用，可以成为您的武器库中有用的工具。）
外挂程式您可以选择一个完整的Gatsby插件生态系统来定制项目。 我正在使用gatsby-plugin-sass来编写Sass而不是常规CSS，用于markdown文件的gatsby-transformer-remark gatsby-plugin-typography和gatsby-plugin-typography ，它们使您能够以最少的配置使用一些不错的排版组合。 如果您愿意的话，鼓励您编写自己的插件并为Gatsby社区做出贡献。
数据您当然可以对所有内容进行硬编码，但很可能您会希望在网站上使用某种动态内容。
Gatsby的数据层由GraphQL提供支持，本教程逐步介绍了如何使用Gatsby的GraphiQL工具构建数据库查询。 它非常直观，可以向您确切显示数据库查询将返回的内容，对于像我这样的人（他们发现与数据库相关的任何内容都有些吓人），这是一种祝福。
我将博客文章写在markdown文件中，但是您可以将Gatsby配置为与Github Pages或您选择的CMS一起使用，以获得更好的编辑体验。
部署方式运行build命令后，Gatsby允许通过Surge ， Netlify等进行几乎即时的部署。 我使用Netlify设置了主机-运行gatsby deploy ，设置一个Netlify帐户，一切顺利。 然后，您可以将Netlify配置为在每次推送到存储库时自动部署。 与我使用过的其他托管服务提供商相比，Netlify提供了更简单，更有用的体验，并提供了有用的文档，从而减轻了启动网站的所有压力！
结论如果您不愿意尝试使用静态网站生成器，并且想要建立一个简单的网站并快速，轻松地运行，我强烈建议您尝试一下Gatsby。 在入职流程的各个方面以及开发人员的经验中，都产生了无数的想法。 而且，刚刚获得了少量的种子资金来启动创业公司 ，它只会变得更好。
翻译自: https://css-irl.info/introduction-to-gatsby/