- 博客(17)
- 收藏
- 关注
RSS订阅原创 关于开发的后台管理系统的整体架构及总结
1.从最初开发的技术栈选取、需求确认。已经针对具体情况的改进，该项目已经完成，下图是项目的整体架构2. 总结 1. 从开发一个项目开始，首先是要先明确需求、功能。然后根据功能确立合适的架构。项目开发中，明确需求是最主要的，否则在开发中修改会非常影响效率。 2. 在开发一个项目时，一个好的开发环境是提高开发效率的保证。因此工程化开发的配置也要重视，光靠搜索引擎查询会有很多问题。 3...
2018-06-15 10:49:39
6306
原创 前后端项目部署实践
当我们之前的项目前后端代码编码完成。就要最后一步部署。我们先来看一下项目目录。1.node_modules 依赖文件。这个是依据package.json安装的。前文介绍到，package.json记录生产和开发对应的依赖文件名及版本号。node_modules体积较大。对于这个项目来说就 150M,在上传服务器时建议先删除。2. server 服务器代码 必须3.static 静态资源 必须4. ...
2018-06-15 10:23:08
486
原创 React中页面收集用户信息及图形化展示
当用户进入对应的对应的页面，在React的生命周期函数里开始计时。当离开对应页面，触发componentWillUnmount计时函数。停止计时，并将计时时间发送给服务端。...
2018-06-15 00:24:35
1155
原创 koa2 关于登陆验证中间件以及HTML5 localStorage、sessionStorage使用反思
根据之前介绍的koa中间件原理。以及session的实现。所以我们要想判断用户登录，就要在服务端处理web请求的时候，判断是否是ctx.session.user(项目中添加的session是 user) 是否为undefined。下面我们看一下验证登陆的代码。首先，对于部分接口是不需要提前验证登陆情况的。对不需要验证的路由创立一个数组。如果请求是数组内的，那么就不需要验证，进入下一个中间件。 如果...
2018-06-14 23:54:51
1195
原创 关于node.js mysql操作及封装。
首先，我们先引入mysql库。创建与mysql的连接池。config里储存这数据库的信息。用Promise封装sql语句（用promise封装可以很好的防止回调地狱的现象）首先，从连接池中取出一个实例。建立连接。然后执行sql语句。如果发生错误，Promise状态变成error。成功获取到result数据，Promise状态变成resolve。然后释放线程池连接。（这里的回调函数要符合node.j...
2018-06-14 23:28:12
4438
1
原创 node.js koa2有关登陆状态的验证（cookie、session）
1.首先，要确保没有跨域问题并且客户端能传递cookie2.服务端添加koa-session 使用官网的demoapp.use(session(CONFIG, app));来添加session中间件。通过上面一行代码，我们就可以添加session，打开chrome开发者工具，通过下图我们可以看到添加的cookie。注意：因为我们设置http-only 所以控制台输入document.cookie ...
2018-06-14 22:24:09
3413
1
原创 ant-design表单处理和常用方法及自定义验证
首先要说一下antdesign这个框架API和demo丰富，而且开发环境提供对应的warning来纠正用户的错误。是一个很好的组件库。关于表单验证方面是依赖于 async-validator 库。百度的san-xui组件库的表单验证也是依赖与async-validator。说明这个库的实用性还是比较高，可以多了解一下。首先按照antDesign官网Demo。我们可以copy一个Form表单的de...
2018-06-14 18:41:23
27241
4
原创 前后端跨域请求处理以及携带cookie CORS实现（koa2）
首先，一个较大的web项目一般是由前端跟后台两方开发。为了解耦，一般是前端开发页面，后端开发接口然后部署到服务器上。前端使用Ajax访问服务端接口。这时候一般需要一个Restful API 来规定接口格式（接口文档）。而且因为Http协议是无状态的，如果遇到标识用户身份（比如登陆）的需要，需要cookie session来验证。面对这种跨域需求。我们可以通过cors来实现。具体理论 http://...
2018-06-14 18:06:13
7575
3
原创 React 项目搭建及目录结构
首先，关于React的配置可以先参考之前的博客。（React代码规范建议阅读 Airbnb React代码规范，提高代码质量。）上面就是前端项目的目录结构。static是静态资源目录。component是经过react编写的组件。css是整体布局的样式。util是写模块化的函数或工具函数。下面这张图是component的组成。每一个文件夹都是内部具体的组件。router是用来管理路由文件。 uti...
2018-06-14 16:23:41
16409
原创 koa开发中间件用于捕获异常
中间件。对 await next() 进行try catch .用于添加错误控制。这样当前端用户发起请求。后端出现报错等其他异常情况。就可以给前端一个标识，让用户明确错误信息。...
2018-06-10 12:50:49
1589
原创 webpack生产模式（上线）开发配置。
6.23M => new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify('production') })5.54 M
2018-05-31 11:43:28
1333
原创 node.js koa2 项目搭建（前后端分离开发）
D:\Git\usr\bin；安装Node情况下。可以用部分linux 命令 例如：ll 不支持ls -l支持
2018-05-18 21:52:45
3819
原创 关于ES6类的实例属性及在React组件中的应用
首先，我们看一下ES6类的定义与转化成对应ES5的写法上面的class对应的是ES6构造函数的写法。与之对应的是下面ES5的构造函数的写法。然后我再看AntDesign官方文档发现可以用实例属性简写。类似下图。这样写的好处一个是可以减少代码量。而且不需要额外绑定this。但是这要额外配置，babel-loader并不能通过。 transform-class-properties需要添加这个插件。才...
2018-05-06 15:25:03
607
原创 React+antDesign+webpack项目构建(支持按需加载和热更新)
"dependencies": { "antd": "^3.4.0", "babel-core": "^6.26.0", "babel-loader": "^7.1.4", "babel-plugin-import": "^1.7.0", "babel-preset-es2015"
2018-05-04 21:22:16
2910
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人