前端学习总结

前前后后,从对前端一无所知开始自学三个月,到如今作为前端开发工程师工作了三个月,这总共半年的时间里,我学到了什么,怎么学的。

一、前言

1.为什么要学前端开发?

我本来是想学java的,买了一堆java书籍,但怎么变成了学前端,已经无从根究,我自己也是没答案。不过既然已经走上了这条路,而且前端还算有趣,那就接着走下去吧。一个优秀的程序员不会只懂一门语言,因此,java什么的,早晚会接触到。也许,那不是java,而会是Haskell、Phython等任何编程语言。

2.前端开发是做什么的?

老实说,这问题我倾向于复制粘贴网上答案来应付了事。可想想逢年过节时,亲朋好友们百分百会问到这个问题,我就说一下吧。

敷衍的A:“做网站,搞网页开发的”。

偏科的B:“做UI设计的,做微信公众号的”。

装逼的C:“改变世界的”。

认真的D:“前端开发有许多方向,比如网站重构,UI设计,web应用开发,物联前端,前端AR...(省略一千字)”。

兼容性最强的万能答案:“写代码的,对,就是传说中的程序员!坐办公室用电脑的!”。

3.前端开发有钱途吗?

当然有,做啥没前途?乞讨乞到极致,也能乞成千万富翁。

一般来说,刚入门的新人,工资都高不到哪儿去,从1k到1w都有。注意,是刚入门,不是刚入行!管理层以下,绝大多数情况都是技术实力正比于薪资!

互联网发达地区的薪资水平会高一截,如北京上海深圳广州杭州,互联网公司会比其他行业公司的薪资水平高一截。同等能力下,牛逼的小公司比大公司的薪资要高一点。

4.我该怎么学前端?

这是个很大的问题。从学习方式来说,有自学与培训。从学习方法来讲,那真是没法数,每个人都有属于自己的合适的自己的方法,有的人觉得看看视频就能学会,有的是觉得光看书就完全get技能了,还有的人觉得在群里多和大佬们聊聊吹吹水就可以掌握想要的知识。

做梦吧。

前端有三大基础JavaScript、CSS、HTML。光HTML就不是上述方法能掌握的,更遑论JavaScript?JavaScript是门直译型的语言,是面向对象的。对象是啥,一只喵星人一个手机一个你就是一个对象。当然,JavaScript里的对象是代码组成的,而在JavaScript里,几乎一切都是对象。

但凡是对象,那肯定是复杂的。你复杂吗?为什么复杂?对象的复杂性,很大程度取决于它自身与其依赖的周围环境。人在陆地上可以活得好好的,扔进水里,能活几分钟?水陆环境的不同,增加了人的复杂些。换成你手机也一样,把它丢进火里或水里试试。

这跟JavaScript有什么关系?

没关系。

才怪。JavaScript是脚本语言,是条寄生虫,不寄生在宿主身上就没生命力的东西。它的宿主是什么?浏览器 or Node。

本质上,浏览器和Node都给JavaScript提供了运行时的环境,所以,这个东西,才是JavaScript的幕后老板。我们称之为JavaScript Interpreter,当然,不止这么一种叫法,还有什么Redering Engine等等,总之,它们都可以将JavaScript代码翻译成机器码,供计算机认识与使用。

没有灵魂的人,跟死人没什么两样。

JavaScript被翻译成机器码后,就有了灵魂,活过来了。

你看,JavaScript其实也是个对象。这么复杂的东西,光看书看视频听人说,能真正懂它吗?不能。这些行为最多帮我们知道它,了解它的知识体系与底层原理,顺便拓展一下眼界。要真正懂它,得不断地去使用它,以各种方式去使用它。

就像你跟一个姑娘谈恋爱,光看照片看她日志有什么用,你要牵她的手,亲吻她,拥抱她,爱她,跟她交流,做各种羞羞的事,才会真正懂她。不是么?

JavaScript尚且如此,包含它的整个前端还用说吗?

Just do it!

5.从哪里开始前端的第一步?

废话了一堆,来点干货。首先,回答问题前,我们来趟时空旅行。

1993年,超文本标记语言HTML(Hyper Text Markup Language)第一版面世,它只支持超链接的纯文本html文档。纯到什么地步?纯文本!超链接!没了。

纯文本是什么概念?在你的电脑桌面新建一个txt文档,在里面写上

hello world

保存文档为html类型。然后双击打开它,你就可以在浏览器里看到hello world了!这就是纯文本html文档,纯的不能再纯的一个网页。

超链接呢?以记事本方式打开刚才的文档,把hello world替换成

<a href="http://www.baidu.com">hello world</a>

保存。双击打开这文档,你会在浏览器里看到带下划线的hello world,点击它,如果你能上网,那么毫无疑问,它会跳转到百度的首页。这么一个简单的文档,居然可以链接到百度,神奇吗?这就是超链接。链接互联网上的所有。

时间往前走。

1994年,层叠样式表CSS(Cascading Style Sheets)问世,这时它还没成为标准,直到1996才有第一版标准。CSS做了什么?回答这个问题得先知道HTML干了什么。HTML定义了文档的类型与内容。CSS,则决定了这些内容该如何展现。如果把HTML文档比喻成一幅纸画,那么CSS就是造物主的神力,它可以让纸画上的猫咪隐身,也可以让纸画上的鲜花变换颜色,甚至能让里面的小鸟飞出来,让高山变成平地,让沧海变成桑田。梦幻吧。

打开刚才的文档,把内容替换成

<a href="http://www.baidu.com" style="color: red">hello world</a>

保存。双击打开它,你会在浏览器里看到红色的hello world。这里,style引入了CSS样式,color给这些文字打开了颜色的大门,red,涌入了进来,把它们染成了红色。

1996年,JavaScript第一版诞生。只有HTML与CSS的世界太单调,鸟会飞,却无法互相交流,猫咪看不到老鼠,老鼠也看不到猫,它们过着孤独的生活。这样的世界不真实,于是,JavaScript来了。JavaScript赋予了这些生命思考、感知与交流的能力,从此这世界变得无比精彩,无数文明诞生与消亡,演绎宇宙洪荒。

再次打开我们的文档,把内容替换成

<a href="http://www.baidu.com" style="color: red">hello world</a>
<script>
alert(‘ni hao‘);
</script>

保存。双击打开它,你会在浏览器里看到一个弹出的提示框,上面写着,ni hao。这里,script引入了JavaScript代码,alert表示弹出一个提示框,括号里的是提示的内容。没错,人类,你被浏览器发现了!它在向你打招呼!

(未完待续...)

时间: 2024-10-29 10:46:33

前端学习总结的相关文章

WEB前端学习笔记 一

最近时间比较充裕,整理了一下学习过的笔记,此篇笔记包含了:Html.Css.JavaScript.Jquery.以及使用帝国CMS或是织梦CMS建立自己的网站,也许也会整理一下PHP的笔记,如果时间允许会整理完全. 虽然笔记是从最基础的开始,但是,并不包含电脑的基础知识,所以你必须已经掌握了一些电脑的基本操作,比如开关机,你的电脑用的是什么操作系统,至少也要会用word和wps吧.浏览器是做什么的,什么拷贝.复制.粘贴.知道最基本的文件类型,如,文本文件,视频文件,图片文件,什么是可执行文件,分

【转载】前端学习路径

前端学习路径 什么是前端工程师? 总而言之前端工程师就是运用HTML/CSS/JavaScript等Web技术,在工作中配合设计师实现用户界面,和后端工程师进行数据对接,完成Web应用开发的职位. 开发工具 设计软件 前端工程师最首要的任务就是把设计师的设计图切好并翻译成代码,所以我们要学习一些设计软件的基础操作和切图方法. Photoshop 运用最广泛的设计软件,大部分人都在用它,很有必要学习一下 前端工程师必备的PS技能——切图篇 Sketch 轻量且功能强大,切图迅速高效,为UI设计而生

前端学习

TOP:前端学习==20%知识+80%能力 1.好教材 JS CSS javascript高级程序设计 精通CSS                                                    DOM编程艺术 CSS权威指南         2.练习 (1)教材代码*3 (2)FreeCodeCamp (3)计蒜客 (4)在线编程online--{MDN,W3Cschool} 3.工具栈 (1)Sublime Text插件--{1.Emmet--chart;  2.侧边栏

小小六的前端学习心得

打算写这篇文章已经好久了,但是文采不行,不知道如何下笔,今天终于鼓起勇气用我拙劣的作文水平来讲述一下这段时间我学习前端开发的心得. 先从我的专业说起.我本人是学计算机的.全名是叫计算机科学与技术(软件方向),学校虽然是一个211学校,学习成绩也还行,但是对于编程这一块,真的是很弱很弱.所以我对计算机编程真正的学习是从实习这段时间开始的.说到这里,我必须得感谢带我进入前端的学长.因为他我才能在今天坐在这里写这篇学习心得. 所以,首先最好是有一个愿意耐心的指导你学习的人,也就是一个好的师傅.他能根据

黑马程序员:从零基础到精通的前端学习路线

随着互联网的深入发展,前端开发工程师一跃成为市场上非常抢手的人才.很多同学,包括以前做UI的.Java的.或者对于IT完全零基础的同学都想学习前端.下图是网上流传甚广的一张前端学习思维导图,很多初学者表示看到这些密密麻麻的知识点就已经晕了.确实,前端是一门涵盖面很广的学科.但是想学前端的你也不用慌张,内容虽多但有迹可循,只要循序渐进就不怕学不好前端! 那么前端开发到底需要学什么?应该怎么学?接下来黑马程序员前端学院教你如何从零基础学习前端. 一.前端开发入门 在入门阶段,你首先要学会最基本的技能

前端学习 第六弹: javascript中的函数与闭包

前端学习 第六弹:  javascript中的函数与闭包 当function里嵌套function时,内部的function可以访问外部function里的变量 function foo(x) {    var tmp = 3;    function bar(y) {        alert(x + y + (++tmp));    }    bar(10);}foo(2) 这时无论怎么运行输出的都是16,但这不是闭包 如果我们返回内部函数,内部function会close-over外部fu

前端学习 第五弹: CSS (一)

前端学习 第五弹: CSS (一) 创建css: <link rel="stylesheet" type="text/css" href="mystyle.css" /> 外联 <style type="text/css"> hr {color: sienna;} p {margin-left: 20px;} body {background-image: url("images/back40

web前端学习路线

大三马上就要读完了,之前就是学习了下前端,之后也希望从事这一方面的职业,很多人都觉得前端很简单,其实并不是这样的,前端的入门是比较容易,但是要深入学习还是有写难度的,希望可以和大家一起学习,共同进步,这是写的第一篇短文,写得不好还望大家见谅. 前端学习: 1.HTML(超文本标记语言),主要是使用一些html标签搭建好网页的框架,这个是十分重要的,主要要学会怎么合理科学的划分页面. 2.CSS,层叠样式表是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等

前端学习笔记

If fear is cultivated;it will become stronger; If faith is cultivated;it will achieve mastery. -----<阿甘正传> 开通前端学习博客,每个阶段一个目标,总结自己的收获以及所犯错误,不忘初心,方得始终!

前端学习——JQuery Ajax使用经验

0.前言 在项目推进过程中经常使用Ajax,通过Jquery提供的函数可以非常方便的使用Ajax,但是在实际使用中也遇到一些问题,例如如何防止浏览器使用缓存,如何使用同步方式等.通过博文整理总结希望自身有所提高. 在这里通过一个加法例子说明问题.为了突出ajax,前端网页和后端PHP程序尽可能的简单. [前端]--add.html 图1 add页面 [后端]--add.php <?php // 返回JSON格式 header('Content-Type:application/json;char