文档章节

搭建KeystoneJS

xmqywx
 xmqywx
发布于 2018/05/01 02:12
字数 1712
阅读 882
收藏 0
序言:
为啥要写这篇文章:
仅仅是因为这个框架让我了解和学习了很多其他额外的东西,不吐不快。
最近一直在寻找一个简单方便的模板框架,了解了众多nodejs的blog 和 cms 框架,
如:
calypso,ghost, wordexpress, netlify-cms 电脑里装了一大坨各类项目。 
纠结来纠结去,感觉KeystoneJS更具有特色。

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

接下来就是记录一下我研究Keystone的整个过程,和该框架关系并不大。

Demo:https://tobeone.herokuapp.com/home (working on)

列个提纲

安装keystone

安装方法可以看官网。

准备工作,需要Node + MongoDB ,确保你的电脑里可以切换几个node版本,万一你运行不起来,就呵呵了。

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

这里我我补充一下,看github上该项目 以及出来了4.0版本,有很多重大的改动。

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

算了还是直接干这个最快的办法,去找demo

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

了解keystone以及如何编写

这个是不大好形容滴。 首先得会nodejs,然后就是express框架,会一个其中的模板。

当然keystone更强大的地方在于他还可以不依赖,框架自身的express框架,你完全可以自己单独用个koa啥的框架。

目前是用jade的模板,属于后端渲染页面,当然你可以做一个前后端分离的页面。但是我觉得意义不大,目前阿里也在回归到react render seaver,假如不是app类,不是前端业务项目,前后端分离就过于执念。

当然这个项目本身后台管理系统就是用的react + redux做的单页面应用。十分的方便。

image

解读一下目录route 和 templates 最好能相互对应,方便以后维护。 里面的代码还是清晰可见的。在router里面,使用res.locals往前端发送数据。

目录models是 要在设计之前,定义好你要的字段,和需要的业务。数据结构都需要你事先想好定义好在这个目录里面,貌似对开发人员的要求又有点提高了。:)

public文件夹是一些静态资源文件,比如js css。css可以配置是用less 还是 sass。

建议还是稍微再阅读一下官网的文档,方便理解,代码的作者提倡看一下源码。:)其实我说的也是废话。作为一个平时只写页面的前端来说,可能需要提前掌握的东西实在太多。

配置HTTP2

一开始我认为他当时为啥没有考虑HTTP2, 因为express server自身是不支持http2, 后来研究了该项目的很多关闭的bug,已经后来的代码提交记录。结合这源码,发现代码里是有考虑的

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

不知道为啥目前没在文档里提到,只需要安装

npm install spdy -s

下面介绍一下我本地生成证书,配置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

我都放在了 keys这个文件夹

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

然后就可以https://localhost:3001/ 了。

部署到heroku

这个项目keystonejs 的github上提到了一个东西,Heroku。一开始真滴不知道干什么的。后来google了一下,哇塞,不错,==免费==的云服务啊!!。。

相当方便,主要是方便到了连上传代码都那么自在。

首先下载一个 Heroku,然后注册一下 CLI(OSX) 首先全局登录

heroku login

这里就是说一下nodejs项目的部署过程,相当的方便 只需要在你当前的git项目目录下

heroku create
//然后push
git push heroku master
//最后
heroku open

image 然后你会发现远程分支就会有两个。 下次你的git分支有更新,只需要在你提交完你的分支之后。 执行

git push heroku master

其他还有很多操作比如切换分支发布,比如定义系统变量,比如查看发布log等等。还是去看文档喽:) Document

注册使用MongoLab云database

因为Keystonejs使用的MongoDB,so 在heroku整个database, 这一步当时没有按照Heroku提供的方式来:(

我是直接去了官网 重新注册了个账户,然后选择的AWS的服务。数据库说实话国内访问是略微慢了一点。==免费==!!! 然后注意需要创建一个用户,然后你就可以自己copy一下你的数据库地址去使用了。 image

将相关信息填到你的根目录下的keystone.js init方法里面 'mongo'

使用cloudinary云服务存图片

cloudinary这个==免费==的服务器,其实也提供了很多云服务,我选择了他们的Media Cloud

弄完一系列之后,Dashborad上你会看到你的Account Detail。将相关信息填到你的根目录下的keystone.js init方法 里面,'cloudinary config'。 image 如何在代码里面使用cloudinary,只需要在项目目录里该model里面把需要上传img的字段定义为CloudinaryImage。

Post.add({

	image: { type: Types.CloudinaryImage },
	content: {
		brief: { type: Types.Html, wysiwyg: true, height: 150 },
		extended: { type: Types.Html, wysiwyg: true, height: 400 },
	},

});

注册使用mailchimp邮件系统

因为该CMS一开始就说到了可以发邮件。那么它里面也配置了mailchimp一只大猩猩。

可以去看视频研究一下 https://kb.mailchimp.com/

将相关信息填到你的根目录下的keystone.js init方法 里面,'mandrill api key'

总结

总结:后面有些新的东西我还没具体研究,只能说作为工具可以使用了,搭建起来了,每个新事物都有其精彩的地方。

KeystoneJS我感觉介于单纯的MVC 和 完善的CMS 之前的框架。他把能够自定义 和想去 自定义的东西给让你做决定。

最大的痛点,想去用他,首先你得是个程序员。。:)

我打算把这个keystonejs的demo继续做下去,边做边学习。
之后我会补充一下结合graphql的使用。

© 著作权归作者所有

xmqywx
粉丝 11
博文 27
码字总数 9688
作品 0
青岛
程序员
私信 提问
KeystoneJS — Node.js CMS 和 Web 应用程序平台

KeystoneJS,以 Express 和 MongoDB 为基础搭建的 Node.js CMS 和 Web 应用程序平台。Keystone 会为你配置 express(node.js 上的 Web 服务器),用 Mongoose(领先的 ODM 包)连接你的 Mong...

局长
2016/11/30
112
0
寻求路由解决方案!多谢多谢!

您好!我正在开发一个网站,前端使用reactjs, ant design, mobx等,已经基本实现。现在计划使用keystoneJs搭建后台CRM,路由配置上遇到问题,做好的前端页面链接不到,也没有报错信息,尝试过...

George_Michael
2017/03/06
178
0
KeystoneJS之云中漫步

Keystone是以Express和MongoDB为基础搭建的Node.js CMS和Web应用程序平台。 自从三年前接触到Node.js,我就开始定期在GitHub上搜一下跟Node.js相关的项目。搜索结果列表变得越来越长,这个开...

WuHaixing
2015/06/08
908
0
Node.js CMS 和 Web 应用程序平台--KeystoneJS

KeystoneJS,以 Express 和 MongoDB 为基础搭建的 Node.js CMS 和 Web 应用程序平台。 具有以下特性: Express.js 和 MongoDB:Keystone 会为你配置 express(node.js 上的 Web 服务器),用...

匿名
2016/11/29
7.8K
3
推荐基于 Node 的 CMS 框架

cnode上有朋友发帖,求:node.js信息类网站开源系统,于是有此篇,稍作整理 KeystoneJS:强大的 CMS 和 web 应用框架。 https://github.com/keystonejs/keystone Reaction Commerce:拥有实时...

i5ting
2016/03/16
1K
1

没有更多内容

加载失败,请刷新页面

加载更多

AliOS Things 3.0 应用开发指南

目录 应用开发框架介绍 使用条件 快速开始 第一步:下载AliOS Things 3.0源码 第二步:添加AOS_SDK_PATH环境变量 第三步:AliOS Studio中创建应用工程 编译、烧录、调试 其他说明 参考文档 ...

阿里云官方博客
36分钟前
3
0
日期和月份的计算

需求一 根据 【首次任务开始时间】和【任务间隔时间】和【每个任务持续时间】和【任务次数】计算出每个任务的时间 // 数据计算方法 async dateCalculation() { const firstD...

沉迷代码我爱学习
42分钟前
2
0
Spring Cloud Gateway 之请求坑位[微服务IP不同请求会失败]

问题产生背景 在使用Spring Cloud Gateway过程中,希望配置多Routes映射不同的微服务,因为Gateway 和Zuul的访问路径不同(zuul 会带有服务service Id),造成错误。 现象表现 问题定位 认为是...

IsaacZhang
52分钟前
5
0
Vue nodejs商城项目-搭建express框架环境

本文转载于:专业的前端网站➯Vue nodejs商城项目-搭建express框架环境 1.express-project 搭建express框架环境 安装express generator生成器 通过生成器自动创建项目 配置分析 安装 cnpm i -...

前端老手
59分钟前
3
0
maven项目A引入maven项目B的jar包

首先打开 项目B 的 pom 文件,加入如下配置 <build> <plugins> <plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-compiler-plugin<......

嘴角轻扬30
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部