如何使用 Netlify 作为 Gatsby 博客的内容管理系统
Netlify CMS是什么？
太好了！那我该如何开始呢？
Netlify CMS是什么？
这是一个用 React 编写的开源单页应用程序，允许您编辑 Git 仓库中的内容和数据。它与您的静态网站仓库 API（在本例中为 Gatsby）交互，以便每次您进行更改时，更改都会被提交。
太好了！那我该如何开始呢？
首先，我们打开一个新的终端窗口，创建一个新的站点。我将使用默认的终端，gatsby-theme-blog但你也可以使用你自己的终端。
壳：
gatsby new YOUR PROJECT NAME https://github.com/gatsbyjs/gatsby-starter-blog-theme
现在cd进入你的项目目录，安装适用于 Netlify CMS 的 Gatsby 插件，以及netlify-cms-app
壳：npm install --save netlify-cms-app gatsby-plugin-netlify-cms
现在，让我们用你最喜欢的文本编辑器打开它。
如果你使用的起始模板和我在本教程中一样，那么你的项目结构应该如下所示：
YOUR PROJECT'S NAME
├── content
│ ├── assets
│ │ └── avatar.png
│ └── posts
│ ├── hello-world.mdx
│ └── my-second-post.mdx
├── src
│ └── gatsby-theme-blog
│ ├── components
│ │ └── bio-content.js
│ └── gatsby-plugin-theme-ui
│ └── colors.js
├── gatsby-config.js
└── package.json
由于我们安装了 Gatsby 插件，现在需要将其定义在 .htm.xml 文件中gatsby-config.js。如果该文件不存在，则创建该文件。
gatsby-config.js：
module.exports = {
plugins: [`gatsby-plugin-netlify-cms`],
}
现在，我们需要static在项目根目录创建一个名为 `static` 的文件夹，然后在该静态文件夹内创建另一个名为 `static` 的文件夹admin。最后，创建一个名为 `.bashrc` 的文件config.yml。你的项目应该看起来像这样：
YOUR PROJECT'S NAME
├── content
│ ├── assets
│ │ └── avatar.png
│ └── posts
│ ├── hello-world.mdx
│ └── my-second-post.mdx
├── src
│ └── gatsby-theme-blog
│ ├── components
│ │ └── bio-content.js
│ └── gatsby-plugin-theme-ui
│ └── colors.js
├── static <-------------- HERE
│ └── admin
│ │ └── config.yml
├── gatsby-config.js
└── package.json
如果你还没有这样做，请将此项目上传到 GitHub 并推送你最新的提交。
好的，现在请将static/admin/config.yml以下内容粘贴到您的文件中：
backend:
name: github
repo: your Github username/ your repo name
media_folder: static/assets
public_folder: /assets
collections:
- name: blog
label: Blog
folder: blog
create: true
fields:
- { name: path, label: Path }
- { name: date, label: Date, widget: datetime }
- { name: title, label: Title }
- { name: body, label: Body, widget: markdown }
准备好你的项目，使其达到生产环境，然后前往 Netlify 并使用 Git 创建一个新站点。
网站搭建完成后，请按照以下链接中的说明进行操作：
https://docs.netlify.com/visitor-access/oauth-provider-tokens/#setup-and-settings
请务必从 GitHub 获取您的密钥和密文。
返回 Netlify
在网站设置中，向下滚动直到看到“GitHub” access control，然后OAuth点击install provider并选择它。输入您的用户KEY名和密码。SECRET
通过 Netlify 打开您的网站
输入YOUR SITE URL/admin/
现在你应该看到这样的屏幕：
点击后login with Github，您应该会看到以下屏幕：
等等！还有更多——重要信息
为了让 Gatsby 能够识别您在正确文件夹中新建的文件，您需要下载以下 Gatsby 插件：
npm install --save gatsby-source-filesystem
并将以下内容添加到您的gatsby-config.js文件中：
plugins: [
{
resolve: `gatsby-source-filesystem`,
options: {
name: `markdown-pages`,
path: `${__dirname}/content/posts/blog`, <-- your path
},
},
]
请务必提交您的更改！
返回内容管理系统：
现在，创建一个新的博客文章，然后点击提交按钮publish。这样做应该会自动将更改提交到你的代码仓库并创建一个新的博客文章！网站在 Netlify 中构建完成后，你应该就能看到你的新博客文章了！
封面图片：
取自此处
耶！🎉
文章来源：https://dev.to/thatgalnatalie/how-to-use-netlify-as-your-cms-for-your-gatsby-blog-6jm