什么是前端工程师?
总而言之前端工程师就是运用HTML/CSS/JavaScript等Web技术,在工作中配合设计师实现用户界面,和后端工程师进行数据对接,完成Web应用开发的职位。开发工具
设计软件
前端工程师最首要的任务就是把设计师的设计图切好并翻译成代码,所以我们要学习一些设计软件的基础操作和切图方法。
Photoshop 运用最广泛的设计软件,大部分人都在用它,很有必要学习一下 前端工程师必备的PS技能——切图篇 Sketch 轻量且功能强大,切图迅速高效,为UI设计而生的Mac App Sketch切图教程编辑器
工欲善其事,必先利其器。可以用的编辑器和IDE有很多,在这里我只推荐最棒的两个。
Sublime text 最性感的编辑器,搭配插件各种好用 配置和使用方法 Webstorm 功能强大,学生可以免费用的前端开发IDE代码管理
不光要学会写代码,也要学会管理你的代码。在工作中你可能会遇到需要自己部署代码的情况;不停地修改迭代重构,当然也需要你掌握版本控制软件。
Linux 你需要学会在命令行打开移动复制文件等最基本的操作 Linux最常用的20条命令 鸟哥的linux私房菜——基础篇 Git 写代码一定会用到的版本控制软件,入门很快就能学会 猴子都能懂的Git入门测试工具
预览和调试必不可少,编写前端代码的大部分时间都是在编辑器和浏览器之间切来切去。
Chrome Dev Tools 谷歌浏览器开发工具,想要预览调试你的前端页面必须在这里啦
基础知识
HTML MDN的HTML入门 HTML30分钟快速入门 CSS MDN的CSS入门教程 学习CSS布局 JavaScript JavaScript菜鸟教程 慕课网JavaScript入门篇 Web 当你在浏览器中输入google.com并按下回车后发生了什么 互联网协议入门中级知识
HTML5 MDN的HTML5入门教程 网易云课堂HTML5入门 CSS3 CSS3菜鸟教程 Gitbook的CSS3教程 Style Guide 腾讯alloteam前端代码规范 百度ecomfe前端代码规范 Google HTML/CSS Style Guide Google JavaScript Style Guide Responsive Design 响应式设计指南 自适应网页设计——阮一峰 什么是响应式web设计?怎样进行? Web Animation CSS动画 Canvas动画教程 Learn to Create Animations in JavaScript Bootstrap Bootstrap菜鸟教程 慕课网玩转Bootstrap jQuery jQuery菜鸟教程 慕课网jQuery基础 Ajax jQuery Ajax快速入门 jQuery Ajax全解析高级知识
w3c标准 Web Platform Docs ECMA6 阮一峰ECMAScript6入门 测试FEX前端自动化测试探索 测试框架Mocha实例教程 Karma和Jasmine自动化单元测试 自动化构建
流式自动化构建工具Gulp 前端工程构建工具fis Web项目脚手架生成工具Yeoman 用Yeoman和AngularJS做Web应用 模块/包管理
npm npm使用介绍 快速搭建 Node.js 开发环境以及加速 npm Sea.js 5分钟上手Sea.js RequireJS ES6模块 预处理器
Haml Tutorial HTML代码简写法:Emmet和Haml Sass Sass入门 TypeScript TypeScript Handbook(中文版) 框架 React 入门实例教程 Vue vue.js教程 Angular
服务器端
Nodejs Node入门 7天学会NodeJS MongoDB NodeJS与MongoDB交互技能图谱
StuQ技能图谱 Frontend Knowledge Structure在线资源
大前端导航 Frontend Stuff Frontend directory Frontend Interview Questions在线教程
菜鸟教程 极客学院Wiki Mozilla开发者网络 front-end-web-development on Treehouse Learn to Code Advanced HTML/CSS在线书籍
Front-end Developer HandBook Front-end Database Frontend Notebook推荐书目
基础深入浅出HTML与CSS、XHTML HTML & CSS设计与构建网站 Pro Git中文版 鸟哥的linux私房菜 中级
Head First HTML5 Programming JavaScript权威指南 JavaScript语言精粹 JavaScript & jQuery交互式Web前端开发 深入浅出Ajax 高级
JavaScript高级程序设计 HTML5高级程序设计 CSS权威指南 深入浅出Node.js
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://www.haodehen.cn/did101662