分享一个用vue2 + node-webkit + koa2 + mongodb开辟的,能够及时编辑保留的桌面记事本。

记事本 《分享一个用vue2 + node-webkit + koa2 + mongodb开辟的,能够及时编辑保留的桌面记事本。》

该项目分为两部分:桌面客户端(node-webkit) + 效劳端(koa2)。

结果

《分享一个用vue2 + node-webkit + koa2 + mongodb开辟的,能够及时编辑保留的桌面记事本。》

源码地点

https://github.com/hu-ke/nw-t…

手艺栈

vue2 + node-webkit + koa2 + mongodb

数据存储

数据存储由用户登录状况决议。若用户已登录,数据存储在长途效劳器;用户未登录时,数据存储在localStorage。

项目构造

|-- nw-todo-app
| |-- client                // 客户端
|   |-- assets              // 种种静态资本 
|     |-- css               // 款式资本
|     |-- images            // 图片资本
|     |-- js                // js资本
|       |-- data.js         // 定义的数据存储构造
|       |-- fetch.js        // api要求文件
|       |-- index.js        // 营业逻辑文件
|       |-- taskManager.js  // 操纵使命的一些要领
|       |-- vue.min.js      // 依靠的vue库
|   |-- TodoManager.app     // 运用文件(能够直接翻开)
|   |-- app-screenshot.png  // 结果图
|   |-- index.html          // 页面
|   |-- package.json        // 设置文件
|   |-- README.md           // client申明文档
| |-- server                // 效劳端
|   |-- controllers         // 控制器
|     |-- index.js
|     |-- tasks.js          // 使命治理
|     |-- users.js          // 用户治理
|   |-- global              // 全局设置
|   |-- middlewares         // 中间件
|   |-- models
|     |-- tasks.js          // 使命模子
|     |-- users.js          // 用户模子
|   |-- test
|     |-- api.test.js       // 接口测试文件
|   |-- utils
|     |-- index.js          // 东西要领
|   |-- .babelrc            // ES6语法编译设置
|   |-- .eslintrc           // 代码范例
|   |-- package.json        // 项目及东西的依靠设置文件
|   |-- server.js           // 效劳启动进口
|   |-- README.md           // server申明文档
| |-- README.md             // 申明文档

客户端

运转

你能够像翻开平常Mac运用一样,直接翻开TodoManager.app文件运转。

开辟

TodoManager.app/Contents/MacOS/node-webkit .

效劳端

布置

效劳端已布置在我本身的效劳器上,不须要你举行布置啦。
固然假如你愿望将效劳端布置在你本身的效劳器上,你须要:

1.装置mongodb <br/>

2.将
client/js/fetch.js中的baseUrl改成你本身的效劳器地点。<br/>

3.启动node效劳。

装置依靠

npm install

启动

npm start

测试

npm test

功用

  • [x] 注册登录
  • [x] 当地/效劳端存储数据
  • [x] 及时编辑
  • [x] 重命名使命
  • [x] 增加/删除一个使命
  • [x] 转变使命状况

展现

注册登录

《分享一个用vue2 + node-webkit + koa2 + mongodb开辟的,能够及时编辑保留的桌面记事本。》
《分享一个用vue2 + node-webkit + koa2 + mongodb开辟的,能够及时编辑保留的桌面记事本。》

编辑

《分享一个用vue2 + node-webkit + koa2 + mongodb开辟的,能够及时编辑保留的桌面记事本。》

补充申明

本项目完成的功用比较简单。因为我之前没有写过node效劳和node-webkit桌面运用,所以本项目算是对这两者的一次窥伺和尝试吧。项目当中若存在的不足之处还望斧正。有什么好的发起也能够提哈~

    原文作者:胡柯
    原文地址: https://segmentfault.com/a/1190000013169863
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞