资讯专栏INFORMATION COLUMN

Node.js快速开发利器-Keystone.js

zhiwei / 2589人阅读

摘要:介绍是以和为基础搭建的开源的和应用程序平台。在官网上声称在中,用搭建数据驱动的网站应用程序和是最容易的。这样实现一个网站只要定义和写前端代码就好了。这应该是前端猴子接外包的一个利器吧。

介绍

Keystone是以Express和MongoDB为基础搭建的开源的Node.js CMS和web应用程序平台。

Keystone在官网上声称:在Node.js中,用Keystone搭建数据驱动的网站、应用程序和API是最容易的。

之所以出此狂言,背后还是有料的,Keystone自带以下功能:

内置Express.js和MongoDB

动态路由

实用的数据库域类型

自动生成管理员界面

基于数据模型的表单处理

会话管理和认证功能

我觉得keystone最牛逼的地方就是根据你定义的模型自动帮你实现后台管理界面,创建、管理、编辑和删除等,这得省掉很多功夫了。这样实现一个网站只要定义model和写前端代码就好了。

这应该是前端猴子接外包的一个利器吧。

安装准备

安装node.js 0.10+

安装mongodb v2.4+

安装yeoman npm install -g yo

安装keystone生成器 npm install -g generator-keystone

开始

创建项目目录
mkdir my-keystone

进入项目目录
cd my-keystone

生成代码
yo keystone

代码生成器会问你几个问题,比如项目名称,是否内置博客、相册和联系表单,是否添加User模型,添加管理员账户密码

安装依赖
npm install

运行项目
node keystone

打开http://localhost:3000 在浏览器查看
通过http://localhost:3000/keystone 打开后台管理

Model
var keystone = require("keystone"),
    Types = keystone.Field.Types;
 
var Post = new keystone.List("Post", {
    autokey: { path: "slug", from: "title", unique: true },
    map: { name: "title" },
    defaultSort: "-createdAt"
});
 
Post.add({
    title: { type: String, required: true },
    state: { type: Types.Select, options: "draft, published, archived", default: "draft" },
    author: { type: Types.Relationship, ref: "User" },
    createdAt: { type: Date, default: Date.now },
    publishedAt: Date,
    image: { type: Types.CloudinaryImage },
    content: {
        brief: { type: Types.Html, wysiwyg: true, height: 150 },
        extended: { type: Types.Html, wysiwyg: true, height: 400 }
    }
});
 
Post.defaultColumns = "title, state|20%, author, publishedAt|15%"
Post.register();

这是官网中给出的例子,一个文章的model,详情

不得不提一下,keystone的图片类型Types.CloudinaryImage,需要购买CloudinaryImage的服务,如果你不想用Cloudinary的服务的话,keystone还提供了Types.LocalFile,这样我们就可以把image改成:

image: { type: Types.LocalFile, dest: "public/upload", 
        prefix: "/upload",
        format: function(item, file){
            return "";
        }
    }

这里format是指针对后台管理用的
如果你想使用CDN服务的话,可以对图片文件夹进行了CDN同步,然后修改prefix为你的CDN提供商提供的前缀。

路由与视图

路由配置文件:routes/index.js
中间件:routes/middleware.js

var keystone = require("keystone"),
    middleware = require("./middleware"),
    importRoutes = keystone.importer(__dirname);
 
// 常用中间件
keystone.pre("routes", middleware.initErrorHandlers);
keystone.pre("routes", middleware.initLocals);
keystone.pre("render", middleware.flashMessages);
 
// 处理404错误
keystone.set("404", function(req, res, next) {
    res.notfound();
});
 
// 处理其它错误
keystone.set("500", function(err, req, res, next) {
    var title, message;
    if (err instanceof Error) {
        message = err.message;
        err = err.stack;
    }
    res.err(err, title, message);
});
 
// 加载路由
var routes = {
    views: importRoutes("./views")
};
 
// 绑定路由
exports = module.exports = function(app) {
    
    app.get("/", routes.views.index);
    
    // 在路由之前,通过中间件做任何事情
    app.get("/protected", middleware.requireUser, middleware.other, routes.views.protected);
    
}
配置

keystone提供了很多可配置项,你可以随心所欲地根据自己的需求配置,要了解Keystone支持的更多选项,请参见配置指南。

配置需要修改的文件是keystone.js

项目结构
|--lib
|  定制的库和代码
|--models
|  程序的数据库模型
|--public
|  公开的静态文件 (css、js、images等)
|--routes
|  |--api
|  |  程序的api控制器
|  |--views
|  |  程序的视图控制器
|  |--index.js
|  |  初始化程序的路由和视图
|  |--middleware.js
|  |  为路由定制的中间件
|--templates
|  |--includes
|  |  通用的 .jade 组件放这里
|  |--layouts
|  |  基础 .jade 布局放这里
|  |--mixins
|  |  通用的 .jade mixins放这里
|  |--views
|  |  程序的视图模板
|--updates
|  数据组装和迁移脚本
|--package.json
|  给npm的项目配置
|--keystone.js
|  启动程序的主脚本
缺点

keystone强大的自动生成的管理后台,也是给我使用限制的地方,支持增删改查、上传文件等基础功能,但是在一些业务定制下却有失灵活性,或许是我研究不透,目前官方也没有给出对后台管理定制的文档,后续我将研究下如何深度定制管理后台,如果可行的话再来分享。

参考

中文文档:http://keystonejs.com/zh/docs/
项目地址:https://github.com/keystonejs/keystone

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/78970.html

相关文章

  • keystone.js后台编辑器中上传图片

    摘要:使用时遇到一个问题后台使用做富文本编辑器,但其只提供了插入网络图片的功能,而不能上传和管理本地图片,好在提供了选项来为添加插件,开搞一在编辑器中添加插件上传图片插件下载插件并放到静态目录下配置在中增加如下配置项上传图片的上传图片插件二后台 使用keystone时遇到一个问题:keystone后台使用tinymce做富文本编辑器,但其只提供了插入网络图片的功能,而不能上传和管理本地图片,...

    googollee 评论0 收藏0
  • 关于Keystone.js安装时出现的一个新手可能会遇到的小问题的解决方法

    摘要:在执行如下命令之后如果你的电脑没有装,那么执行就会出现如下的显示不是内部或外部命令,也不是可运行的程序或批处理文件。是制作的生成器需要,官网是。使用来生成网站,如果没有安装的话,需要使用进行安装。解决方法安装后即可 在terminal执行如下命令之后 npm install -g generator-keystone 如果你的电脑没有装yo,那么执行 yo keystone 就会出...

    quietin 评论0 收藏0
  • Gulp.js:比 Grunt 更简单的自动化的项目构建利器

    摘要:是一款基于任务的设计模式的自动化工具,能给你的开发效率来一次飞跃。示例配置实现完整的自动编译并刷新网页官方网站使用文档插件列表 Gulp 是一款基于任务的设计模式的自动化工具,能给你的开发效率来一次飞跃。 在很多场合都会听到前端工和 node 程师推荐 Grunt 来实现项目的自动化,自动化可以自动完成 javascript/coffee/sass/less 等文件的的测试、检查、合并...

    Lsnsh 评论0 收藏0
  • 开发利器之IntelliJ IDEA学习笔记

    摘要:旨在记录自己的学习过程,方便日后遇到问题是及时查阅复习,另一方面也希望能帮助像笔者一样从来没使用过的人快速熟悉。 这篇文章主要记录的是本人学习使用IntelliJ IDEA的笔记,可能不是特别的详细。旨在记录自己的学习过程,方便日后遇到问题是及时查阅复习,另一方面也希望能帮助像笔者一样从来没使用过IDEA的人快速熟悉IDEA。文章错误之处还请各位大佬批评指正。(文末有本人的微信公众号,...

    马永翠 评论0 收藏0
  • 前端每周清单第 38 期: Node 9 发布,Kotlin 与 React,Netflix 架构解

    摘要:发布本周正式发布,包含了一系列的特性提升与问题修复,同时也在不断致力于将打造地更为轻巧与高性能。当然,姜振勇老师还会介绍的多种服务,包括大数据网络和安全,展现弹性安全和高可扩展性的全方位能力。 showImg(http://upload-images.jianshu.io/upload_images/1647496-2ce7598e6987d9af.jpg?imageMogr2/aut...

    Carbs 评论0 收藏0

发表评论

0条评论

zhiwei

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<