Web开发ABC:初学者必知的26个概念和技术

开发 前端
Web开发经常会是非常复杂的事情。今天,针对初学者,我希望向你介绍26个概念和技术,每个都对应英文字母的一个字母。听起来很奇怪吧,那让我们开始吧。

A——AJAX

AJAX是异步JavaScript和XML的意思,它是近些年你使用的所有流畅的Web应用背后的主要驱动力。AJAX作为一项技术来说,使用已经很普遍了。Gmail,Flickr等,你甚至还可以在WordPress的管理员面板里找到它。那么它到底是什么以及它如何实现的呢?

说到底它的核心是XMLHttpRequest,这允许在页面完全渲染之后发送请求并接收返回,而无需关联页面其它部分。这意味着web程序不需要为每一个操作而刷新整个页面。这提供了非常流畅,动感的类似桌面应用的用户体验。

相关阅读

用Dojo实现Ajax请求:XHR、跨域、及其他

使用 jQuery 简化 Ajax 开发

盘点ASP.NET Ajax工具箱的10大顶级控件

ASP.NET AJAX前景黯淡?jQuery笑而不语

B——Browser(浏览器)

浏览器是能理解你的网站或应用杰作的结构的东西。它不仅仅可以用来上网,现代的浏览器还是一个多任务的平台。比如我安装的,带有IRC,FTP和同步信息到每个设备的功能。你可能已经知道,浏览器及时宝贵的开发工具,又会带来很多麻烦。每个必须保证他们的作品在每个浏览器下都看起来很完美的开发者应该很能理解这个痛苦。

相关阅读

微软证实BROWSER协议中的系统漏洞

MySQL客户端工具中MySQLbrowser简介

C——CSS

CSS是前端开发的一把利剑。CSS是层叠样式表单的缩写,它是一门可以定义网页如何显示的语言。在Web开发最恐怖的年代,开发者经常把样式代码写到HTML源代码中去。CSS则非常好地将样式从内容中分离出来。

相关阅读

推荐23款超赞超实用的CSS3小工具

27 款经典的CSS框架 附下载

20个HTML 5和CSS3的免费网站模板与教程

15个国外最流行的CSS框架(附下载)

D——DOM

DOM是文档对象模型的缩写,这是与HTML或XML文档交互的公认的约定。DOM API提供了用程序遍历和操作文档的功能。“DOM为分析后的HTML文档创建了一个相符的层级结构。子元素叫做节点或DOM节点”。如果你听到人家谈论DOM,其实他们是在说DOM脚本。这以前是描述通过JavaScript访问和操作DOM的术语。这是大多数你现在看到的现代网站和应用背后的技术。

相关阅读

专题:JavaScript DOM编程手册

jQuery1.5的六大细节改进:DOM操作更简单

JavaScript获取HTML DOM节点元素详解

大话HTML DOM与XML DOM的区别与联系

E——Events(事件)

现代Web应用是深层事件驱动的。那么什么是事件呢?你在网页上做的大多数事情都组成一个事件。鼠标放在链接上,点击按钮,按下Tab键等都是有效的事件。事件处理指的是当某个事件发生时执行一段指定的代码。这也是你必须掌握的现代web开发背后的基本概念。

相关阅读

JavaScript from Null: Chapter 5 – Events(http://net.tutsplus.com/tutorials/javascript-ajax/javascript-from-null-chapter-5-events/)

F——Firebug

工欲善其事,必先利其器。Web开发者也一样。一个很强大的工具就是Firebug。Firebug是一个可以贯穿你的工作的firefox扩展。它让你在运行中编辑和监控一个页面的方方面面。这里不能详细说它的特性,所以点击下面的链接吧。

相关阅读

Web开发者可能不知道的12个Firebug技巧

FirePHP:像Firebug那样调试你的PHP代码

Firebug中的console tab使用总结

G——Grid(网格)

网格是页面结构化的可视化框架。它从一度发达的印刷工业移植过来,网格是当前Web开发中必不可少的一部分。有很多CSS框架可以用来创建基于网格的布局,对于非常大数量的页面和布局需要高强度的练习。

相关阅读

ASP.NET MVC 3 Beta初体验之WebGrid

ASP.NET DataGrid技巧:关键任务弹出确认对话框

#p#

H——HTML

如果你现在在阅读这篇文章,你可能对它的概念有一些模糊的认识了。如果你被这个链接欺骗了,请继续阅读。顺便欢迎大家访问rockux,我们提供很多有关web开发的文章。HTML是超文本标记语言的缩写,是网页语言事实上的标准。HTML由几个组件或元素组成:标签,标签属性和标签中包含的内容。HTML标准的最新版本,HTML5,给我们带来了很多新特性,并解决了一些兼容性问题。

相关阅读

专题:HTML 5 下一代Web开发标准详解

技术大牛谈HTML 5设计原理

HTML 5联手jQuery实现超酷图像灰度渐变效果

10个国外开发的HTML 5精彩应用

初学者必知的HTML 5入门级技巧

I —— IE

呃,Internet Explore。这个名字唤起敬畏和愤怒。曾经它是一个英雄,带来了四个令人兴奋的新功能,推动了整个工业的向前发展,它也结束了浏览器停滞不前的历史。直到今天,它依然引领着前端开发者。经过十年的战争,IE的最后版本是9,它重新走向了正确的创新方向。不管你对IE的态度如何,它始终是Web开发过程逃脱不掉的。

相关阅读

IE9多国语言包官方下载

初试IE9第一个配置工具TweakIE9

J —— JavaScript

JavaScript是基本web开发三件套中的最后一个成员。JavaScript,不是Java,是Web的脚本语言。有几十亿的网页在使用它,更重要的是网站支撑了这个说法。你通过JavaScript定义行为,管理事件,处理DOM并与服务器交互。归功于不可思议的类库的使用,如jQuery,对JavaScript的理解和知识逐年增长。我觉得可以很合适地说JavaScript是每个现代web开发者绝对必备的。

相关阅读

专题:JavaScript学习笔记 有问有答

           JavaScript函数式编程

再谈JavaScript图片预加载技术

示例:JavaScript中的后续传递风格

10个令人惊奇的HTML5和JavaScript效果

K —— Keyword Optimization(关键词优化)

SEO只与Web开发有关系,但是即使是这样,web开发者掌握一些什么是SEO以及它能做什么之类的基本知识是非常重要的。关键词优化指的是为你的网站选择正确的关键词并且优化它们以使你的访客可以找到你的网站。而当你涉足所有SEO的原则时,记住:内容是王道。如果你拥有非常棒的SEO但是内容很差劲,用户可能会找到你但是很快就会离开。如果你有好的内容,用户会找到你并留下来。

相关阅读

认清SEO攻击方式 防范网站被恶意攻击黑掉

SEO实战密码--60天网站流量提高20倍

ASP.NET中利用HTTP报头状态码实现SEO

L —— Less

Less是一门带刺玫瑰式的样式语言。它们的网站描述到LESS扩展了CSS的动态行为,例如变量,混合类型,操作符和函数,我也倾向于赞成这种做法。LESS是CSS合成类固醇。是的它对于我来说听起来更好一些,但是你知道它是什么意思。它将动态语言的特性带到CSS中,因此使得样式表更加强大和容易管理。

相关阅读

How to Squeeze the Most out of LESS(http://net.tutsplus.com/tutorials/php/how-to-squeeze-the-most-out-of-less/)

M —— MVC

模型视图控制模式,更为人所知的是MVC模式,是web开发中用得最多的模式之一。这是一个架构模式,它将web应用的每一部分分割到逻辑的大块以方便维护—— 模型处理数据,视图处理展现而控制器负责这两部分之间的数据流。

如果你使用现代web开发框架,你就使用了MVC。Ruby on Rails,Code Igniter和Zend Framework都使用这种模式。

相关阅读

专题:如何在ASP.NET MVC 2中使用jQuery UI控件

细说MVC框架的几大困惑

浅谈ASP.NET MVC 3中如何使用Model

ASP.NET MVC 3 新特性全解析

N —— node.JS

node.JS引领Web开发走进了一个新的时代。它使在非常快的VM(V8)引擎上运行JavaScript成为可能。这个思考模式的转移的结果可能不会马上就显现出来,但是过一段时间就会明显展现出它的优势了。

惊人的速度以及管理成千上万的并发IO事件是全世界JavaScript开发者主要的谈论点。

相关阅读

Learning Server-Side JavaScript with Node.js(http://net.tutsplus.com/tutorials/javascript-ajax/learning-serverside-javascript-with-node-js/)

O —— Object

面向对象编程因为它的灵活性已经被编程社区广泛接受。使用OOP你可以写很少行的代码,使得它更干净因此也更容易维护。但是究竟什么是对象呢?很难用一两句话去解释清楚,看下面的链接吧。

相关阅读

2月编程语言排行榜:Objective-C的咏叹调

Ruby父类Object被所有子类继承

浅析PHP object对象的具体含义

#p#

P —— PHP

PHP无疑是最流行的服务器端语言—— 它支撑着上百万,可能是几十亿的网页和应用。

虽然面对一系列的更新的,争论说更好的选择来写web应用程序,PHP不但生存下来了,而且来兴旺繁荣起来。WordPress,Joomla,Drupal,MediaWiki都使用PHP作为后端语言。一个主要的原因是部署容易并且你相对容易找到支持PHP的主机。

相关阅读

专题:PHP设计模式漫谈

10个免费的PHP脚本资源下载网站推荐

25个不错PHP的游戏编程脚本代码分享

PHP企业级应用之常见缓存技术深入解读

Q —— Query(查询)

在我们文章中查询可以代表很多东西。查询语言用于向外部系统获取数据的接口。SQL是一个很好的例子,它从关系型数据库中获取信息。

另一方面,查询字符串是作为URL一部分传递给web应用的一块。这个数据可能是用户要访问验证ID或交易的页面中的任何东西。查询字符串被格式化为键值对。

相关阅读

自制Python函数帮助查询小工具

详解MySQL limit查询优化的实际操作步骤

R —— Regular Expressions(正则表达式)

正则表达式提供一种灵活的方式来按指定的模式匹配文本中的字符串。它以一种特定的语言书写,并有解释器解析。所有现代语言都支持正则表达式。

相关阅读

微软发布SDL Regex Fuzzer正则表达式安全检测工具

学习笔记 全面认识Perl正则表达式

S —— Source Control(源码控制)

源码控制是一个团队开发过程中流行的做法,无论他们关注哪一个方面—— 任何领域的程序员都使用源码控制。但是它到底是什么呢?简单地说,源码控制让团队开发人员在一个文件集合上工作,跟踪并标识每个成员的更改。每个版本的代码都可以合来比较,合并甚至是还原。

相关阅读

Terminal, Git, and GitHub for the Rest of Us: Screencast(http://net.tutsplus.com/tutorials/tools-and-tips/terminal-git-and-github-for-the-rest-of-us-screencast/)

T —— TDD(测试驱动开发)

这又是一个所有开发者中普遍的元素。TDD是测试驱动开发的简写,指的是代码和自动这个代码的测试用例同时进行的过程。这移除了许多乏味的软件测试并且鼓励开发者更多的测试。

相关阅读

Clearwire LTE战略从FDD向TDD转移

Viual Studio 2010中的TDD开发初探

TDD/BDD会导致不完整的单元测试吗?

U —— Unit Testing(单元测试)

单元测试是一系列的TFF,小的代码单元被测试以确保他们是可发布的。然而单元测试经常与OPP中的方法有关,通常它意味着程序的中可以独立的测试最小单元。

相关阅读

初探PHP单元测试利器:PHPUnit

PHP单元测试利器:PHPUnit深入用法

PHP单元测试利器:PHPUnit深入理解

V —— VIM

VIM是一个非常极端的文本编辑器。Vim是免费,开源的,有无数的功能包可以选择。另一方面,它的学习曲线几乎是难以忍受的陡峭,如果没有好的资源,你可能会很长一段时间会迷失。点击下面的链接查看为什么它值得你去投靠。

相关阅读

使用技巧:Vim 的纵向编辑模式

有关vim编辑器使用心得的十个分享

Emacs和Vim:神的编辑器和编辑器之神

#p#

W —— WordPress

WordPress以最小的博客系统为起点,但是它现在已经惊人地扩张了。它的可扩展性使得它被用作从CMS到电子商务系统等各种用途。它还拥有很多狂热爱好者和追随者,包括开发和设计人员,他们想把它做成你将来网站可以依赖的可靠平台。

相关阅读

WordPress的18条必备SQL操作语句

BLOG启示录——WordPress博客建设与经营

WordPress CMS化的十二个必备插件

X —— XSS

XSS表示跨站脚本(Cross-site scripting)。这是当你创建网站时可能需到的众多安全问题之一。XSS指的是加载带有恶意脚本的易受攻击的网站或程序,以提升权限或获取敏感信息的行为,通常是二者都有。

相关阅读

面对跨站脚本攻击XSS的安全防御的有价值的建议

跨站脚本攻击XSS挑战Web安全

xss攻击 Web安全新挑战

Y —— YUI

Yahoo用户界面库是一个JavaScript库,它简化了创建交互式网站就用的过程。与大多数现代的类库一样,它提供了DOM操作和立即可以使用的AJAX。虽然没有jQuery出名,YUI依然拥有非常庞大的用户基础,并且它一直在活跃的开发中。

相关阅读

大师之间的论战 jQuery之父谈YUI3差在哪

Z —— Z index

Z-Index是一个CSS属性,它定义了一个元素在页面上如何堆叠—— 它定义了一个元素离视口顶端有多近。数值大表明它将出现在数值小的元素的上面。然而这个属性可能相对专业,当你创建widgets或更复杂的网页设计时它立刻就会起作用。

相关阅读

让你爱不释手的CSS在线设计工具

我们讲完了。希望你完整的看完了这些我收集起来的文章。 非常感谢阅读!
 

【编辑推荐】

  1. Web开发者必备工具大全(附下载)
  2. Web开发工程师必读的15个设计博客
  3. Go编程语言也可以用来编写Web应用?
  4. Web开发者必知的15个开源项目 你可知道?
  5. 移动Web应用开发的现状与未来
责任编辑:陈贻新 来源: RockUX
相关推荐

2011-05-18 11:01:39

Oracle

2011-07-05 13:59:23

XML

2010-12-14 09:22:27

HTML 5

2015-04-24 13:00:33

2015-03-23 17:18:18

Java字符串问题

2009-06-15 13:17:37

Java初学者Java概念

2019-01-03 13:26:23

CNCF云原生Kubernetes

2011-09-08 10:38:37

Widget

2021-02-03 09:00:00

AIOps数字化运营IT

2011-04-12 10:13:24

2020-08-25 10:14:59

JavaScript开发 技巧

2014-01-03 14:09:57

Git学习

2024-08-17 12:14:06

2011-09-16 09:38:19

Emacs

2022-04-24 15:21:01

MarkdownHTML

2017-07-10 16:40:09

2011-09-14 09:49:41

Android开发

2022-10-10 15:28:45

负载均衡

2015-07-20 13:56:59

SDN

2017-10-30 10:12:27

安卓开发初学者技巧
点赞
收藏

51CTO技术栈公众号