A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© jql229660105 初级黑马   /  2019-8-25 16:12  /  1240 人查看  /  7 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

互联网的快速发展和激烈竞争,用户体验成为一个重要的关注点,导致专业前端工程师成为热门职业,各大公司对前端工程师的需求量都很大,要求也越来越高,优秀的前端工程师更是稀缺。个人感觉前端入门相对容易,但是也需要系统地认真学习,在打好基础后坚持学习,成为优秀前端工程师也只是时间问题。

学习任何知识最重要的都是兴趣,如果经过一段时间的学习感觉不喜欢,那可能强迫自己学习是很痛苦的,效果也不会好,毕竟这很可能就是以后很多年生存的技能。不过随着互联网行业的发展,前端必然是Web开发人员需要学习的知识,有时候是没有专业前端工程师一起合作的,所以即使不做专门的前端工程师,掌握基本的前端技能为工作    带来方便。

下面说一下个人对前端的理解:

前端要学习三个部分:HTML,CSS,JavaScript(简称JS),其中JS是重中之重,因此首先明确三个概念:
HTML是内容层,它的目的是表示一个HTML标签在页面里是个什么角色。
CSS是样式层,它的目的是表示一块内容以什么样的样式(字体、大小、颜色、宽高等)显示。
JS是行为层,它要做的是当用户触发某些行为时,会给内容和样式带来什么样的改变。
1. HTML/CSS部分。

(1)入门:

w3school上的HTML/CSS教程——技术手册式的教程,比较全面,照着实例敲一遍

Codeademy上的html&css课程——在线交互式编程平台,弄清楚基本概念和基本语法

慕课网(http://www.imooc.com/)上也有好多基础课程,大家可以看看

(2)进阶:

《精通CSS·高级Web标准解决方案》——对CSS有一个比较深入的学习,对核心技术了解

《HTML5权威指南》——非常全面的书,内容也很新,包含了HTML5+CSS3+JS DOM

2. JavaScript部分。

(1)入门:

w3school上的JS教程——比较详细的了解下JS的特性

《JavaScript DOM编程艺术》——讲js和DOM的基本知识和运用,了解JS和DOM可以做什么

(2)进阶:

《JavaScript高级程序设计》——JS圣经,比较全面,非常好的一本书,比犀牛书可阅读性强

《JavaScript权威指南》——传说中的犀牛书,好厚好厚的一本书,不适合入门,适合当工具书看

《JavaScript语言精粹》——很薄的一本书,但是可以帮助你快速了解JS的精华部分

(3)实战:

jQuery框架: w3school上的jQuery教程/Codeademy上的jQuery教程——了解Jquery(前两年用的框架较多,不过,最近三大框架很流行,JQuery地位有所下降)

《jQuery基础教程》——流行的前端框架,注重实用

(4)提高:

《高性能JavaScript》——讲如何提高js性能,以及构建和部署文件到生产环境的最佳实践

以上HTML,CSS,JavaScript学完,前端基本就可以说入门了,



最近特别流行的三大框架

Vue.js(https://cn.vuejs.org/)-国人开发,文档非常友好

React.js-facebook开发

Angular.js-Google开发

以上三个框架,如果真的想做前端的话,三个框架是必须学一个的,一个都没学,说实话,是不好意思说自己是前端的,可能说的有点过了,哈哈!

还有想成为全栈的话,还要学node,大家有机会可以了解下!!!
web前端的定义:是面向用户(浏览者)的互联网技术统称。主要包括Web界面的结构、Web界面的外观视觉表现以及Web界面的交互实现。

Web前端的分类:前端设计和前端架构。

HTML结构语言:超文本标记语言。

通过各种标记符号(标签)来代表网页中的内容元素、将网页中的内容结构化。

特点:通过浏览器来解析、文件名为html或htm。

     2.  CSS样式语言(样式表):实现表现与结构分离的样式设计语言。

控制网页的视觉表现及简单交互。通过浏览器来解析,文件名为css。

     3.  DW编码软件(dreamwaver)

两大主要功能:网页编程和管理网站。推荐版本:CS6/CC。

相关资源:1.HTML参考手册+CSS参考手册  2.DW软件安装  3.多款浏览器

网站的结构

网站是存放在服务器上的一个文件夹(根目录),是网站所有文件的集合。
网站中的各种文件按照文件类型或功用分门别类的整理存放。
文件的命名规则

网站中的所有文件命名全部用英文字母、数字、下划线、连字符的组合,其中不得包含汉字、空格和特殊字符。


HTML语法结构

1种符号:<>  所有的HTML语言diamante都必须被括在其中

2种标签格式:

双标签:成对出现。<标签名>开始,</标签名>结束。如:<title>无标题文档</title>  通常用于包含内容的元素。

单标签:只存在开始标签,不需要结束。如:<meta charset="utf-8">  表示无内容元素。
3个组成部分:标签、属性、值:     

语法结构:<标签名 属性=“值” 属性=“值”>...</标签名>   如:<meta charset="utf-8"> 

标签可以拥有属性,属性和值都卸载开始标签的尖括号中。
标签和属性之间用空格分割,多个属性之间也用空格分隔。
如果属性有对应的值,则属性和值之间是等式关系,且值需要写在英文引导中。
HTML编写规范

标签名和属性都使用小写
属性的值用双引号括起来
标签的使用符合嵌套规则


7 个回复

倒序浏览
能坚持学习的人都是最棒的。
回复 使用道具 举报
预测未来最好的方法就是去创造未来。
回复 使用道具 举报
不忘初心,坚持
回复 使用道具 举报
“有人说...学习是为了完善人生,而非享乐人生,追求卓越,成功就会在不经意间追上你……”
回复 使用道具 举报
选择了,便走下去。
回复 使用道具 举报
面对生活的选择,可怕的不是“大环境”,而是我们自己。勇于走出自己的舒适圈,勇于挑战自己,加油……
回复 使用道具 举报
今天很残酷 明天更残酷 后天很美好,坚持:5_229:}
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马