预览模式: 普通 | 列表

gulp-changed插件实现文件拷贝--只拷贝变动过的文件

作者:admin  日期:2016-04-07

 近日工作需要，每天要将一个目录下编辑过的html文件，拷贝到另一个路径下。用win自带的拷贝功能，太麻烦了，而且每次要去清点哪些文件变动了-----不如搞个小程序，自动实现。

gulp就是实现这一功能的利器，它的安装过程网上很多，就不再赘述。

gulpfile.js工作代码如下：
 
Javascript代码
  1. var gulp = require('gulp');  
  2.   
  3. // 依赖gulp-changed插件  
  4. var changed = require('gulp-changed');  
  5.   
  6. // 起始目录和目标目录，据说只支持相对路径，不过也够用了 
  7. var SRC = '*.html';  
  8. var DEST = 'dist';  
  9.   
  10. gulp.task('t', function () {  
  11.     return gulp.src(SRC)  
  12.               .pipe(changed(DEST))  
  13.               .pipe(gulp.dest(DEST));  
  14. });  
 
 
编辑完后，在当前目录下的cmd命令行模式下，运行 gulp t，即可完成拷贝过程。
分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 7051

牛肉粉与编程

作者:admin  日期:2016-03-26

 早起写程序。

 
写半道被一个问题卡住了:
vue写法：<button class="aaa" disabled>请问这个disabled属性如何动态绑定？
 
试了几种方法不得正解，提问到QQ群，无人解，郁闷中，肚子都气饿了，下楼吃碗津市牛肉粉先。何以解忧，唯有牛肉...
没想到在粉馆有奇遇，技术问题被解决了，往下拉看答案：
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
QQ群里的大BOSS起床了，一句话解决了问题。
http://www.html-js.com/article/Vuejs-Chinese-introductory-tutorial-Vuejs-2-Directives-instruction
分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4256

寻求合作，为长沙企业提供前端支持、人员培训

作者:admin  日期:2016-03-20

首先声明：嘟站长前端水平不高，会的东西统共就那么几样，在这个技术博客上都有罗列。大牛们请直接无视我的存在 。

长沙前端总体水平不高，不少高水平的人，都跑去北上广挣大钱去了。留下的很多前端人员都是从旧式“切图仔”转来的（我也一样），这些“留守”的人，正是目前的主要技术力量。
在长沙招聘前端不易，因此我一般建议朋友们自力更生，招聘加培训。 我在长沙工作了多年，同行熟，朋友多，有一定项目经验，时间也比较自由--因此我来帮团队带新人，是比较合适的。
 
我自己提供的服务，包括几个层次：
培训：适合自有前端但水平欠缺的团队，可以选择让我进行短线培训，讲解一些重要的技术点。
支持：团队碰到解决不了的前端技术问题，由我帮助解决。一般是远程帮忙。
参与：直接做页面、做活儿。
 
以上三种方式，都按小时计酬，成本由低至高。有需要的朋友，可以跟我联系。 QQ 258754
 
分类:服务报价 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4660

用Rxjs改写的的ajax函数--返回promise对象

作者:admin  日期:2016-03-16

代码如下：

Javascript代码
  1. function aj(url , type="GET" , data="json"){  
  2.     var final = Rx.Observable.fromPromise(  
  3.         $.ajax({  
  4.         type: type,  
  5.         url: url,  
  6.         dataType: data  
  7.         })  
  8.         .promise()  
  9.     );  
  10.     return final;  
  11. } 
  12. var aaa = aj("shopData/test.json");//把ajax结果赋给aaa,并做下一步处理 

这段代码使用了rx.js及jquery3的库，目前为止，似乎还只有jquery支持在ajax返回promise对象，我到mui论坛提了问，答复mui.ajax暂不支持promise对象。可见promise对象还未普遍使用。

分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 8247

实践了手机淘宝团队推荐的淘宝的lib-flexible方法

作者:admin  日期:2016-03-11
改编自淘宝的lib-flexible，页面宽度任意变化。这种方式的优点是适合于团队协作，量出尺寸就可以做绝对定位。请点击：http://blog.258754.cn/2016/lib-flexible/
分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4470

老刘求职记

作者:admin  日期:2016-02-24
老刘，吾前同事，.NET资深程序员。欲应聘某电商公司。老高，电商团队技术总监，年少成名，面试老刘。
 
二人会议室探讨技术良久，出。老高坦言老刘技术尚有缺陷，如“缓存穿越”、“缓存雪崩”云云。临行叮嘱，好好补习，假以时日，则心理价位可达，更高薪可期。老刘诺诺而退。
 
越两日，老刘于另一公司入职，薪水如其所期。老高闻之，笑而不语。 

 

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4432

用到和准备学习的一些新工具

作者:admin  日期:2016-02-20
  • - 装一个json序列化插件--https://chrome.google.com/webstore/category/apps?hl=zh-cn
  • - 总监推荐使用的github管理工具：sourceTree，官网可直接安装中文版，接下来学习使用
  • - 总监推荐使用的leanCloud，可用于生成后端API接口数据，已经注册帐号，准备试用
  • - 2016年刚推出的微信开发者工具---已经安装，但发现做CSS调试真机时，还是手续比较麻烦，因此对于普通的调试，还是用.css?id=***的老方法，只有一些实在需要精确调试，一定要看到CSS代码对应效果的地方，再使用这个。http://mp.weixin.qq.com/wiki/10/e5f772f4521da17fa0d7304f68b97d7e.html
分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4400

实测证明无用--网上流传的微信浏览器取消缓存的方法

作者:admin  日期:2016-02-15

 以下代码实测无用。可能是针对比较老版本的微信浏览器而言的。

 

XML/HTML代码
  1. <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />  
  2. <meta http-equiv="Pragma" content="no-cache" />  
  3. <meta http-equiv="Expires" content="0" />  

 

分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4624

ajax多信号逻辑的promise写法实现

作者:admin  日期:2016-02-11

ajax的这种多信号量情况经常遇上。比如：先从服务器得到一个信号变量A，如果A为真，再从服务器获取信号B,B为真，再......如果用传统的回调方式写，Ajax就是一大堆的callback堆叠，看得头疼，而且不好一层层用函数分开。

 解决这个问题，用到jQuery的deferred对象（参见阮一峰原文）：$.ajax()操作完成后，如果使用的是低于1.5.0版本的jQuery，返回的是XHR对象，你没法进行链式操作；如果高于1.5.0版本，返回的是deferred对象，可以进行链式操作。

 我写了个简化后的例子： 

Javascript代码
  1. $.ajax("/api-a")  
  2.      .done(function(data){  
  3.           console.log("第1步完成");  
  4.   
  5.           // 如果第1步数据中的result允许,则第2步  
  6.           if(data.result){fun2(); }  
  7.      })  
  8.      .fail(function(){ console.log("第1步失败") });  
  9.   
  10. //第2步操作可以放到一个函数中，这样看起来代码更清晰  
  11. function fun2() {  
  12.      $.ajax("/api-b" )  
  13.           .done(function(data){  
  14.                console.log("第2步完成");  
  15.                console.log(data);  
  16.           })  
  17.           .fail(function(){ console.log("第2步失败") });  
  18. }  

 

分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4478

2015全年总结---电商前端探索

作者:admin  日期:2016-02-04

昨天，我所在的电商项目组已经放了假，今天正式开始休息。 我放年假后第一要事，是写总结。 如果对一年的成绩还算满意，此事则令人喜悦--保有初心，不在于走了多远，而要时刻明白自己身在何方。

经历：

1、2015年仍然做了不少大企业网站（PC端）,值得一提的是博深集团、株洲轨道交通

2、跟共成团队合作了“云峰湖”、“拾得大地”两个较复杂的单页应用站（PC/移动端/响应式）

3、长沙银行新版改造

4、在YC电商团队短期工作，电商前端初探。

5、以顾问方式，参与ERP/XYG两个软件项目的界面改造（bootstrap/jquery）。

6、年末时，加入WK电商团队，电商前端再战 。

 

技术：

7、学习MVC/MVVM前端模式，项目中使用过avalon及vue.js

8、具体使用：mui框架，json解析，underscore，localstorage读写，前端的HTTP与缓存体系，iconfont(@font-face)

9、了解：gulp，webpack，requirejs，node.js

10、bootstrap+jquery插件

 

工具：

11、熟练sublime txt3+emmet

12、nodejs快速搭建本地环境

13、熟练chrome调试器

 

合作与分享：

14、实践了以顾问方式参与外包项目，日志计算工作量/取酬

15、与很多新老朋友，巩固联系、开始合作：老董、老高、草帽团队兄弟们、军亮、慧琼等

16、持续更新博客，分享进展，帮助同行

 

运动：

17、坚持跑步，完成了2个在线半程马拉松，10月长马（半马）完赛并创个人最好成绩。

18、参加HBD篮球队每周定期比赛。

 

2016愿景：

19、明年争取进入知乎/github，更多分享

20、完善整个电商前端技术线，以高效开发方式，做出1款较成熟产品

21、想在长沙组织一个持续前端交流的小圈子

22、官网改版

23、搬家到河西，离产业圈更近，运动环境更好。

写完。

分类:开发心得 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4536

我的知乎答案：我来说一下长沙前端开发岗位2016年的最新情况

作者:admin  日期:2016-01-28

 我来说一下长沙前端开发岗位2016年的最新情况。我今年经历的几个长沙的电商公司，2015年上半年招前端的价码基本是5-8K。下半年，已经坐地向上翻了2K。2016年初，新的电商公司招熟练工的价格是8-13K，前端组长15K以下，游戏方向可能会稍高一些，万达写字楼那边有家游戏公司专门用“白鹭”引擎的。。

另外一个事实，我朋友深圳的开发团队（水平跟我还有较大差距），普通前端工资13K以上，还基本上留不住人。但我在长沙绝对拿不到13K这个数。这说明长沙的工资水平还是偏低的。当然，要看市场上有没有人可招。出10K在长沙招前端，已经很动听了，但有价无市。

主要技能还是html5+css3+jquery，一般都要求PC+移动端经验。以下是加分项：CSS类框架任选一（比如bootstrap)，MVVM框架任选一（比如angular）、AJAX、HTTP、页面优化、加载优化、自动化工作流管理、各种CSS/js动画。游戏开发类，一些传统软件公司需要bootstrap类的界面前端开发，但此类人也比较少。

长沙一些中小团队，招人很难，尽管条件开得比较好（工资、奖金、休假、下午茶、环境）等，还是招不到牛人。或者换句话说，长沙市面上，根本没有散养的牛人。

坊内传闻，步步高云猴是长沙技术储备最丰富的公司。

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 15031

[转自知乎]前后端程序员的差别

作者:admin  日期:2016-01-24

 著作权归作者所有。

商业转载请联系作者获得授权，非商业转载请注明出处。
作者：匿名用户
链接：https://www.zhihu.com/question/39659771/answer/82457812
来源：知乎
 
我还要提醒大家别过分解读node，java语言为什么没有一个对应的名词呢？而Javascript有一个呢。所以别拿node跟人家装逼，本质就是Javascript语言，不过是插了翅膀。说白了，你用node那玩意，就好像一个穷逼（做的是事件驱动、异步编程、非阻塞IO小买卖赚的钱）进入了上层社会，那个装逼的过程。而当了好多年上层人士的java和C++，python等觉得你是个后进入圈子的暴发户。你们前端走的路，包括es6（国外有些大神对es6也有反对态度）、包管理器、加载器、打包工具、测试框架、QA 工具、MVC 框架和库、基于 Node 的 CMS 框架、模板引擎等。都是人家十几年前玩剩下的。而前端最值得装逼的本钱，那种java、C++等望而却步，就是你觉得很土逼的css、html，那个你觉得毫无高大上感觉的结构层和表现层，还有操作DOM、BOM的能力。后台开发永远会觉得你很牛逼，看看他们那无比崇拜你的小眼神，尤其看到你分析页面渲染过程，使用PS过程，切出页面效果，还有兼容问题处理。而当你跟人家谈论管理包、打包工具、测试工具、MVC，人家只能呵呵。看看前端MVC多么的挫，本来仅仅是整个网站架构的view层，自己居然分化出了所谓的MVC。你以为只有node下用gulp和grunt能开发出牛逼的自动化工具？人家java等是二货？只不过前端熟悉Javascript，自己的工具用自己的环境造罢了。我这么说不是要灭自己威风，助他人气势。我只不过要提醒大家我们的核心价值所在。
分类:开发心得 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 25725

疑问已解决：vue.js在采用ajax方式读入数据后，无法激活slide插件的滑动行为已经解决

作者:admin  日期:2016-01-22

在vue.js的git上面提交的issue:

 
我在mui+vue.js构建一个slide-pic组件，图片数据用ajax方式获取，vm数据能获取到，dom也发生了相应的改变。但数据读入后，无法激活slide组件的滑动行为。
 
以下是我做的一些探索:
直接使用vue初始化数据（非ajax）可以激活滑动行为。
使用jquery的append方式，把数据结合到dom后，也可以激活。
我将mui的slide-pic组件换成另一个滑动图插件TouchSlide1.1后，同样的现象，用vm方式无法激活。
 
请问这是什么原因？到底是vue还是mui/TouchSlide 插件机制的问题。
 
XML/HTML代码
  1. 以下是无法激活滑动的主要代码：  
  2.   
  3. <div id="slider" class="mui-slider" >  
  4.      <div class="mui-slider-group">  
  5.        <div class="mui-slider-item" v-for="el in list"><img :src="el.picUrl"> </div>  
  6.      </div>  
  7. </div>  
  8.   
  9. <script>  
  10. var vm = new Vue({  
  11.   el: '#slider',  
  12.   data: {list: [] }  
  13. });  
  14.   
  15.   
  16. // 读取图片slide  
  17. mui.ajax({ url: "shopData/slidePic.json", dataType: "json",  
  18.      success: function(data){  
  19.           vm.list = data.list;  
  20.           mui("#slider").slider({  
  21.                interval: 3000  
  22.           });  
  23.      }  
  24. });  
  25. </script>  
  26. ----------------------------------------------  
  27. 以下是可以成功激活的代码：  
  28.   
  29. mui.ajax({ url: "shopData/slidePic.json", dataType: "json",  
  30.      success: function(data){  
  31.           for (var i = 0; i < data.list.length; i++) {  
  32.                $(".mui-slider-group").append(  
  33.                     '<div class="mui-slider-item" ><img src="'+ data.list[i].picUrl + '"> </div>'  
  34.                );  
  35.           }  
  36.   
  37.           mui("#slider").slider({  
  38.                interval: 3000  
  39.           });  
  40.      }  
  41.   
  42. });  
  43.  
此问题由VUE及MUI的技术版主解答了，较常见，用nextTick就解决了。
 
代码如下：
XML/HTML代码
  1. vm_slide.$nextTick(function () {  
  2.  // DOM 现在更新了  
  3.  mui("#slider").slider({  
  4.  interval: 3000  
  5.  });  
  6. })  
 

 

Tags: mui vue slider ajax

分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 29724

长沙react.js前端的工资待遇--刚听到的小道消息

作者:admin  日期:2016-01-12

我跟一个创业团队的朋友A总聊天，得到的小道消息 ： 

--------------------------------------------------

A总 2016/1/12 9:36:42

是的，现在做react.js前景很不错。那个人在他们公司月薪3万。
仅作前端。

我 2016/1/12 9:37:09
 
哇，我要加油了。

A总 2016/1/12 9:37:34
百度，腾讯现在都极缺做react.js的人，据说这个技术出来满打满算不到1年半，会的人少的可怜
所以到处抢着要。
麻烦就是文档少，入门门槛有点搞，要好几个月才能真正上手项目。 

 

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 24202