ɦ5;Hi~ o(*￣▽￣*)ブuiɦ5;

文章最后附有史上最详细、最易理解框架整理618;

前端开发学习线路整理

目录

ɦ5;Hi~ o(*￣▽￣*)ブuiɦ5;

前端开发学习线路整理

一、通用编程基础

1.编程语言

2.数据结构和算法

3.网络协议

4.设计模式

二、基本开发工具

1.IDE/编辑器

2.版本控制工具

3.浏览器

三、前端开发史诗级三件套

1.HTML

2.css

3.javascript

四、封装库/工具库

1、数据可视化

2、UI框架

3.编辑器

4.组件库

5.动画

6.mock数据

---

一、通用编程基础

1.编程语言

编程语言分为好多好多种࿰c;但本菜鸟感觉࿰c;编程思想万变不离其宗࿰c;重要源头由c、c++延伸而来。但不得不说࿰c;c、c++还是最原始最难学习的语言࿰c;如果学习战线较长的话࿰c;还是从c开始࿰c;但如果接受过程特别痛苦且难以忍受的情况下࿰c;也还可以先接触python也未尝不可࿰c;每个人的学习路线也不一定是一条路。

市面上最常见的语言除了C、C++外࿰c;还有python、javascript、以及最近很迷的go语言等等等等࿰c;每种语言࿰c;都有他们独特的魅力࿰c;但在我看来࿰c;他们的祖宗还是C࿰c;或者也可以说C是他们的后代࿰c;这个还是靠自己的理解。

（就是它࿰c;折磨了我大一半个学期的c语言࿰c;哭😢）

2.数据结构和算法

这个数据结构说起来还是块硬骨头࿰c;当时我啃的时候࿰c;可是卡掉两颗牙࿰c;呜呜😣。。。。

数据结构分为了：字符串、数组、链表、堆、栈、队列、树........

还有一些令人头疼的算法࿰c;我当时接触的是一小部分比较简单的࿰c;一些高深莫测的还没有接触。

（总的来说这一部分࿰c;对于小白来说࿰c;接触起来挺烧脑࿰c;但学会了很有成就感🤗࿰c;因为你可以时不时飙出几个别人听不懂的词汇࿰c;也是很牛哒！）

3.网络协议

网络协议这一块主要是学习一些网络路由配置与一些协议࿰c;这一部分很是枯燥与炸头࿰c;也是我最薄弱的一个环节。🆒

4.设计模式

这一块主要涉及到了一些工厂、代理一些的东东࿰c;毕竟咱是网安的࿰c;这方面的代理咱也没啊看懂࿰c;是VPN开车必备神器还是啥࿰c;还是需要大家自己去度娘一下。🤪

二、基本开发工具

1.IDE/编辑器

webstorm、vscode

这两款软件最常用࿰c;本人比较喜欢VScode࿰c;可能是因为刚开始接触的是它吧࿰c;就是属于你想用的一些开发软件可以在上面一搜即安装࿰c;就好比手机上的应用商店࿰c;不用在大费周折寻找安装路径了。还是不错滴࿰c;为它打call🤠！

2.版本控制工具

SVN、GIT

3.浏览器

浏览器大家就比较熟悉了࿰c;这里一般有：谷歌、搜狐、360.......

应有尽有࿰c;我一般用的最多的还是搜狐浏览器࿰c;尽管他的兼容性不是最好的࿰c;但架不住用的顺手了࿰c;但有一些网页打开还是得用别的浏览器࿰c;这也是没办法的😑在这边还是不特别推荐一些新手上来就先玩火狐࿰c;因为别的浏览器更加常用一些。

三、前端开发史诗级三件套

1.HTML

html这算是一个新手小白在内彻意遨游的一个东东࿰c;对于我来说࿰c;当时学习最喜欢࿰c;并且感觉最有趣的一门了。做html网页࿰c;我用的是Dreamweaver࿰c;其实就是一个码农写网页页面的一个东东࿰c;你学会了他的一些固有格式语句规范࿰c;就能写出一个看起来或好或坏的一个网页。装个×也管。

2.css

html如果说是建立一个网页本体࿰c;那么css就是以为管家࿰c;为它穿上华丽的嫁衣。具体分类我会在文章最后附带整理图片。

3.javascript

JavaScript是一种高级的、解释型的编程语言；它是一门基于原型、函数先行的语言࿰c;是一门多范式的语言࿰c;它支持面向对象编程࿰c;命令式编程࿰c;以及函数式编程。

四、封装库/工具库

1、数据可视化

highchart、Echarts、AntV、D3.js.......

数据可视化࿰c;是关于数据视觉表现形式的科学技术研究。其中࿰c;这种数据的视觉表现形式被定义为࿰c;一种以某种概要形式抽提出来的信息࿰c;包括相应信息单位的各种属性和变量。

2、UI框架

Bootstrap、Semantic UI、layui........

UI框架就好比我们在网页制作程序中导入一个模板࿰c;那么我们就拥有了一个现成的网页࿰c;只需要更改里面的图片以及文字即可。

3.编辑器

TinymCE、VEditor.........

编辑器是软体程序,一般是指用来修改电脑档案的编写软件,但也有人称 PE2、HE4(汉书)等文书软件为编辑器。常见的编辑器有文本编辑器、网页编辑器、源程序编辑器、图像编辑器,声音编辑器和视频编辑器等。

4.组件库

Element、iview、antd.......

顾名思义࿰c;组件的仓库。（对的࿰c;就是则么直白😏）

5.动画

Animate、mo.js......

（喜羊羊࿰c;美羊羊࿰c;别看我只是一只羊࿰c;样儿的聪明难以想象。我也希望接触前端的小伙伴们࿰c;可以做出充满新一代少年童年的动画片。）

6.mock数据

mock.js.......

mock是在测试过程中,对于一些不容易构造/获取的对象,创建一个mock对象来模拟对象的行为。 mock测试一般也称为mock数据。 简单来说,mock就是向测试对象提供一套和测试资源完全相同的接口和方法,不关系具体的实现过程,只关心具体结果

7.工具库

underScore、Lodash........

五、前端工程化

详见下下列图片（小编手笨࿰c;用最原始最直观的方法整了下来࿰c;还望大家莫要嫌弃🥰）