Node.js快速開發利器-Keystone.js

zhiwei 發布于2019-08-19 17:54 / 2590人閱讀

摘要：介紹是以和為基礎搭建的開源的和應用程序平臺。在官網上聲稱在中，用搭建數據驅動的網站應用程序和是最容易的。這樣實現一個網站只要定義和寫前端代碼就好了。這應該是前端猴子接外包的一個利器吧。

介紹

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

云服務器 GPU云服務器 python開發利器 node js Node.js node.js 騰訊

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/78970.html

在keystone.js后臺編輯器中上傳圖片

摘要：使用時遇到一個問題后臺使用做富文本編輯器，但其只提供了插入網絡圖片的功能，而不能上傳和管理本地圖片，好在提供了選項來為添加插件，開搞一在編輯器中添加插件上傳圖片插件下載插件并放到靜態目錄下配置在中增加如下配置項上傳圖片的上傳圖片插件二后臺使用keystone時遇到一個問題：keystone后臺使用tinymce做富文本編輯器，但其只提供了插入網絡圖片的功能，而不能上傳和管理本地圖片，...

googollee 2019-08-23 11:53 評論0 收藏0
關于Keystone.js安裝時出現的一個新手可能會遇到的小問題的解決方法

摘要：在執行如下命令之后如果你的電腦沒有裝，那么執行就會出現如下的顯示不是內部或外部命令，也不是可運行的程序或批處理文件。是制作的生成器需要，官網是。使用來生成網站，如果沒有安裝的話，需要使用進行安裝。解決方法安裝后即可在terminal執行如下命令之后 npm install -g generator-keystone 如果你的電腦沒有裝yo，那么執行 yo keystone 就會出...

quietin 2019-06-26 17:14 評論0 收藏0
Gulp.js：比 Grunt 更簡單的自動化的項目構建利器

摘要：是一款基于任務的設計模式的自動化工具，能給你的開發效率來一次飛躍。示例配置實現完整的自動編譯并刷新網頁官方網站使用文檔插件列表 Gulp 是一款基于任務的設計模式的自動化工具，能給你的開發效率來一次飛躍。在很多場合都會聽到前端工和 node 程師推薦 Grunt 來實現項目的自動化，自動化可以自動完成 javascript/coffee/sass/less 等文件的的測試、檢查、合并...

Lsnsh 2019-08-21 12:07 評論0 收藏0
開發利器之IntelliJ IDEA學習筆記

摘要：旨在記錄自己的學習過程，方便日后遇到問題是及時查閱復習，另一方面也希望能幫助像筆者一樣從來沒使用過的人快速熟悉。這篇文章主要記錄的是本人學習使用IntelliJ IDEA的筆記，可能不是特別的詳細。旨在記錄自己的學習過程，方便日后遇到問題是及時查閱復習，另一方面也希望能幫助像筆者一樣從來沒使用過IDEA的人快速熟悉IDEA。文章錯誤之處還請各位大佬批評指正。（文末有本人的微信公眾號，...

馬永翠 2019-08-19 11:08 評論0 收藏0
前端每周清單第 38 期: Node 9 發布，Kotlin 與 React，Netflix 架構解

摘要：發布本周正式發布，包含了一系列的特性提升與問題修復，同時也在不斷致力于將打造地更為輕巧與高性能。當然，姜振勇老師還會介紹的多種服務，包括大數據網絡和安全，展現彈性安全和高可擴展性的全方位能力。 showImg(http://upload-images.jianshu.io/upload_images/1647496-2ce7598e6987d9af.jpg?imageMogr2/aut...

Carbs 2019-08-21 17:29 評論0 收藏0