VUE开发的三个阶段
作者:admin 日期:2017-03-14长沙很多开发团队，看待vue还是一个新事物。我还记得半年前，一个项目经理从网站找到了iview这样的第三方组件库，准备使用，但是团队的现实情况是，vue刚开始使用，webpack没有使用经验。他还以为vue的第三方库跟jquery组件使用方式类似。
目前，身边也有不少朋友，还只把vue当页面渲染器用。并不太了解组件化方式。所以我画出这个阶段图，给vue传道时，可以节省一些口水。
选择适合自己的步调，不要太激进，一口吃不掉胖子。
脑图地址：
http://naotu.baidu.com/file/17f6177717e34b26775fa3bd8e91956e?token=f1078f80a16ed553
VUE2.0 组件功能测试(普通使用，非单文件组件)
作者:admin 日期:2017-03-07年后实战了两个移动端(前端)项目，收获良多
作者:admin 日期:2017-03-06年后实战了两个移动端(前端)项目，都是使用的VUE2.0，做的是多页面类型（非SPA），地址：
收获：
1、让我可以熟练的运用FLEX布局。估计提升了50%的布局效率。原来的多层结构、乱七八糟的修补型代码都被淘汰了，结构、样式都更加简洁。
2、熟练使用scss。之前已经用了小半年。但是有时候没有形成自己的scss书写模式。这次两个项目，最大的收获就是，小项目，不再细致考虑重用，除了页头页尾、导航，其它的布局块，全都一个个写单独的结构。这样脑子里不用思考命名、重用这些问题，写起来极快。
3、VUE的mixins功能充分发挥。多页面模式下的“共性功能”，全部提出来放到common.js中的mixins代码中，不用再写到每个页面的vm结构中。
4、试验了多个第三方组件、库。对于vue2.0生态的众多第三方组件有了实战经验。真实使用了element-ui(饿了么开源)。
5、搞清了iscoll之类滚动插件的利弊。---这里被视频课程中的老师带着，绕了一个大圈。以后再专门说这个技术问题。
6、自己试着写了一个VUE的小组件，对于组件的template模板使用的几种形式，有了更多选择。在多页面开发模式下，一些共性功能块，还是值得提炼成组件的。我这次提炼的组件的，就实现了“锁定长宽比的图片容器”。这个功能在页面中大量存在，写个组件能大大的提升效率。
实践vue-cli 2.0碰到的一些问题，官方教材上没有提到的一些事
作者:admin 日期:2017-02-12最近跟着慕课网的教材实战了一个项目：http://coding.imooc.com/learn/list/74.html（Vue.js高仿饿了么外卖App）。我从vue1.0到2.0都撸了一下代码，做出了例子。本文讲到的一些坑，都是根据我的笔记整理的，菜鸟们可参考，大牛请无视。
一、是否要升vue 2.0
vue版本已经升到2.*，所有配套的vueRouter、第三方组件，都跟着升到2.0。1.0的淘汰指日可待。因此没啥好犹豫的，能用2.0就直接升吧。
目前所有的官方文档已经升2.0了，但是网上流传的大量例子，都还是1.0的，因此实践前，请一定注意版本！请一定注意版本！请一定注意版本！
二、是否要使用vue-cli
要实践vue组件化、单页面应用的例子，请一定使用vue-cli。我之前没有使用脚手架，自己用Webpack实验，太麻烦了！说多了都是泪。如果使用vue-cli，基本上跟着教程走就行了。再次提到版本问题！--目前(2017年2月)默认vue init命令，安装的是2.0的脚手架。
三、npm大坑
如果你是新人，并不需要兼容之前1.0版本，那么恭喜你，请直接入2.0坑 ------vue init命令很容易就完成了，接下来的npm i安装是一个大坑。我在新手群里看到一半以上的新人都卡在这里。npm说白了，就是要把所有的依赖项安装好。我从头装了一下vue-cli2.0，并统计了一下，node_modules目录下有87个子目录，140M。
但这个过程并不会很顺利！
我在数次安装vue-cli的过程中，都没有一次搞定。基本流程是，装完后运行一下npm run dev---报错---根据报错信息，用npm i --save *** 修复某个依赖---再run---再报错---再修复.....修复个五六次，最后才出现locathost:8080的提示，浏览器中出现第一个demo页，这时候才叫安装成功！
有时候,npm奇慢无比，5分钟以上还没装完。这时候要果断ctrl+c，再次npm，或转用cnpm---cnpm安装过程也有坑，此处不展开，请自行百度。
我在这里分享一个纯净包，可直接越过冗长的npm i过程，这个包里面已经带上了node_modules目录，解压后直接npm run dev即可调试。
四、单页面还是多页面
vue推荐的方式是单页面应用(SPA)。但是实际情况，就本地区（长沙）来说，现实工作中，多页面方式更普遍。多页面方式一样也可以使用vue强大的组件系统和脚手架。在github.com搜索“vue2 multipage”,会得到不少多页面脚手架。此处不展开。
五、关于npm run build的几个参数
如果你九死一生走到这里，能生成dist目录下的文件的话，这才迈入了真正的实战。
config/index.js可以配置输出，以下几项可修改成如下：
assetsSubDirectory: 'static', //输出的依赖文件夹路径可自定义
assetsPublicPath: '', //默认值是assetsPublicPath: '/'，即引用的js以“/”开头，则必须在根路径下使用
productionSourceMap: false, //不输入.map调试文件
总结：
越过以上几道关，VUE的开发环境就基本搭建成功。意味着你可以愉快的调试代码，按一下ctrl+s存盘，就能在浏览器中看到相应的变化。Vue接下来的一千多个大坑，都在后面等着你......
一些关于vue的实践将陆续首发到本人技术博客上，长沙前端开发与培训，blog.258754.cn
推荐一个资源站：https://www.awesomes.cn/subject/vue(感谢佳浩提供资源线索)
2017年VUE2.0试手项目--奔奔算术
作者:admin 日期:2017-02-052016年终总结
作者:admin 日期:2017-01-26经历：
1、2016年，网站业务量减少，最大型的企业网站项目为云龙集团网站项目。
2、以顾问方式，为两家大型软件公司提供界面服务。
3、以顾问方式参与了WK及美一点移动端APP项目。更深刻的了解了创业型项目的甘苦。
4、使用d3.js技术框架，黄花机场触摸屏项目 。
技术：
2015年主要是把前端新概念进行了蜻蜓点水式的了解。2016年则是以VUE为突破口，完整的了解了MVVM体系的方方面面。过年前这个月，利用VUE1.0体系，重写了一个袖珍的SPA网站。然后购买了慕课网的【Vue.js高仿饿了么外卖App】的收费课程。两个项目互相印证。之前一直对VUE的组件、路由体系不太了解，此次无法回避，把这些知识点翻来覆去的看了个遍。也在segmentfault.com上提了不少问题，上面的网友很热情。
另外熟练了git命令行方式，熟练使用github.com。
通过优特项目，更加熟悉前后端配合/mock测试方式。
工具：
使用了更多基于nodejs的工具软件。对于Webpack这个大坑有了更多了解（不懂的也仍然很多）。
合作与分享：
继续以顾问方式参与项目。也带了几个前端学生。在知乎上回答了一定数量的问题，得到了一些关注。
生活：
搬家到河西，重新构建自己的工作圈。花了很多精力在孩子的学业上。
坚持跑步，完成了第二届长马（半马）完赛。与儿子一起踢足球、打乒乓。
2017愿景：
使用VUE构建具体的组件化项目。
学习小程序或是react native,打通APP开发通路。
备案号不在的日子里，学到了不少的新知识
作者:admin 日期:2016-12-29不知道咋的备案就失效了。好容易恢复了。备案号不在的这段半个月，学到了不少的新知识：
- * 完整的学习了git命令行，用命令行管理自己的仓库https://github.com/csdudu，并上传了几个小片段。建立gh-pages分支。以后需要演示的片段，全部都使用这个方法进行演示了。
- * 完整的了解了npm包管理的机制，编辑package.json，更多的npm语法。并且通过实战，了解到npm的一些坑：比如node版本的影响、cnpm的优缺点。
- * 基本搞懂了Webpack的运行机制，编辑webpack.config.js，常用loader。日常使用webpack-dev-server --inline --content-base .方式进行热更新。
- * 基于Webpack搞清了es6的import/require语法，投入使用。用loader方式打包vue工程。
- * 基本搞懂vue-router路由系统，开始制作一个SPA的demo，以用于以后PC端的仿FLASH类网站。
- * 恶补了许多vue组件的知识。
- * vue自定义指令的写法。
- * 了解了前端AJAX模拟的一些知识，比如mock server的工具、搭建方式。顺便学习了LeanCloud这种把数据库抽象为API的工具的基本用法。
接下来，要向VUE组件化开发、ES6语法，甚至React native的方向进军。微信小程序有时间也想试试。
给朋友写的一个小展示动画--同心圆飞出
作者:admin 日期:2016-11-14达内前端培训的真实个案
作者:admin 日期:2016-10-25我现任技术顾问的单位，有两个妹子前端人员，我现在进阶培训她们。小A，昨天跟她聊天得知，是不久前从达内培训出来的。她自述，在达内培训4个月，前端制作方向（另一个方向是前端设计），费用一万七。每天学习、作业安排得非常紧，以下是她给我的部分课程和习作目录，可以说，跟前端沾边、隔得远的，都学了：
.png)
但她求职效果不太理想，实际工作能力被主管评价“一般”，目前仅拿该岗位起薪。（这样说小A，有点让她难堪，但实际情况如此，我也希望她迎头赶上）。
此培训机构课程安排确实太杂。这种大而全的设置，某种程度上，更好迎合市场，让课程表华丽。刚入门的学生，并非学得多就能嚼得烂。即使我们知道任何培训机构，学员都有 先后之分，但这个学费也确实太贵了，性价比低。何况小A看上去，并不是那种不努力、不思考的学生。这点血汗钱，花得有得冤。
----------------------------
对比：我另一个女学生，自学四个月，在我这里听了几堂课，目前待遇比A要好。
在优特咨询为期一天的前端技术交流与培训
作者:admin 日期:2016-10-22经老同事推荐，昨日在优特咨询，与该公司技术人员进行了为期一天的前端技术交流与培训。
我介绍了目前我所了解的前端技术的大致形式。然后为大家重点分享了iconfont、bootstrap、vue.js、gulp工作流的内容。
会谈中大家多次发生热烈的讨论，主要讨论点包括：
如何前后端分离--vue(mvvm)模式的优缺点
切换体积较大的页面时，如何保证切换更流畅---讨论了浏览器缓存、SPA+AJAX+require等技术方式；
交流很愉快--对于后期技术合作，项目组领导也对我提出了诚意的邀请。
以己微薄之技，为更多的技术团队提供服务。
