2014年前端开发者如何提升自己

  大部分人非常在意个人在技术上的提升。但是保持对新技术的了解是一项不小的挑战, 毕竟我们需要的信息在数量上过于庞大。2012年里,伴随着前端发展的是大量的革命性突破和对前端的重新定义。

  我们在实践的路上飞速前进,具体的进步体现在使用抽象化,优秀的代码质量,维护性上的提升以及更好的性能。如果你实在忙到没有时间来跟上最新的技术,不用担心。

  随着假日的来临,我们就有了一些空闲的时间可以自己支配,我想,如果我把我收集的前端相关的精品讨论列表分享出来,那一定会对大家有一些帮助。你不需要把所有的都阅读一遍,但是这些相关的建议会让你了解更多相关的知识,为明年成为一名更好的前工程端开发师做准备。

  以下是一些关于前端开发的优秀的PPT,你可以通过文中的链接来访问。

  一、基础部分

  走在技术前沿的方法

  PPT:How to Stay Up to Date on Web Stuff , Chris Coyier

  即使技术相关的理念会不断变化,我们依然可以做到让自己处于技术的前沿。

  确保你的开发模式已经跟上时代

  PPT:A New Baseline for Front-End Developers , Rebecca Murphey

  曾经在我们编辑文件的时候,本地测试完然后传到ftp上是最常规的做法。我们通过一个前端是否能编写一个兼容ie6的页面来判断他的前端水平。我们在html,css和javascript中的技术都不够强悍。

  这样的情况在近几年有了很大的转变,随着工作方式的改进和各类工具的推出。前端开发越来越受到重视,这个主题讲解了前端在开发中的新起点。

  二、前端开发工程师的新起点

  理解浏览器在屏幕后面的工作原理

  PPT:So, You Want to Be a Front-End Engineer , David Mosher (Video )

  有些人会说,浏览器是他所知道的开发平台中最不稳定的一个。如果你是一个客户端开发工程师,理解浏览器内部工作原理会帮助你作出更好的决定,并且你也会赞叹那些最佳实践背后的种种辩论。在这个今年最好的主题之一里,david mosher会待你了解浏览器的解析和页面的渲染。

  了解web平台现在需要提供什么

  PPT:Tooling for the Modern Web App Developer , Addy Osmani

  web在不断的进化,了解这个平台中新出的技术不是一件容易的事情。html5的新特性让我们可以构建一个完全崭新的web应用,包含很多以前无法实现的特性(至少,在没有插件的情况下)。

  在这个主题中,我的队友eric会带你了解html5的痛苦边缘,关注很多解决现实世界问题的方案。你会了解媒体流,设备输入,现代css设计,媒体捕捉,文件i/o等等。

  三、工作方式

  web app开发工程师的工作方式

  无论你在使用coffeescript还是javascript,less还是sass,构建一个好的web应用在现在需要大量引用外部资源,框架,工具和结合工具来将他们整合到一起。简单地说,你需要一个打屁股用的实用腰带。

  在这个主题中,你会了解到当前前端系统的概况,并学习到一个新工具来整合这些系统,叫做yeoman。

  你还可以访问这个主题的扩展版本。

  PPT:Tooling For The Modern WebApp Developer

  web设计师的工作方式

  PPT:A Modern Web Designer’s Workflow , Chris Coyier (Video )

  今天我们对web构架师的要求很高。如果在以前,这个岗位名称已经表达了它所对应的工作,但是现在不仅仅是视觉设计岗位,甚至涉及到交互的构建。设计师需要考虑不同形状,不同尺寸,不同连接方式的不同设备,并且这些设备下都要能正常工作。

  作为一个设计师,你通常需要在团队之间沟通和分享代码,并且需要了解很多不同的技术。在这个主题中,chris coyier会说到很多令人赞叹的工具来帮助手头的工作更加顺利地完成,还会讨论应该做些什么来提供一个高水准的现代工作流。

  移动web开发的工作方式

  PPT:Mobile Web Developers Toolbelt , Pete Le Page (Video )

  移动端开发和PC端开发有很大的不同,这个主题讲述了各种工具来让移动web开发更加方便,让移动web开发更加容易。

  如何调试

  PPT:Secrets of the Chrome DevTools , Patrick Dubroy (Video )

  深度了解谷歌开发者工具

  四、面向未来的开发

  CSS

  PPT:The CSS of Tomorrow , Peter Gasston

  这个主题介绍了CSS给你现在的开发带来了什么,作为一个CSS程序员,如何利用CSS3来实现面向未来的开发。

  JAVASCRIPT

  PPT:The Future of JavaScript , Dave Herman

  了解ES6的新特性,以及使用方式

  WEB APPLICATIONS

  PPT:Web Components and the Future of Web App Development , Eric Bidelman

  如何更好地将各种新技术整合到你的web应用中。

  五、CSS

  CSS领域中的艺术

  PPT:All the New CSS Hawtness , Darcy Clarke

  这个主题介绍了最新的CSS实现以及相关的标准,并且学习到这些新的CSS技术是如何改变我们的日常开发。

  模块化CSS

  PPT:Your CSS Is a Mess , Jonathan Snook

  大部分人的CSS代码都是一团糟,在这个主题中,你会知道如何解决CSS的模块化问题,方便管理和维护。

  CSS的预处理器

  PPT:CSS Pre-Processors , Bermon Painter

  如果你还没有用过CSS预处理器,那你就OUT了。这个主题会对比较流行的几个CSS预处理器进行概述。

  文档

  PPT:A Better Future With KSS , Kyle Neath

  本主题介绍了Kyle的一个工具,KSS,用于生成CSS文件的文档和代码格式化。

  六、JavaScript

  代码风格的重要性

  PPT:Maintainable JavaScript , Nicholas Zakas

  编写有趣的JavaScript代码和编写专业的JavaScript代码是两码事,在Zakas的这个主题中,你会学习到如何做到编写可持续性维护的JavaScript代码

  构建大规模的APP

  PPT:SoundCloud’s Stack , Nick Fisher

  这个主题中,来自SoundCloud 的Nick Fisher会介绍他们公司开发一个大规模JavaScript APP的故事,并且分享他们的开发步骤以及如何提高开发效率。

  重新思考应用的结构

  PPT:Re-Imagining the Browser With AngularJS , Igor Minar

  在这个主题中,你会了解如何将未来Web平台的力量使用到当前的Web应用中。

  国际化

  PPT:Entschuldigen you, parlez vouz JavaScript , Sebastian Golasch (Video )

  这个主题中,Sebastian介绍了从如何定位现实世界中的国际化问题,到如何用优雅的方式进行解决。

  模式和原则

  PPT:The Plight of Pinocchio , Brandon Keepers

  我们需要将JavaScript作为一门真正的语言,就需要能在JavaScript上使用真正的语言会使用的各种最佳实践。JavaScript不再是一门玩具语言。

  什么时候来延迟(惰性)加载脚本

  PPT:How Late Is Later? , Massimiliano Marcon

  我们都知道延迟(惰性)加载脚本可以提高Web应用的加载时间,那么什么时候才是正确的时间来加载脚本呢?

  七、移动Web开发

  PPT:Creating Responsive HTML5 Touch Interfaces , Stephen Woods (Video | Audio )

  如何去解决UI和用户间交互的问题,避免这些陷阱是很多应用开发者在未来需要面对的。

  来自滚动条的挑战

  PPT:Embracing Touch: Cross-Platform Scrolling , Mark Dalgleish (Video )

  滚动效果是最流行的移动页面的方式。可惜滑动的效果总是不能与原生滚动条媲美。我们应该如何在移动浏览器上解决这个问题?

  原生,HTML5和混合的应用

  PPT:Native, HTML5 and Hybrid Mobile Development , Eran Zinman

  这个主题中,Eran分享了他在跨平台开发中的经验。

  性能,分布和facebook在HTML5上的实践

  PPT:On the Future of Mobile Web Apps , Simon Cross

  facebook利用HTML5做了什么?还有什么需要改进?

  移动开发的调试工具

  PPT:Mobile Debugging , Remy Sharp

  响应式设计技术

  PPT:Responsive Web Design: Clever Tips and Techniques , Vitaly Friedman

  这个主题提供了响应式设计实现的概述。

  八、Web Apps

  离线的web应用

  PPT:Offline Rules , Andrew Betts (Video )

  如何在Web应用中做到客户端的存储,并且如何将其用在提高网站的体验上。

  STATE OF THE ART

  PPT:Building Web Apps of the Future: Tomorrow, Today and Yesterday , Paul Kinlan (Audio )

  Paul介绍了如何构建面向未来的web app。

  客户端存储

  PPT:Storage in the Browser , Andrew Betts

  应用缓存

  PPT:Application Cache: Douchebag , Jake Archibald (Video )

  如何利用Application Cache来构建你的网站

  九、性能

  CSS

  PPT:High-Performance CSS , Paul Irish

  找出那些影响页面性能的CSS,比如引发浏览器绘制至少多70毫秒的box-shadow,以及解决方案。

  PPT:GitHub’s CSS Performance , Jon Rohan

  避免JANK

  PPT:Jank-Free: In Pursuit of Smooth Web Apps , Tom Wiltzius

  JANK是指当动画顿卡,特效执行缓慢,或者页面滚动慢时的一种状态。该主题介绍了如何避免这些状态。

  Web

  PPT:Building Faster Websites , Ilya Grigorik

  如何在网站的角度考虑整体性能的提升。

  JavaScript

  PPT:Breaking the JavaScript Speed Limit With V8 , Daniel Clifford

  如何打破V8执行脚本的速度限制。

  十、测试

  理解代码的不好的原因

  PPT:Why Our Code Smells , Brandon Keepers (Video )

  这个主题中,Brandon会介绍他日常的代码,寻找那些会引起问题的劣质代码,理解为什么会出现这些代码,并且这些代码意味着什么,最后介绍如何对其进行重构。

  CURRENT STATE OF THE ART

  PPT:JavaScript Testing: The Holy Grail , Adam Hawkins (Video )

  如何利用测试工具,来保证一个应用的体验。

  提高代码的可测试性

  PPT:Writing Testable JavaScript , Rebecca Murphey (Audio )

  十一、总结

  花在思考自己技术提升上的时间是非常值得的。磨练的越多,你就更有机会去成为一名优秀的工程师。

  这个列表不一定会覆盖今年所有优秀的PPT,不过还是希望能给大家提供一些指引。去阅读一些你感兴趣的。这样的阅读会提高你的能力,也希望能真正为你的日常开发提供帮助。

时间: 2024-11-03 03:24:38

2014年前端开发者如何提升自己的相关文章

[转]解读2014之前端篇:任性的颠覆式改变

http://www.infoq.com/cn/articles/2014-review-front-end-part 2014年,整个IT领域发生了许多深刻而又复杂的变化,InfoQ策划了“解读2014”年终技术盘点系列文章,希望能够给读者清晰地梳理出技术领域在这一年的发展变化,回顾过去,继续前行. 本篇是解读系列的前端篇,小编邀请到天猫前端团队的三七.铁军.不四.鬼道这四位专家来解读2014年前端领域最引人注目的几大热点. HTML5正式定稿,ECMAScript 6 规范从纸上走到现实 2

移动前端开发者必知必会:移动设备概述

由于工作岗位的变换带来工作内容的变动,对于移动站点的前端开发已经疏远了好几个月,在这好几个月中有非常多新的东西出现,自己所掌握的一些东西也已经陈旧,所以选择了这本书<HTML5触摸界面设计与开发>来系统地学习和整理一下关于移动站点前端开发的知识体系. 之所以选择这本书,一是由于这本书比較新,2014年04月发的第一版.其二是由于作者Stephen Woods,这是Flickr团队的资深前端,Yahoo主页的Javascript技术平台正是出自此人之手. 接下来的时间里会陆续上传关于这本书学习的

分享第二届中国前端开发者大会与会心得

第二届中国前端开发者大会(FDCon2017)是在上海举办的针对前端技术(HTML5,CSS,JS)的互联网开发者所举办的最盛大和权威的相关技术会议,由技术社区TopGeek主办.汇智Tek联合主办,致力于推动各类前端技术等在移动互联网领域的研发和应用. 随着新一代的前端技术的发展,给前端开发者带来巨大的创新应用实践机会,本大会以“高效前端开发实践和创新”为主题,内容涵盖电商.旅游.门户.搜索.分类广告.移动互联网等多种业态的技术经验分享,涉及各种WEB和APP前端开发技术和架构设计等方法论.

前端开发者进阶之ECMAScript新特性--Object.create

前端开发者进阶之ECMAScript新特性[一]--Object.create Object.create(prototype, descriptors) :创建一个具有指定原型且可选择性地包含指定属性的对象 参数:prototype 必需.  要用作原型的对象. 可以为 null.descriptors 可选. 包含一个或多个属性描述符的 JavaScript 对象."数据属性"是可获取且可设置值的属性. 数据属性描述符包含 value 特性,以及 writable.enumerab

有关网页渲染,每个前端开发者都该知道的那点事

[编者按]其实,有关网页渲染的文章很多,但是相关信息比较分散,且论述并不是很完整.如果要想对这个主题有个大致的了解,我们还得学习很多知识.因此,Web开发者Alexander Skutin 决定写一篇文章.他相信,这篇文章不仅能帮助初学者,也能对那些想要刷新知识结构的高级前端开发者有所裨益.原文地址 译文如下: 网页渲染必须在很早的阶段进行,可以早到页面布局刚刚定型.因为样式和脚本都会对网页渲染产生关键性的影响.所以专业开发者必须了解一些技巧,从而避免在实践的过程中遇到性能问题. 这篇文章不会研

做一个聪明的前端开发者

那么什么是聪明者,就是打架不出拳,直接用刀砍,或者更牛逼的就开枪! 那么如何做一个聪明的前端开发者? 很显然,就是用工具代替手工,用自动代替手动! 那到底是用什么工具呢,如下: 前端开发工具 工具有点多,但是都非常简单,或许你已经安装并使用过一些了. git,版本控制系统 node,JS运行平台 npm,node的包管理 yo,脚手架 grunt,项目构建工具 bower,项目依赖包管理 git,http://git-scm.com/ 据说是一款很厉害的版本控制系统,类似SVN,不过本人还没有所

20个为前端开发者准备的文档和指南

20个为前端开发者准备的文档和指南 来源:codeceo 发布时间:2016-07-27 阅读次数:358 0 是时候重新学习了!和以前一样,我收集了很多不同的学习资源,包括学习指南,学习文档,和其他有用的网站来帮助你在前端开发的不同领域里快速地进入状态. 所以请尽情享受我们的文档和指南系列的第九部分,并且不要忘了在评论区让我知道任何我没有找到的. 1. JavaScript Standard Style(JavaScript标准样式) 链接:http://standardjs.com Java

作为一名前端开发者,你有必要知道这些项目资源!

原创 2017-03-29 web小二 web前端开发 Take control of your own desting. 命运掌握在自己手上. 前面跟大家分享了一期<这些优质的资源网站,你知道多少呀?>里面主要分享了电子图书,图片资源,一些找资源的搜索引擎站点,今天再跟大家分享一期前端开发者们,必去的一些资源站点,里面主要以网站源码项目的下载为主.非常酷的资源网站,希望你不要错过. 1.CodePen:http://codepen.io/ 网站里有很多很酷的特效,而且可以看到效果的源代码,也

前端开发者手册

这是任何人都可以用来学习前端的实践手册, 它概述并讨论了前端工程的实践: 该如何学习以及实践时该使用什么工具. 撰写该手册的目的有两个: 一是为潜在以及正在实践的前端开发人员提供一个包括学习资料和开发工具的专业资源; 二是该手册可以被管理者, CTO, 讲师和猎头用来作为洞察前端开发的实践. 该手册的内容支持Web技术(HTML, CSS, DOM, 和 JavaScript), 并且手册提供的解决方案都直接建立在这些开放的技术之上. 手册中所引用的素材和讨论都是最好的或者当前前端开发者们需要面