web应用开发知识点总结

1.前端 VS. 后端

一开始一定要分清前端开发和后端开发，我们来分别介绍一下。

前端

Web应用被分类归为分布式应用，一般是客户端——服务器结构，所以我们有一部分的代码运行在客户端，另一部分代码运行在服务器。那些在客户端上的应用就是前端，通常指的就是我们的浏览器。最常用于前端开发的技术是HTML+CSS+JavaScript，高级的前端开发人员通常使用这些技术的组合开发应用的前端，另一个前端的常用技术就是使用Photoshop设计，配合其他技术共同完成Web页面的制作。

后端

后端开发者编写那些运行在服务器上的代码，通常来说，这部分的工作需要和数据库打交道，比如读写数据、读写文件、实现业务逻辑等。有些时候，业务逻辑存储在客户端，这时后台就是用来以Web服务的形式提供数据库中的数据。后端开发者一般需要掌握一种Web编程语言和一个数据库管理系统。

你可以同时掌握前端和后端的技术，但大多数Web开发者都还是有一定的喜好偏向，甚至只在某一方面深入研究。尽管前后端是有区分的，但并没有规定它们各自的具体任务。有时前端只是完成数据的显示，而其他主要工作都在后端完成。但也有时，后端只是提供数据，而所有的计算和具体功能都在前端完成。前后端工作的分配，通常都是由项目的设计和架构来决定的。

2.软件开发流程

网页设计师根据需求设计网页 PS

前端工程师将设计做成静态网页 HTML+CSS

后台工程师将静态网页修改为动态网页 JSP\PHP\Python\ASP

提供接口 JS Nodejs

2.需要学习的技术

Vue.js前端框架

Vue.js 致力于构建数据驱动的 web 应用开发框架，是一个精简的 MVVM。Vue.js专注于 MVVM 模型的 ViewModel 层。简单的数据操作，就可以完成页面的更新，当然也有很多类似的框架，如 Angular，React，但是 Vue 以简洁化，轻量级，数据驱动，模块友好等优势深受企业以及前端开发者的喜爱，成为前端开发人员必备的技能。

Vue.js开发基础：

包含知识点：WebApp开发基础；MVVM模式；前端组件化； 单文件组件；组件间传值；Vue实例；E19Vue实例生命周期； Vue的模版语法；计算属性,方法与侦听器；Vue中的条件渲染；Vue中的列表渲染；Vue中的set方法；Vue动画……

2）应用Vue.js开发WebApp项目

包含知识点：环境配置；项目代码介绍；单文件组件与Vue中的路由；单页应用VS多页应用；Mint UI；Element UI；

Node.js后端开发

主阶段主要讲解NodeJs服务器端开发以及常用框架搭建服务器。掌握服务器端开发以及模块化原理。包括服务器代理、权限认证、及时通信、IO 操作等。

Node.js基础

包含知识点：Node.js介绍；MongoDB；GraphGL；Express；Koa2；测试框架mocha；socket 即时通信项目……

2）Node.js高级全栈项目

包含知识点：基于M站+Node.js+MongoDB高级全栈项目开发。

4.所需工具

浏览器：Firefox、Chrome、IE

编辑器：Sublime Text、VS code

调试工具：FireBug

图片工具：Photoshop

IDE（集成开发工具）：DW、WebStorm、Hbuilder

IE6 浏览器兼容测试：ietester

5.其他

HTTP（Hyper Text Transfer Protocol，超文本传输协议）是一个简单的请求-响应协议，它通常运行在TCP之上。它指定了客户端可能发送给服务器什么样的消息以及得到什么样的响应。请求和响应消息的头以ASCII码形式给出；而消息内容则具有一个类似MIME的格式。

HTTP是基于客户/服务器模式，且面向连接的。典型的HTTP事务处理有如下的过程：

1. 客户与服务器建立连接；
2. 客户向服务器提出请求；
3. 服务器接受请求，并根据请求返回相应的文件作为应答；
4. 客户与服务器关闭连接。

状态码

部分状态码总结：

200 - 请求成功：表示服务器成功处理了请求，并返回相应的结果。

301 - 永久重定向：表示请求的资源已被永久移动到新位置。

302 - 临时重定向：表示请求的资源暂时被移动到其他位置。

400 - 错误的请求：表示请求存在语法错误或无法被服务器理解。

401 - 未授权：表示请求需要用户身份验证，但用户未提供有效的凭据。

403 - 禁止访问：表示服务器拒绝了请求，通常是因为请求的资源禁止访问。

404 - 未找到：表示请求的资源不存在或无法找到。

500 - 服务器内部错误：表示服务器遇到意外情况，无法完成请求。

502 - 网关错误：表示作为代理或网关的服务器从上游服务器中接收到无效的响应。

503 - 服务不可用：表示服务器暂时无法处理请求，可能是由于过载或维护而导致的。

504 - 网关超时：表示作为代理或网关的服务器在等待上游服务器响应时超时。

总之要学Web应用开发，除了以上知识，需要掌握哪些知识呢？我总结了一下，必须掌握的就是以下几点。

1、div和table。这个是最简单的，也是最基础的。要熟练掌握div、form table、ul li 、p、span、font这些标签。这些都是最常用的，特别是div和table，div用于布局、table也可以用于布局，但是不灵活，基本table是用来和数据打交道。

2、CSS学习。这里说的css不包括css3，一般我们看到Web前端开发工程师的要求里面，有一个会使用css+html或者 css+div 来进行界面布局，所以css是用于辅助html来布局和展示的，我们称之为“css样式”。为什么会说css+div呢？因为小千上面说了div就是 html主要用于布局的东西，所以div就是核心掌握的东西！那么css肯定必须要配合div来使用才好。css要熟练掌握float、 position、width、height，以及对于的最大最小、会使用百分百、overflow、margin、padding等等，这些都是跟布局有关系的样式，一定要掌握。

3、JavaScript学习。可能前两个大家觉得还过的去，看到js就头疼了。其实吧，js入门很简单的，不需要会很多东西的，只要会根据某个id、或者name拿到网页dom或者样式、或者值，然后会给某个id或者name的元素标签赋值、或者追加数据、追html。这个是跟数据有关系的操作，然后数据逻辑判断，效果方面的，无非就是跳转、弹框、隐藏什么的。把这些全部结合其他就是实际用途了，代码一点都不难。会了这些基础js，其他的直接百度就好了。然后看多了，用多了，就什么都不是问题了。

4、jQuery学习。jquery是相当于把js封装了一套的一个js插件，目的就是操作起来更方便，代码写的更少，jquery入门也很简单，那些是入门需要学的和js一样，只是换成了jq的代码。其他的一样百度就够了。

5、会点后台语言。比如java、php，为什么呢？因为我们前台界面的数据都是从后台来的，如果会点后台代码，就知道怎么跟后台交互数据是好的，这样节约时间，也可以让前端代码更规范。不然可能因为你的写法和后端给来的数据不能结合上，那么前端代码又得重新写，那就更蛋疼了。

6、学习CSS3和HTML5。随着这移动互联网快速发展的时代，尤其是4G时代，HTML5+CSS3已然成为新一代的Web前端技术。随着HTML5的发展和普及，了解 HTML5也将成为 Web开发人员的必修课。涉及到网页外观时，就需要学习CSS 了，它可以帮你把网页做得更美观。

利用HTML5和CSS3模拟一些你所见过的网站的排版和布局(色彩，图片，文字样式等等。当你掌握了HTML5，CSS3，JavaScript等技术之后，就应该找一个Web框架加快你的Web开发速度，使用框架可以节约你很多时间。