前端入门分享第一期

非常感谢大家点开这篇博客，以下是我对前端的一些理解以及如何快速入门前端课程的经验分享。

话说在10多年前，都没有职业的前端工程师QAQ，前端的业务往往由后端完成，因为那个时候并没有什么复杂的交互逻辑，并且互联网刚刚兴起，大家关心的往往是由无到有，而不重视锦上添花，随着技术的发展，现在可以很轻松的搭建出一个网站，由无到有的问题已经被解决了，所以大家都开始关注用户体验，大家可以把自己换到用户的角度去思考一下，当看到一些非常丑陋，速度缓慢的网站时自己心里的感受，并且用户体验这个东西是直接影响你产品的推销的。总之前端从后端的独立，代表了国家经济的高速发展QwQ，以及人民物质生活水平的极大提升

大家现在可能会非常纠结到底学什么呢，我该选前端，后端，还是算法什么的？（怎么老感觉你们是因为前端容易带作品才来前端的）其实我之前也有这种情结，但是学到后来我就发现，知识真的是相通的，比如前端js有图形界面编程的部分，而java在搞安卓开发的时候，也有图形界面编程，前端js搞服务器（没错，js也可以搞后端，大家的淘宝网前后端都是用js写的，没想到吧！），java也在搞服务器，总之，知识相通，不要怕现在的选择，要改完全来得急尤其是前端，可以实现低成本的尝试，稍微费一点时间就可以知道自己是否喜欢这个领域，入门简单啊！

后端的小伙伴可能会在配置各种开发工具时面临最大挑战，往往好多天都配置不好工具，甚至连代码都无法运行，但前端不同，前端的html，css，js是可以在寄生于浏览器环境的，所以只需要用文本编辑器就可以编写代码（你甚至可以用记事本来编写代码），并立刻执行，看到效果。所以前端对新手是非常友好的，前端的学习是由易到难的。

 

接下来给大家稍微普及一下前端的基础知识栈。

大家可能都了解过前端三板斧，html，css，js，html负责页面内容，css负责装饰页面，js负责交互逻辑，理论大家都听过，那我就给大家演示一下实际效果吧。     

我们就拿我们的官网开刀了，首先这是只有html的效果

-----------------------------------------------------------------------华丽分割线----------------------------------------------------------------------------------

--------------------------------------------------------------------华丽分割线--------------------------------------------------------------------------------

-----------------------------------------------------------------------华丽分割线----------------------------------------------------------------------------------

--------------------------------------------------------------------华丽分割线--------------------------------------------------------------------------------

是不是有种如果没有这条华丽分割线，你还以为这是纯文本的感觉？确实，html其实和文本差不了太多。

这样的网站.....相信没有人会愿意去查看，那么在添加了css之后呢。

是不是好了一点？but，这页面根本没法动啊，并且点击那些登录按钮什么的都没有任何作用，其实部分就属于交互设计这部分的

内容了，需要用js来搞定！

 

看完之后，相信大家对这个东西有了一定的了解了，大家可能觉得，搭建个图形界面有什么难的，点击按钮触发事件，无非也就是写几个函数....嘿嘿嘿，那我只能说大家还比较嫩了，其实以官网为例，右上角的那个用户按钮，就是这个玩意儿，它其实包含了4种状态，每种状态下的点击触发事件都是不同的，第一种是未登录状态，点击出现登录，注册，点击登录出现弹窗，点击注册跳转页面，第二种是萌新状态（用户身份是萌新），只有博客系统和个人系统，第三种是普通用户系统。。第四种是超管。。如果说没有开发经验的话，就这么一个小玩意儿就可​以让人崩溃，并且这其中设计到缓存技术（没错，大家注册账号时的头像我是做了缓存的，帮你们省流量），扩展性（大家现在的状态就是扩展出来的，以前是没有萌新这个用户身份的），这个小东西大概用了1000行左右的代码来实现。

总之，前端入门简单，不过深入后其学习难度还是不小的！大家要做好心理准备了！

接下来是学习方法的一些分享，因为html，css易学，上手快（当然深入是很难的，这是后话了），所以建议大家先利用课余时间，把它学习一下子，学习的时候可以多看慕课网上的课程，可以帮助大家快速上手（tip：f12打开控制台可以看代码哦！），学习方面如果有问题的话，可以直接找学长学姐问，没有关系的（其实我超期你们问我的QwQ）。推荐两个课程吧。

把html，css搞定以后，相信你已经能搭建一些漂亮的网页了，这个时候就可以进入到javascript这门语言的学习了，javascript是一门弱类型（声明变量不需要区分int，double，统一用var声明），解释型（运行时才编译成可执行文件）的语言，对新手比较友好，javascript由core（语法核心ECMASscipt），DOM(操作文档的API），BOM（操作浏览器的API）组成，大家可以从core入手去学习，逐步提高语言能力。

这本书很适合入门哦！可以去看看，工作室有，可以借的。

因为是入门分享，我就不过多的讲解技术什么的了，主要还是给大家一个方向吧。

 

然后的话，我就是说一下的我的学习经历吧，我是大一下上开始学习前端技术的，先是上慕课网上观看了一些教学视频，搭建了几个小网页自己玩，学习了html，css，js，然后就开始看书，那本高级程序设计看了2遍，其实一点都不高级。。。。然后学习了jquery，其间开发了一家教育网站的官方网站和我们工作室的官网，学习了设计模式，node.js，然后现在的话在搞一个比较大的比赛系统，也在搞微信小程序，做国创和科研。

还是有一点技术的，嘿嘿嘿，反正带你们是没有任何问题了。飘了飘了QwQ

工作室的未来就靠大家了！咱工作室这个地方很神奇的，和其他地方不一样，咱是纯学习组织，没啥花里胡哨的，像我们这一届，每天讨论的话题都是技术方面的，超有意思，我觉得咱工作室应该是最像公司的地方了。。。

这些是我看过的一些课程和书籍，大家加油了！

 

左边没看过多少的啊。。有点难的。

 

-------------------------------------------------------------------华丽分割线--------------------------------------------------------------------------------