前端开发是创建Web页面或app等前端界面呈现给用户的过程，通过HTML，CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现网际网路产品的用户界面互动。它从网页製作演变而来，名称上有很明显的时代特徵。在网际网路的演化进程中，网页製作是Web1.0时代的产物，早期网站主要内容都是静态，以图片和文字为主，用户使用网站的行为也以浏览为主。随着网际网路技术的发展和HTML5、CSS3的套用，现代网页更加美观，互动效果显着，功能更加强大。
移动网际网路带来了大量高性能的移动终端设备以及快速的无线网路，HTML5，node.jS的广泛套用，各类框架类库层出不穷。
基本介绍
- 中文名：Web前端开发
- 外文名：Web front-end development
- 主要技术：HTML、CSS、JS、jQuery等
- 主流框架技术：Vue.js、AngularJS、React等
- 套用领域：网站、小程式、Webapp开发等
发展历程
前端技术的发展是网际网路自身发展变化的一个缩影。
前端技术指通过浏览器到用户端计算机的统称，存贮于伺服器端的统称为后端技术。
前端开发主要职能就是把网站的界面更好地呈现给用户。
以前会Photoshop和Dreamweaver就可以製作网页，随着网站开发难度加大、开发方式多样，网页製作更接近传统的网站后台开发，网页製作更多被称为Web前端开发。前端技术包括4个部分：前端美工、浏览器兼容、CSS、HTML“传统”技术与Adobe AIR、Google Gears,以及概念性较强的互动式设计，艺术性较强的视觉设计等。
在Web1.0时代，由于网速和终端能力的限制，大部分网站只能呈现简单的图文信息，并不能满足用户在界面上的需求，对界面技术的要求也不高。随着硬体的完善、高性能浏览器的出现和宽频的普及，技术可以在用户体验方面实现更多种可能，前端技术领域迸发出旺盛的生命力。
2005年以后，网际网路进入Web2.0时代，各种类似桌面软体的Web套用大量涌现，前端由此发生了翻天覆地的变化。网页不再只是承载单一的文字和图片，各种富媒体让网页的内容更加生动，网页上软体化的互动形式为用户提供了更好的使用体验，这些都是基于前端技术实现的。
随着手机成为人们生活中不可或缺的一部分，成为人们身体的延伸，人们迎来了体验为王的时代。移动端的前端技术开发前景宽阔。此外，前端技术还能套用于智慧型电视、智慧型手錶甚至人工智慧领域。
核心技术
HTML语言
掌握HTML是网页的核心，是一种製作全球资讯网页面的标準语言，是全球资讯网浏览器使用的一种语言，它消除了不同计算机之间信息交流的障碍。因此，它是目前网路上套用最为广泛的语言，也是构成网页文档的主要语言，学好HTML是成为Web开发人员的基本条件。
HTML是一种标记语言，能够实现Web页面并在浏览器中显示。HTML5作为HTML的最新版本，引入了多项新技术，大大增强了对于套用的支持能力，使得Web技术不再局限于呈现网页内容。
随着CSS、JavaScript、Flash等技术的发展，Web对于套用的处理能力逐渐增强，用户浏览网页的体验已经有了较大的改善。不过HTML5中的几项新技术实现了质的突破，使得Web技术首次被认为能够接近于本地原生套用技术，开发Web套用真正成为开发者的一个选择。
HTML5可以使开发者的工作大大简化，理论上单次开发就可以在不同平台藉助浏览器运行，降低开发的成本，这也是产业界普遍认为HTML5技术的主要优点之一。AppMobi、摩托罗拉、Sencha、Appcelerator等公司均已推出了较为成熟的开发工具，支持HTML5套用的发展。
CSS
学好CSS是网页外观的重要一点，CSS可以帮助把网页外观做得更加美观。
JavaScript
学习JavaScript的基本语法，以及如何使用JavaScript编程将会提高开发人员的个人技能。
作业系统
了解Unix和Linux的基本知识，对于开发人员有益无害。
网路伺服器
了解Web伺服器，包括对Apache的基本配置，htaccess配置技巧的掌握等。
最佳化
- 儘量减少HTTP请求 (Make Fewer HTTP Requests)
- 减少DNS 查找 (Reduce DNS Lookups)
- 避免重定向 (Avoid Redirects)
- 使得 Ajax 可快取 (Make Ajax Cacheable)
- 延迟载入组件 (Post-load Components)
- 预载入组件 (Preload Components)
- 减少DOM元素数量 (Reduce the Number of DOM Elements)
- 切分组件到多个域 (Split Components Across Domains)
- 最小化iframe的数量 (Minimize the Number of iframes)
- 杜绝 http404错误 (No 404s)
以上10条涵盖了Web前端开发中遇到的各种页面处理技术，让前端开发人员能够準确和快速地把握整个网页的架构，从而达到减少开发成本和页面美化目的。
前端框架
学好Web框架
熟悉掌握HTML、伺服器端脚本语言、CSS和JavaScript之后，学习Web框架可以加快Web开发速度，节约时间。PHP程式设计师可选的框架包括CakePHP、CodeIgniter、Zend等，Python程式设计师喜欢使用Django和 webpy，Ruby程式设计师常用RoR。
随着Web 越来越规範和标準的统一，Web组件化技术不断革新，移动端开发不断升华，以下是一些常见开源前端框架：
Bootstrap
主流框架之一，Bootstrap 是基于 HTML、CSS、JavaScript的，它简洁灵活，使得 Web 开发更加快捷。
html5-boilerplate
该框架可以快速构建健壮，且适应力强的web app或网站。
Meteor
Meteor是新一代的开发即时web套用的开源框架，它能在较短时间内完成开发。
Semantic UI
基于自然语言有效原则的UI组件框架
Foundation
优秀的回响式前端框架
Materialize
基于材料设计的现代化回响式前端框架。可提供默认的样式，自定义组件。此外，Materialize还改进动画和过渡，为开发人员提供流畅的体验。
Pure
几乎可以在每一个web项目中使用的一组小的和回响式的CSS模组。
Vue
Vue.js 是用于构建互动式的 Web 界面的库。它提供了 MVVM 数据绑定和一个可组合的组件系统，具有简单、灵活的 API。
Skeleton
Skeleton 是一个小的 JS 和 CSS 档案的集合,可快速开发漂亮的网站,适合各种萤幕设备包括手机。Skeleton 基于 960 grid 开发。它是一个 UI 框架。
Amaze UI
国内首个开源HTML5跨屏前端框架产品系列，中文排版支持更优、本土化组件丰富。该产品系列中有专门针对移动端的HTML5混合套用开发框架Amaze UI Touch以及针对跨屏HTML5网页开发的Amaze UI Web。其中，Amaze UI Touch可以帮助开发者通过丰富的组件，快速构建出与原生APP相媲美的专属移动端的HTML5套用。
UIkit
一个轻量级的和模组化的前端框架,用于快速开发和功能强大的web接口。
Yui
Yahoo! UI Library (YUI) 是一个开放原始码的 JavaScript 函式馆，为了能建立一个高互动的网页，它採用了AJAX, DHTML 和 DOM 等程式码技术。它也包含了许多 CSS 资源。使用授权为 BSD许可证。
kissy
一款跨终端、模组化、高性能、使用简单的 JavaScript 框架。
MUI
最接近原生App体验的前端框架的框架。
Arale
一个开放、简单、易用的前端基础类库。
JX
JX 是模组化的非侵入式Web前端框架，特别适合构建和组织大规模、工业级的Web App。
GMU
GMU是基于zepto的mobile UI组件库，提供webapp、pad端简单易用的UI组件! Web App。
ZUI
开源HTML5前端框架
Clouda Touch.js
Touch.js是移动设备上的手势识别与事件库,也是在百度内部广泛使用的开发。
职业机会
2015年12月5日，《广州网际网路行业人才紧缺指数（TSI）报告》显示，前端开发工程师成为广州网际网路行业中最紧俏的职位。
常见前端开发工程师职位职责要求：
（1）使用Div+css并结合Javascript负责产品的前端开发和页面製作。
（2）熟悉W3C标準和各主流浏览器在前端开发中的差异，能熟练运用DIV+CSS，提供针对不同浏览器的前端页面解决方案。移动HTML5的性能和其他最佳化，为用户呈现最好的界面互动体验和最好的性能。
（3）负责相关产品的需求以及前端程式的实现，提供合理的前端架构。改进和最佳化开发工具、开发流程、和开发框架
（4）与产品、后台开发人员保持良好沟通，能快速理解、消化各方需求，并落实为具体的开发工作；能独立完成功能页面的设计与代码编写，配合产品团队完成功能页面的需求调研和分析。
（5）了解伺服器端的相关工作，在互动体验、产品设计等方面有自己的见解。
资深前端开发工程师
相比较“前端开发工程师”而言，更加资深，工作职责更大。一般而言，资深前端开发工程师需要使用JavaScript或者ActionScript来编写和封装具有良好性能的前端互动组件，熟练使用CSS+XHTML完美输出视觉界面。同时还要对Web项目的前端实现方案 提供专业指导和监督并在日常工作之中对新人及相关开发人员进行前端技能的培训和指导。另外，还要跟蹤研究前端技术，设计并实施全网前端最佳化。HTML5、node.js（JavaScript编程的后台语言）兴起，要求资深前端熟悉后端，并且要在商业模式、代码架构思想等维度去整体考虑前端的全局布局。
前端架构师
前端架构师更偏管理，但职责要求不仅限于管理。前端架构师需要带领组员实现全网的前端框架和最佳化，创建前端的相应标準和规範，完善并推广和套用自己的标準和框架。同时，还要站在全局的角色为整个网站的信息架构和技术选型提供专业意见和方案。