How build headless CMS 'Strapi'

GIT: Open source Node.js Headless CMS Strapi

First of all, I'm sorry that all my articles only talk about the things that the document does not have. I may have mentioned very little that the strapi document has detailed how to use Strapi. So you need to know what it is in advance.

I worte a blog 《搭建KeystoneJS》 a long time ago. KeystoneJS is really a good thing for me, but since I met strapi, I've learned what 'Headless CMS' is. I even use it on small projects, like Wechat application(《一起DIY》).

---

Strapi can help you quickly build a Back-end API system. You don't need to write code, build database or consider permission management by yourself.

OUTLINE

• How to install
• How to use GraphQL

How to install

First,let me talk about the doubts you will encounter when you first create a project by Strapi.

1. You may have created a project that you don't know how to push it in git.
2. When you pushed it to GIT and install it from the server, it always fails
3. When you create a table or do other settings, you don't know how to fix some exceptions in the whole project.

The install method which Strapi document provided https://strapi.io/documentation/3.0.0-alpha.x/getting-started/quick-start.html#_1-install-strapi-globally is an old method.

The new method in https://github.com/strapi/strapi

You can build it like this:

yarn create strapi-app my-project --quickstart

In this way, you don't need to install strapi global in your system. Another way is to use docker, https://github.com/strapi/strapi-docker

So first, create a project in your local server and open localhost:3307 to test if everything works ok. It's very important.

Then create a git address without Readme file. Upload all files to git.

Now, view the secret link: https://github.com/61FINTECH/deploy-strapi-on-aws . This article can help you better understand how to deploy to the AWS, Aliyun or other cloud services.

Last: Set your local SQL connect address to point to your remote server. Restart strapi dev environment. Update all fields, and then create a table structure operations which need to be performed on your local server. Then many code files will be created or updated automatically in your local system, push them on git. Make sure your local system didn't have any exceptions, and then your remote server will work successfully. You can update your codes in local project when your local server has exception. So everything's under control.

How to use GraphQL

Another reason for using strapi is that he supports GraphQL.

Find the plug-ins setting in the left menu bar.Install GraphQL plugin...Now a miracle has happened. Open http://localhost:1337/graphql

Input :

query {
  users {
    username
    email
  }
}

Tip: how to use it on the Wechat application.

Import file1: https://github.com/Authing/wxapp-graphql/blob/master/src/graphql/wxgql.js

Next:

	var gql = GraphQL(
		  {
			//设置全局url
			url: 'xxx', // url必填
			// url: 'http://localhost:1337/graphql',
			//设置全居动态header
			header: function () {
			  let userToken = wx.getStorageSync(USER_TOKEN);
			  let Authorization = ''
			  if (userToken && !params.token) {
				Authorization ={ 'Content-Type': 'application/json', 'X-Authorization': userToken.token }
			  } else {
				Authorization ={ 'Content-Type': 'application/json' }
			  }
			  return Authorization
			},
			before: function () {
			  tip.loading();
			},
			after: function() {
			  if(wx.isloading){ //防抖
				clearTimeout(wx.isloading);
				wx.isloading = null
			  }
			  wx.isloading = setTimeout(()=>{
				tip.loaded();
			  },500)
			},
			//设置全居错误拦截
			errorHandler: function (res) {
			  //do something
			}
		  }, true
		);
		module.exports = gql;

Next:

		import  gql  from  '@/utils/graphql';
		const getMaterails = (params) => {
			 return gql.query({
				query: `{
				  materials(where:{
					  ${params.class ? `classes: "${params.class}"` : ""}
				  }){
				    _id,
				    name
				}
				 }`
			  })
			}

来源：oschina

链接：https://my.oschina.net/xmqywx/blog/3161988