前端需要掌握的知识

1.html和css

• 通过学习html标签和css，能够写出和设计图纸一致的静态页。html标签包括标题标签h1-h6，div，span，ul，li，a，img，br，table等，css样式包括文档流，浮动流float，定位流position，display，margin，padding，border，width，height，overflow，background，color，text-align等。

2.原生javascript

• 
• 弱类型的解释型脚本语言；
• 
• number，string，bool，null，undefined，引用类型；
• 
  函数式编程的思想，将代码全部包裹在函数当中，代码变得优雅，函数尽可能独立地实现单一的功能，函数的本质就是包裹的代码块，在不被调用时没有任何的作用，调用时可能传递实参（如果函数声明时有形参的话），实参会给形参赋值。函数的参数使得函数在实现功能时更加的灵活，函数的返回值，函数内部的代码块可以进行对数据或者dom元素等的操作，可以将操作的结果返回出去在其他地方被使用，是一种常用的传值方式；构造函数，构造函数是用new调用的函数，一般名字首字母大写，js有很多自带的构造函数，比如Function,String等，我们也可以自定义构造函数，调用构造函数时可以返回一个实例对象。使用构造函数时要分清prototype和--proto--prototype是函数的属性，--proto--是实例对象的属性，两者指的是同一东西。
• 
  bom的事件：resize，onload，onsroll等，dom事件：鼠标事件，click，dblclick,mouseover, mouseout, mouseenter,mouseleave等，键盘事件，keydown，keypress，keyu，其他事件：input,focus,change,blur等。绑定事件：让浏览器去监视元素，发生对应事件时执行相应的操作，但是绑定事件的时候同样的事件只能绑定一个，而事件监听可以监听多个，互不干扰。在大型项目时，使用事件绑定可以会影响到自己或者同事写的代码，应该使用事件监听，事件委托：将事件绑定到父元素中去，当事件发生时去筛选符合条件的子元素，使用事件委托，可以减少事件绑定的次数，使得代码更加优雅，提高网页的性能；
• 
  创建dom:docment.createElement，获取dom：document.getElementById,doucment.getElmentsByClass,document.querySelector,document.queryAllSelector，设置dom的css样式，Object.assign(dom.style,{})，获取dom的属性：dom.getAttribute，设置dom的属性：dom.setAttribute；
• 
• 
  在能用js实现功能的前提下，将可复用的代码封装好存放在一个js文件中，在项目可复用，达到便捷开发的效果，jQuery就是一个较优秀的例子，但jQuery是别人写好的。不够灵活，另外现在开发项目都会用到vue等框架，jQuery没有太大的必要。练好原生js，将自己需要重复使用的代码封装起来就可以了。原生js才是根本。

3.ES6模块化开发

ES6引入了class的概念，class就是将构造函数丛生constructor和原型对象写在一起的一个js文件。使用模块化思想开发，使得代码更容易维护，开发思路更加清晰。写类时，如果不会被使用多次可以使用静态static 的方式书写function 和数据，由于静态函数只能使用静态数据，这种class文件会看到通篇的static；如果会使用多次，推荐使用this的方式，将数据绑定到类的实例对象上去。到目前为止，ES6的兼容性并不好，我们用ES6写好代码后用babel转化为ES5的代码再上线

4.后端语言php,node

• 不做详情说明；
• 
  npm：国外的包管理工具，数据多，第一手资料，但不支持断点续传
  cnpm：国内的包管理工具，速度快，支持断点续传，但再打包时有可能会出现丢包的情况，使用包管理工具时优先使用npm,npm下载失败时使用cnpm。如果时开发依赖，可以直接考虑使用cnpm
  nvm,node版本管理工具，node更新版本时不向下兼容，因此版本对于node尤为重要
  nrm:node的镜像源管理工具，用来管理npm,cnpm等镜像源
  node服务：一个node服务就是一个js文件。
  创建服务的基本代码如下：
  var http = require('http');
  var server=http.createSever(serveHandler);
  serve.listen（端口号，url）;
  function serverHandler(_req,_res){
  req=_req;
  res=_res;
  req.on("data",dataHandler);
  req.on("end",endHandler);
  }
  function dataHandler(_data){
  }
  function endHandler(){
  }
• 
  下载mysql模块：npm i mysql
  引入mysql模块：var sql = require("mysql")
  创建连接对象：var con = sql.createConnection({})
  连接数据库：con.connect();

5.mysql数据库

数据库无非就是增删改查等操作，想要入门十分简单，但要精通，要使用sql语句完成复杂的数据筛选却不是一件简单的事情。

6.html5和cs3

• 新增加了一些特性和标签
  用于绘画的canvas元素
  用于媒介回放的video和audio元素
  对本地离线存储的更好的支持
  新的特殊内容元素，比如article,footer,header,nav,section
  新的表单控件，比如calendar,date,time,email,url,search
• 新增了一些样式和功能
  css3选择器
  css3盒模型：怪异盒模型，外边线
  css3多列布局
  css3弹性盒模型
  css3媒体查询
  css3变换
  css3 @font-face规则：自己的字体是在css3 @font-face规则中定义的
  css3中字体描述符
  css3渐变
  用calc计算距离（布局时常用）

7.jQuery

jQuery是一个优秀的类库，将原生js进行封装。现在开发基本都用框架，jQuery的用处不大，了解就行，如果遇到之前用到jQuery的项目，要能够看懂代码。

8.bootstrap

bootstrap是一个样式框架，Bootstrap主要有下面几部分组成：
栅格系统——就是将屏幕平分12份（列）。使用行（row）来组织元素（每一行都包括12个列），然后将内容放在列内。通过col-md-offset-*来控制列偏移。
基础布局组件——Bootstrap提供了多种基础布局组件。如排版、代码、表格、按钮、表单等。
Jquery——Bootstrap所有的JavaScript插件都依赖于Jquery的。如果要使用这些JS插件，就必须引用Jquery库。这也是为什么我们在除了要引用Bootstrap的JS文件和CSS文件外，还需要引用Jquery库的原因，两者是依赖关系。
CSS组件——Bootstrap为我们预实现了很多CSS组件。如下拉框、按钮组、导航等。也就是说Bootstrap内容帮我们定义好了很多CSS样式，你可以将这些样式直接应用到之前的下拉框等元素里。
JavaScript插件——Bootstrap也为我们实现了一些JS插件，我们可以用其提供的插件要完成一些常用功能，而不需要我们再重新写JS代码来实现像提示框，模态窗口这样的效果了。
响应式设计——这就是一个设计理念。响应式的意思就是它会根据屏幕尺寸来自动调整页面，使得前端页面在不同尺寸的屏幕上都可以表现很好。

9.typescript

js是一门弱类型的语言，类型可以随意变动，js没有接口，入门比较简单。但在大型项目中运行效率较低，且出错后不好排错。而TypeScript 增加了静态类型、类、模块、接口和类型注解，在大型项目中更加有优势。typescript是未来的主流，vue的作者在vue3.0中也使用typescript重写了整个框架。

10.scss

scss是一种新的专门的编程语言，编译后形成正常的css文件，为css增加一些编程特性，无需考虑浏览器的兼容性（完全兼容css3），让css更加简洁、适应性更强，可读性更佳，更易于代码的维护等诸多好处。非常适合在vue等框架中使用。

11.gulp,webpack打包工具

• 
  就是为了规范前端开发流程，实现前后端分离、模块化开发、版本控制、文件合并与压缩、mock数据等功能的一个前端自动化构建工具。说得形象点，“Gulp就像是一个产品的流水线，整个产品从无到有，都要受流水线的控制，在流水线上我们可以对产品进行管理。”另外，Gulp是通过task对整个开发过程进行构建。
• 
  是当下最热门的前端资源模块化管理和打包工具。它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源。还可以将按需加载的模块进行代码分割，等到实际需要的时候再异步加载。通过 loader的转换，任何形式的资源都可以视作模块，比如 CommonJs 模块、AMD 模块、ES6 模块、CSS、图片、JSON、Coffeescript、LESS 等。

12.github和gitee

想要自己做一些东西，或者和别人合作开发，就必须要学会使用Git。最初了解Git，同时听到了Github、Gitee（码云），于是想要弄明白三者之间的区别与联系，经过一番搜寻，大致明白Git是一种东西，在本地的，可以下载安装。github和gitee是同一类，github是国外的，gitee是国内的。两者都是通过bash指令进行操作的。
把当前目录设置为本地仓库：git init
设置当前公用的用户名和邮件地址： git config user.name "gitHub上注册的用户名"
git config user.email "gitHub上注册使用的邮箱"
添加远程仓库：git remote add origin 地址
将远程仓库pull到本地：git pull origin master
将要上传的文件添加到创建的文件夹里（将文件保存到缓存区）：git add.或者git add + 文件名
将文件保存到本地仓库：git commit -m"注释"
将本地仓库推送到远程仓库：git push origin master

13.vue,react等开发框架

学习框架看官方文档就行，遇到不理解的局部搜索一些博客看看。利用框架开发一些项目之后就会慢慢精通框架了。