quote 如今，各种互联网web应用层出不穷，那么如何快速入门，成长为一名优秀的web开发工作者呢？ 这个问题不好回答，几乎所有的培训机构都回答不清楚。 所以对于刚刚入门web开发的菜鸟们来说，我觉得学习web开发的唯一途径就是做，做，做，也许学，做，再做。 没有人告诉你怎么做。我读书的时候，我的导师就给我一堆视频，一堆文件。我们首先明确一个目标：“哦，在这个阶段，我想独立完成一个简单的web应用，比如新闻发布系统”。 也许学习如何开发网络应用程序只是完成该网络应用程序的副产品。您可以将其称为项目驱动，或者您可以将其视为学习任何语言的一种非常有效的方法。 1.分析与设计 不管你是做传统的桌面应用还是web应用，前期的分析和设计都是不可避免的。 分析：需求分析，你必须明白你要做什么，你的客户真正想要什么，在做新闻发布系统的时候，我要问自己这样的问题：我的新闻发布系统能做什么，能做什么？我觉得它长得像，等等。 弄清楚自己想做什么的时候，我就会开始设计。设计非常麻烦。记得以前我是做机房收费系统的。设计几乎是变化精炼的，这里也是一样。 对于刚入门的你，我觉得还是简单的画一下页面的流程图吧，选择什么样的工具呢？没关系，你可以用Word，你可以用Visio，即使你用纸，也没关系，因为铅笔和橡皮让你很快适应，但如果你想保存和传播，不要选择纸张。这时候页面绘制的时候，就是一堆框架的列表。很简单，只要能让自己知道应用最终会是什么样子就可以了。当然，点击某个按钮等可以做什么，可以用程序流程图来表示。建议大家把流程图画出来，这样对整个系统的来龙去脉会有更清晰的认识。 2。网页模型 呵呵，理论上说，草图完成后，应该就是一个模型了，还是可以看成是页面的细化，不过这次应该是最终完成的web应用截图被采取。当然，如果你的客户是你自己，只要你看起来满意就行。 如果你不相信自己的PS技术，或者你真的没有审美能力，或者你不想成为一个伟大的网页设计师，你也可以偷懒，直接去开发网页原型。那时候懒惰，给自己的理由是：我是一个没有审美的程序员。事实证明，如果没有实物模型，制作网页原型肯定要花更多的时间。有句话说得好，“出来混，迟早要还的”。 3。网页原型开发 网页原型是用HTML开发的，必须用CSS来渲染。一般我们的HTML文档都会使用外部样式来定义文档中使用的样式。Javascript也放在一个外部文件中，里面只包含Javascript代码。 以这种方式分隔，网站将由三个文本文件组成：HTML，包含页面的内容和结果；CSS，控制页面的外观和呈现；和Javascript，它控制页面的行为。 HTML、Javascript、CSS文件必须是纯文本格式，这样浏览器才能看懂，推荐几款不错的编码工具：NotePad++（小巧，免费），EditPlus（全功能文本，HTML，程序源代码编辑器),VIM（速度，你可以扔掉鼠标）。 这时候对我的网页原型做一些可用性测试，防止以后出现大规模的错误。到这一步结束，我就基本知道我的web应用是怎么组织在一起的了，首页是什么，每个页面怎么跳转等等。 就好像，我做了一个汽车模型，剩下的就是让车跑起来，或者，我在做一个人，我已经做了人皮，下一步就是做它的五脏六腑哈哈，人好像不是这样炼成的，不是很妥当。 4。选择一个框架 既然您已经知道要开发什么，那么前面还有很多工作要做。我觉得，这个时候，你应该选择用什么语言和框架。 有选择，就有痛苦。至今没见过，有人大胆宣称哪个框架最好，哪个语言最好。 其实都是不同的，各有各的长处。最重要的是您需要知道它们中的任何一个都可以让您开发有用的Web应用程序。 选择适合自己的真的不容易。幸运的是，如果你不想花时间研究所有的框架，那么我建议你选择更容易使用的ASP.NET框架。语言自然是C#。 如果你不是开发一个非常小的系统，我觉得你应该使用数据库。如果你不知道如何选择，那就从Access或SqlServer入手。 5.开发进行中， 似乎蓄势待发，撸起袖子干起来吧，标准的编程工作。在幕后，您创建类、对象、服务、过程和数据持久层以将这些对象存储在数据库中。 后台是整个应用的核心。对于任何一个应用程序，都和普通的编程没有区别。只有面向对象的方法、应用程序设计模式等，才能把C/S开发的经验应用起来。 然后，将后台程序和原型界面整合在一起，将系统的各个部分整合在一起。集成过程仍然可以使用Javascript、jQuery、Ajax等来设计。 6。测试和调试。 这时候你的web应用开发接近尾声了，只是开发。回头看看你的要求和设计是否已经实现。同时，你还要保证你的程序在各种浏览器中都能正常运行（如果是IE6，我想你还是会纠结，至于为什么，你实际去做就知道了）。 在各种浏览器调试时，建议大家安装一些插件，比如FireFox浏览器中的Firebug，IE中的WebDevelopmentHelper。 自测没有问题。最好找身边的人简单测试一下。你不希望你的应用在发布后被一些“愚蠢的网友”莫名其妙的操作杀死。 如果你是一个追求完美客户体验的人，那么你就不得不花一些时间来改变你的web应用，为用户创造更好的体验。这个时候，你还是会用到刚才提到的一些技术，jQuery和Ajax等，如果你选择了Asp.NET框架，你可以尝试去了解Asp.NetAjax。 7。发布和后续工作 最后一步是发布你的应用，如果你想先发布一个Beta版本，因为肯定会有bug，这样只有一小部分用户能够发现bug在你的应用程序中是个大问题。 他们将帮助您提高节目质量。请记住，不要忙于添加功能，而要专注于使您当前的程序稳定。 内测阶段结束后，将发布正式版。这里会涉及到一个推广问题。对于我这种小个子，还是喜欢用微博的。这是一件好事。不懂的可以去了解一下这方面的动态。 也许直到你完全完成了你的第一个网络应用，你才明白我一开始所说的话：“也许学习如何开发网络应用只是完成这个网络应用的副产品”。 那么，上面内容1到7中提到的英文单词就是我们在开发过程中学到的。让我们大致看看在上面的开发过程中我们学到了什么： 1。Html HTML超文本标记语言（HyperTextMarkupLanguage），是一种用来描述网页的语言。HTML不是一种编程语言，而是一种标记语言，它使用一组标记来描述网页。 网页文件本身就是一个文本文件。通过给文本文件添加标签，可以告诉浏览器如何显示内容（如：如何处理文本、如何排列屏幕、如何显示图片等）。浏览器按顺序读取网页文件，然后根据标记解释并显示标记的内容。错误的标记不会指出它的错误，也不会停止它的解释和执行过程。编译器只能通过显示效果和错误区域来分析错误原因。但是需要注意的是，不同的浏览器对于同一个标签可能会有不同的解释，从而产生不同的显示效果。 HTML之所以被称为超文本标记语言，是因为文本中包含所谓的“超链接”点。所谓超链接就是一种URL指针，通过激活（点击）它，浏览器可以很容易地获得新的网页。这是HTML被广泛使用的最重要原因之一。 2、Xml Xml可扩展标记语言（ExtensibleMarkupLanguage，XML）是一种用来标记电子文件使其结构化的标记语言。它可以用来标记数据和定义数据类型。它是一种允许用户定义自己的标记语言的源语言。XML是标准通用标记语言(SGML)的子集，非常适合Web传输。XML提供了一种统一的方法来描述和交换独立于应用程序或供应商的结构化数据。 XML和HTML的设计区别在于：XML是用来存储数据的，关注的是数据本身。HTML用于定义数据，着重于数据的显示方式。 3、CSS 在网页开发的早期，网页设计师经常抱怨他们缺乏对网页外观的控制。他们无法精确控制网页上对象的位置，也无法控制网页上字体的外观。有什么样的控制，因为网页不是和实际的纸做对比的，纸的大小应该做什么样的设计，网页的大小也不是固定的。 CSS（CascadingStyleSheet，层叠样式表）规范由W3C制定。由于它允许同时控制多个页面的样式和布局，因此CSS可以被视为WEB设计领域的一个突破，它将内容与表示分离。作为Web开发人员，您可以为每个HTML元素定义样式并将它们应用到任意数量的页面。对于全局更新，只需更改样式，站点的所有元素都会自动更新。这样，设计人员可以将更多时间花在设计上，而不是为HTML的局限性苦苦挣扎。 4。JavaScript 首先，JavaScript跟Java没有关系，JavaScript是一种属于互联网的脚本语言！那么为什么名字如此相似呢？这是典型的营销成功，它在推广上的成功也是借鉴了Java。当Microsoft开始意识到JavaScript在Web开发人员中越来越受欢迎时，Microsoft以一种风格建立了自己的脚本语言JScript。 JavaScript可以使网页更具交互性，为用户提供更令人兴奋的体验，并在用户在页面之间导航时向他们提供反馈。例如，他可以设置鼠标悬停效果、在客户端验证表单、创建自定义HTML页面、显示警告框、设置cookie等等。 5、Ajax Ajax是AsynchronousJavaScriptandXML（异步JavaScript和XML）的缩写。严格来说，Ajax是Javascript的一小部分。但随着频繁使用，这个词不再指代技术本身，而是指以下技术的组合： XHTML；CSS;JavaScript访问DOM；XML，服务器与客户端之间传输数据的格式；XMLHttpRequest，用于从服务器获取数据。 Ajax是一种用于创建快速动态网页的技术。大多数处理发生在用户的浏览器中，经常在后台与服务器交换少量数据，时间很短，AJAX可以使网页异步更新，这意味着网页的某一部分无需重新加载整个网页即可更新（传统网页，即不使用AJAX的网页，如果需要更新内容，则必须重新加载整个网页）。基于以上内容，您可以使用Ajax构建功能丰富的应用程序。 有许多使用Ajax的应用程序示例：Google地图、Google日历、Gmail、MyYahoo!门户网站、腾讯微博、新浪微博、开心网等。 好的ajax工具包有：AjaxControlToolkit、Yahoo!用户界面库等。 6。DOM 在网页上，构成页面的对象以树状结构组织，页面的顶层包含在标签中，您可以在其中找到
和标签，以及其他标签包含在这两个标签内，以此类推。 Javascript将文档树中的每个项目都视为一个对象，使用Javascript，您可以重构整个HTML文档。您可以在页面上添加、删除、更改或重新排列对象，要更改页面上的某些内容，Javascript需要访问HTML文档中的所有元素。这个入口连同添加、移动、改变或移除HTML元素的方法和属性，是通过文档对象模型获得的，即对象在文档中的表示称为文档对象模型，即DocumentObjectModel，简称DOM。 1998年，W3C发布了第一级DOM规范。此规范允许访问和操作HTML页面中的每个元素。所有的浏览器都实现了这个标准，所以DOM兼容性问题几乎不可能被发现。Javascript可以使用DOM来读取和更改HTML、XHTML和XML文档。 DOM分为不同的部分（核心，XML和HTML）和层次（DOMLevel1/2/3）： CoreDOM为任何结构化文档定义了一组标准对象 XMLDOM定义了一个XML文档的一组标准对象。 HTMLDOM为HTML文档定义了一组标准对象。 7。jQuery jQuery是继prototype之后又一个优秀的JavaScript框架。是一个轻量级的js库（压缩后只有21k），兼容CSS3，也兼容各种浏览器（IE6.0+，FF1.5+，Safari2.0+，Opera9.0+）。jQuery使用户能够更方便地处理HTML文档、事件，实现动画效果，方便地为网站提供AJAX交互。jQuery的另一大优点是它的文档非常全面，各种应用也有详细的介绍，还有很多成熟的插件可供选择。jQuery可以让用户的html页面保持代码和html内容分离，也就是说不需要在html里面插入一堆js来调用command，定义id就可以了。 它的宗旨是——WRITELESS,DOMORE（写更少的代码，做更多的事情）。 8.ASP.NET。我不需要对此多说，你知道的…… 9。你还将在整个开发过程中学习一些工具的使用： Visio、Dreamweaver、VistualStudio、SqlServer或Access、（Vim、EditPlus、Notpad++）、各种浏览器和FireBug插件、IE下的WebDevelopmentHelper等 10。当然，如果你足够努力，你会发现很多好的资源，比如MSDN、W3cSchool、一些资深博客、一些技术论坛等等，都是你前进道路上的财富。 综上所述，如果你真的通过做这个程序完成了自己的web应用，并且学习了以上技术和工具的基础知识，那么恭喜你，你已经成为一名初级的web应用开发者了。如果大家在学习前端的过程中遇到任何问题或者想获取学习资源，欢迎加入前端学习交流QQ群：328058344一起来学习前端吧！