分类 前端开发 下的文章

前端和设计的资料库

BAT等前端团队的贡献

  • 淘宝前端团队
    http://taobaofed.org/

  • 百度前端研发部
    http://fex.baidu.com/

  • 百度企业产品用户体验中心
    http://eux.baidu.com/

  • 腾讯Web前端Alloy团队
    http://www.alloyteam.com/

  • 凸凹实验室
    http://aotu.io/

  • 腾讯社交用户体验设计
    http://isux.tencent.com/

  • 携程设计委员会
    http://ued.ctrip.com/

  • 百度移动用户体验部
    http://mux.baidu.com/

  • 京东设计中心
    http://jdc.jd.com/

  • 国际体验设计协会
    http://ixdc.org/

  • 腾讯移动互联网设计团队
    http://mxd.tencent.com/

  • 360前端开发团队
    http://www.75team.com/

  • 视觉同盟
    http://www.visionunion.com/

  • UI中国
    http://www.ui.cn/

  • 新浪UED
    http://ued.sina.com.cn/

  • 百度EFE
    http://efe.baidu.com/

  • 崔凯的博客
    http://uicss.cn/

  • 张鑫旭的博客
    http://www.zhangxinxu.com/

  • 和硕联合科技
    http://www.pegadesign.com/chs/index.html

  • 阿里UED
    http://www.aliued.cn/

  • 网易用户体验中心
    http://uedc.163.com/

  • 站酷
    http://www.zcool.com.cn/

  • 蜂鸟网
    http://www.fengniao.com/

前端框架研究

CSS Framework

  • Bootstrap 3
  • Fundation
  • Semantic UI
  • Framework 7

WordPress Theme

  • Avada 3.7
  • Second Touch
  • The 7
  • Roots/Sage
  • U-Design
  • Cleanstart

WordPress Import Dummy Timeout

在 php.ini 中 max_execution_time = 120

free admin template

http://speckyboy.com/2014/05/16/free-bootstrap-admin-themes/

AngularJS Framework

https://github.com/Ye-Ting/angular-styleguide
https://github.com/Swiip/generator-gulp-angular

React Framework

https://github.com/Lucifier129/Lucifier129.github.io/issues/9

AngularJS群公告

Github——Angular学习资料集合(文章,视频)

https://github.com/jmcunningham/AngularJS-Learning/blob/master/ZH-CN.md

Github——Angular开源项目

https://github.com/angular/angular.js/wiki/Projects-using-AngularJS

阿里巴巴邹业盛Angular学习笔记

http://www.zouyesheng.com/angular.html

翻墙视频——《Angular最佳实践》

百度网盘地址:
http://pan.baidu.com/s/1bn4NUlp

交互式免费课程:Angular快速入门

国外的:http://www.learn-angular.org/#!/lessons/the-essentials
【点击该网页中的"I'm Stuck"按钮即可显示详细案例】
国内的:http://www.hubwiz.com/coursecenter?type=web
非视频教程,而是通过交互式编程来进行快速实践

angular插件网

http://ngmodules.org/
这个网站的插件都是为ng而生的,尽情享用吧!(不过也要适度哦)

兔子host的API

这次在openshift上host了,会比我自己host的稳定一些。
http://angular.aaronhuzhang.com/

兔子host的API,英文的

如果上不去官网,被墙,可以来我这看,不过我在澳洲,可能也比较慢。
http://aaronhuzhang.com/angularjs/angular/docs/api

AngularJS 中文文档感谢NgNice翻译

http://www.ngnice.com/docs/guide

实例交流

http://aaronhuzhang.com/angular_examples/list/
有什么例子在这里保存一下,其它有用的文章也可以存,大家以后方便交流,不要黑我的服务器,谢谢。
暂时没时间改样式,丑点就丑点,凑合用吧。

网页布局工具

不少美工的工作是:用PHOTOshop工具制作效果图给产品经理过目,再照效果图制作HTML页,最后交给工程师做成动态模板。

但是在当今的敏捷开发却认为应该尽量使用可重用组件来搭建系统,界面这块可以根据bootstrap的进行定制。首先确定文档结构,界面上的元素&要素等,其次才是考虑布局,页面的展示。

判断结构是否合理有个简单方法就是去掉页面的样式表,看页面结构逻辑是否清晰。而美工交给工程师的HTML,大多只有不断嵌套的DIV,看不到清晰的结构。而现在HTML5规范也更加注重文档结构的重要性,不只是花哨的外表。所以我认为可以省略效果图制作直接进行HTML编写,或者省略美工从效果图制作HTML这步,而交由系统前端开发人员直接制作成模板,这样就能制作语义清晰的页面,更可以站在组件重用的角度来简化后续开发过程。

所以前端开发人员也需要很精通样式表&页面布局等知识。“Firefox”插件里就有简单的工具来帮助工程师设计而不用借助PHOTOshop。并且PHOTOshop有个显著问题,那就是没有linux版本的这对我来说是不能忍受的。下面介绍两个工具。

  1. Color Picker 这是用来在网页上取色的。比FireBug里的工具要更快捷。
  2. MeasureIt On 这是用来测量网页元素尺寸的,FireBug只能测盒子的宽高,但是盒子之间的距离就得这个工具搞定啦。
  3. FireShot 这是用来网页截图的工具

另外,GIMP也在努力学习中。

www.000webhost.com