Building KeystoneJS (to be continued)

Preamble:
为啥要写这篇文章:
仅仅是因为这个框架让我了解和学习了很多其他额外的东西,不吐不快。
最近一直在寻找一个简单方便的模板框架,了解了众多nodejs的blog 和 cms 框架,
如:
calypso,ghost, wordexpress, netlify-cms 电脑里装了一大坨各类项目。 
纠结来纠结去,感觉KeystoneJS更具有特色。

calypso, wordexpress 说到底依赖wordpress的phpserver,并且wordpress 异常难用
ghost git上目前最火的cms项目,十分简洁高大上,theme目前还是太少
keystone 他特别的地方是,前端代码完全交给你创造,吼吼,可能起点比较其他高了一丢丢。
但是做过wordpress,你会发现这是多么难得。

The next step is to record the entire process of my research on Keystone, which has little to do with the framework.

Demo:https://tobeone.herokuapp.com/home

make an outline

install keystone

The installation method can be seen on the official website.

To prepare, you need Node + MongoDB, make sure that you can switch several node versions in your computer, if you can't run it, just haha.

最好安装一个node 版本管理工具
npm install -g i
或者 Mac系统的可以安装brew,然后通过brew 安装nvm
brew install nvm

Here I will add, look at the project on github and the 4.0 version has come out, there are many major changes.

npm install --save keystone[@next](https://my.oschina.net/u/223423)

Forget it, the fastest way to do this directly, go to the demo :

git clone https://github.com/JedWatson/keystone-demo.git
cd keystone-demo
npm install

Learn about keystone and how to write it

This is not very good to describe drops. First you have to know nodejs, then the express framework, and one of the templates.

Of course, the more powerful part of keystone is that it does not depend on the express framework of the framework itself. You can use a koa framework by yourself.

At present, the template of jade is used , which belongs to the back-end rendering page. Of course, you can make a page that separates the front-end and back-end. But I don't think it makes much sense. At present, Ali is returning to react render seaver. If it is not an app class or a front-end business project, the separation of front-end and back-end is too obsessive.

Of course, the background management system of this project itself is a single-page application made of react + redux. Very convenient.

image

It is best to interpret the directory route and templates to correspond to each other, which is convenient for future maintenance. The code inside is still clearly visible. In the router, use res.locals to send data to the front end.

Catalog models are to define the fields you want and the business you need before designing. The data structure needs to be thought and defined in this directory in advance. It seems that the requirements for developers have been improved. :)

The public folder is some static resource files, such as js css. CSS can be configured to use less or sass.

It is recommended to read the documentation on the official website a little more to facilitate understanding. The author of the code advocates looking at the source code. :) Actually what I said was nonsense. As a front-end who usually only writes pages, there may be too many things that need to be mastered in advance.

Configure HTTP2

At first, I thought why he didn't consider HTTP2 at that time, because the express server itself does not support http2. Later, I studied many closed bugs of the project and recorded the code submission later. Combined with this source code, it is found that there is consideration in the code

try {
	// Use spdy if available
	https = require('spdy');
} catch (e) {
	https = require('https');
}

I don't know why it's not mentioned in the documentation, just need to install

npm install spdy -s

The following describes the process of my local generation of certificates and configuration of HTTPS

~ openssl genrsa -out privatekey.pem 1024
~ openssl req -new -key privatekey.pem -out certrequest.csr 
~ openssl x509 -req -in certrequest.csr -signkey privatekey.pem -out certificate.pem

I put it all in the keys folder

'ssl key': 'keys/privatekey.pem',
'ssl cert': 'keys/certificate.pem',

Then you can https://localhost:3001/ .

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325148237&siteId=291194637