乐趣区

关于koa:Koa入门教程4开发并部署todolist应用

我的项目简介

todo-list 利用是一个罕用的练手利用。他次要蕴含以下几个性能:

  1. input 框增加工作,回车后增加到工作列表
  2. 点击工作列表条目,或点击条目后的删除按钮,能够删除一个 todo 我的项目
  3. 点击 实现 按钮,能够把某个条目标记为已实现

这个我的项目咱们采纳前后端齐全拆散的形式来开发

前端技术栈: Vue2.x、Axios、Vue-Router、Vuex、css3 Flex
后端技术栈:Koa1.x、koa-body-parser、koa-logger、koa-json

我的项目目录构造组织

在前后端拆散的我的项目中,我倡议采纳前端目录驱动的形式。即优先以前端架构进行组织,在前端目录架构中搁置一个后端目录 用于 api 服务并同时作为前端编译后果的托管容器进行部署。

起因在于,后端目录个别是用于部署的,而前端利用如果不是独自部署的话 则须要搁置到后端目录中一起托管。基于前端编译后输入的方便性,把后端目录放在前端目录外面,build 时就比拟不便了。

当然,你如果保持本人的目录哲学,也无可非议。

初始化

在我的项目根目录下,先应用 vue-cli 工具初始化一个基于 webpack 脚手架的 Vue2.x 我的项目。

npm i vue-cli -g
# 进入我的项目目录根
vue init webpack .
npm install

此时 前端目录和文件曾经创立结束。前端依赖也曾经装置。基于前端的 package.json 根底之上,咱们再

在我的项目根目录下执行

npm i koa-logger

未完待续

退出移动版