strapi -- Open source Node.js Headless CMS to easily build customisable APIs

strapi

https://github.com/strapi/strapi

无头CMS， 支持非常简单地、快速地创建安全API。

优点：

获得对自己数据的控制权 ----  相对blog网站来说

自助选择服务器

数据库独立性

可定制

API creation made simple, secure and fast.

The most advanced open-source headless CMS to build powerful APIs with no effort.

Strapi is a free and open-source headless CMS delivering your content anywhere you need.

• Keep control over your data. With Strapi, you know where your data is stored, and you keep full control at all times.
• Self-hosted. You can host and scale Strapi projects the way you want. You can choose any hosting platform you want: AWS, Render, Netlify, Heroku, a VPS, or a dedicated server. You can scale as you grow, 100% independent.
• Database agnostic. Strapi works with SQL databases. You can choose the database you prefer: PostgreSQL, MySQL, MariaDB, and SQLite.
• Customizable. You can quickly build your logic by fully customizing APIs, routes, or plugins to fit your needs perfectly.

 

Quick Start

https://docs.strapi.io/developer-docs/latest/getting-started/quick-start.html

体验：

1. 通过starter可以简单创建blog工程， 包括frontend和backend，属于一个完整的fullstack app
2. 通过CMS后台，创建content-type， 对应model， 自动生成out-of-box应用， 包括数据库schema、API、router、service。不用编码实现后台， 相对传统的后台构建来说。
3. CMS后台对建立好的 content-type， 提供友好的内容创建界面。
4. API提供两种访问方法： rest 和 graphql 。
5. 安全相关： 提供账户管理、校色管理、授权管理。

 

starter -- 完整前后端例子

https://strapi.io/starters

 

SQL配置

https://docs.strapi.io/developer-docs/latest/setup-deployment-guides/configurations/databases/sqlite.html

默认生成本地sqlite文件。

 

存储在 .tmp/ 文件目录下

https://spectrum.chat/strapi/general/so-where-does-strapi-store-data~c448a7f5-dc7b-4feb-b93b-7556f79998af#:~:text=Default%20installation%20stores%20data%20in%20an%20SQLite%20database,MySQL%20and%20MariaDB.%20More%20info%20here%20https%3A%2F%2Fstrapi.io%2Fdocumentation%2F3.0.0-beta.x%2Fguides%2Fdatabases.html%23sqlite-installation%20Edited

 

REST API

https://docs.strapi.io/developer-docs/latest/developer-resources/database-apis-reference/rest-api.html#get-entries

The REST API allows accessing the content-types through API endpoints. Strapi automatically creates API endpoints when a content-type is created. API parameters can be used when querying API endpoints to refine the results.

 

https://docs.strapi.io/developer-docs/latest/getting-started/quick-start.html

There you are: the list of restaurants is accessible at http://localhost:1337/api/restaurants (opens new window).

GRAPHQL API

https://docs.strapi.io/developer-docs/latest/developer-resources/database-apis-reference/graphql-api.html#fetch-a-single-entry

The GraphQL API allows performing queries and mutations to interact with the content-types through Strapi's GraphQL plugin. Results can be filtered, sorted and paginated.

 

TESTING UI

https://www.gatsbyjs.com/docs/how-to/querying-data/running-queries-with-graphiql/#example-of-using-graphiql

GraphiQL is the GraphQL integrated development environment (IDE). It’s a powerful (and all-around awesome) tool you’ll use often while building Gatsby websites.

You can access it when your site’s development server is running—normally at http://localhost:8000/___graphql.

 

graphql规范

https://graphql.org/learn/queries/

 

与Gatsby集成

https://www.gatsbyjs.com/guides/strapi/

 

Unleash content of your Gatsby application by using a self-hosted open-source, Node.js headless CMS. Secure your content by hosting it on your own server, easily customize the Strapi admin panel as well as the API in 100% javascript. All this maintained by hundreds of contributors on Github

 

依赖插件

https://www.gatsbyjs.com/plugins/gatsby-source-strapi/

Source plugin for pulling documents into Gatsby from a Strapi API.

 

定制路径前缀

https://www.gatsbyjs.com/docs/how-to/previews-deploys-hosting/path-prefix/

Many applications are hosted at something other than the root (/) of their domain.

For example, a Gatsby blog could live at example.com/blog/, or a site could be hosted on GitHub Pages at example.github.io/my-gatsby-site/.

Each of these sites needs a prefix added to all paths on the site. So a link to /my-sweet-blog-post/ should be rewritten as /blog/my-sweet-blog-post.

In addition, links to various resources (JavaScript, CSS, images, and other static content) need the same prefix, so that the site continues to function correctly when served with the path prefix in place.

 

数据依赖注入组件

https://www.gatsbyjs.com/docs/conceptual/graphql-concepts/#where-does-gatsbys-graphql-schema-come-from

import React from "react"
import { graphql } from "gatsby"

export default function Page({ data }) {
  return (
    <div>
      <h1>About {data.site.siteMetadata.title}</h1>
      <p>We're a very cool website you should return to often.</p>
    </div>
  )
}

export const query = graphql`
  query {
    site {
      siteMetadata {
        title
      }
    }
  }
`

The result of the query is automatically inserted into your React component on the data prop. GraphQL and Gatsby let you ask for data and then immediately start using it.

 

blog starter -- 快速体验

https://github.com/strapi/starters-and-templates/tree/main/packages/starters/gatsby-blog

https://github.com/strapi/strapi-starter-gatsby-blog

 

Gatsby starter for creating a blog with Strapi.

This starter allows you to try Strapi with Gatsby with the example of a simple blog. It is fully customizable and due to the fact that it is open source, fully open to contributions. So do not hesitate to add new features and report bugs!

This starter uses the Strapi blog template

 

定制学习资料

https://strapi.io/blog/build-a-static-blog-with-gatsby-and-strapi

https://strapi.io/blog/build-a-blog-with-react-strapi-and-apollo