SlideShare a Scribd company logo
1 of 27
Web开发基础(一) 蔡啸 2011/1/17
提纲 Web基础知识 http协议,请求响应模型 浏览器端开发 html/css/dom javascript dojo 服务器端开发 python django
Web基础知识 五层网络协议 应用层(HTTP) We build our apps on top of this. 传输层 网络层 数据链路层 物理层
Web基础知识 What is web app? Software which is built upon Internet,  and based on HTTP protocol Famous web app? Gmail Google Maps Facebook Web QQ
Web基础知识 HTTP请求响应模型
Web基础知识 HTTP协议 (RFC2616, HTTP 1.1) 支持五种类型的方法: GET POST PUT DELETE HEAD
浏览器端开发 HTML(hypertext markup language) 对文档进行结构化描述的标记语言 历史: 1999 HTML 4.01 Now  HTML 5 is approaching
浏览器端开发 ,[object Object],二维绘图API 允许web应用程序将自身注册为某个协议或MIME类型的API 播放视屏和音频的API 历史记录API跨文档的消息传递,使得文档可以互相通信而不用考虑它们的来源域 支持拖放操作的API 支持编辑操作的API 新的网络API使用javascript API的键值对来实现客户端的持久化存储,同时支持嵌入的SQL数据库 服务器推送
浏览器端开发 DOM模型 用于表示html生成的文档的结构 插入删除节点 修改节点属性(调节css) 注册消息响应事件 问题: 主流浏览器的实现的差异性(DOM Level2)
浏览器端开发 javascript 在设计上受一定的c影响,但仍有许多的差异 弱类型动态语言 变量定义 var s = ‘string’; var i = 1; var f = 1.00; varobj = {}; var array = [];
浏览器端开发 javascript 闭包: funtionclosureTest(){ vartestArray = [1,2,3,4,5]; function printArray(){ 	for (var i = 0; i < testArray.length; i++){ 		console.log(testArray[i]); 	} 	} }
浏览器端开发 web开发的问题 不同浏览器实现的差异性 标准的API过于底层 javascript缺乏良好的OO支持 于是: javascript框架应用而生 著名的javascript框架: jquery, dojo, mootools, YUI,etc
浏览器端开发 Dojo是一个web开发框架,它对浏览器实现差异进行了屏蔽,提供了一个强壮的、易用的高抽象层次的访问接口。 它由三个部分组成: dojo: dojo的核心库,用于实现最为基础和重要的客户端编程,比如对dom对象的操作,ajax通讯等。 dijit: js的ui库, dojox: 实验性的js功能,比如制图
浏览器端开发 dojo.query:查找符合指定条件的dom元素 pure js dojo
浏览器端开发 dojo.xhr用于向服务器端发送AJAX请求 dojo pure js
浏览器端开发 dijit控件: 两种使用方式: 标记语言式声明 脚本语言动态生成
服务器端开发 常见的服务器端开发解决方案 ASP.NET JAVA EE(struts, spring) Coldfusion Python with Django Ruby on Rails PHP(Zend)
服务器端开发 Django 诞生于2005,它是基于python的web开发框架。 特性: ORM admin管理界面和以及可以给予其扩展的能力 模板语言 web开发工具集,可以提高管理配置的生产率
服务器端开发 安装 创建项目 wgethttp://www.djangoproject.com/download/1.2.3/tarball/ tar xzvf Django-1.2.3.tar.gzcd Django-1.2.3sudo python setup.py install django-admin.py startproject $projectname ./manage.py runserver
服务器端开发 一个django新项目的文件目录结构: 创建app python manage.py start project
服务器端开发 定义url映射 修改$home/urls.py 和$home/app_demo/urls.py
服务器端开发 定义view函数 启动server
服务器端开发 To be continued… ORM模型 模板系统 部署 请求响应模型
参考资料 Web标准 HTTP 1.1 标准 RFC2616 HTML 4.1 标准  DOM Level2 标准 CSS 2标准 JavaScript: JavaScript: The Good Parts by Douglas Crockford JavaScript: The Definitive Guide by David Flanagan
参考资料 dojo: http://dojotoolkit.org/api/  dojo官方文档,目前最新的版本已经比较详尽了 http://dojocampus.org/explorer/  dojo campus 有很多不错的示例代码 sitepen网站 Dojo: The Definitive Guide, Matthew A. Russell
参考资料 Python Dive Into Python, Mark Pilgrim Expert Python Programming: Best practices for designing, coding, and distributing your Python software  by TarekZiadé http://docs.python.org python官方文档 http://stackoverflow.com/questions/tagged/python活跃的python社区
参考资料 Django http://docs.djangoproject.com/en/1.2/ Django Step By Step, by limodou, http://stackoverflow.com/questions/tagged/django   Others: What should a developer know before building a public web site

More Related Content

Similar to Web开发基础

Html5 最重要的部分
Html5 最重要的部分Html5 最重要的部分
Html5 最重要的部分Tom Fan
 
Web development overview
Web development overviewWeb development overview
Web development overviewWei Sun
 
PHP & AppServ
PHP & AppServPHP & AppServ
PHP & AppServHt Wang
 
前端開發學習簡介
前端開發學習簡介前端開發學習簡介
前端開發學習簡介peterju
 
introduction of web 2.0
introduction of web 2.0introduction of web 2.0
introduction of web 2.0soboring
 
HTML5 历史、现状及未来
HTML5 历史、现状及未来HTML5 历史、现状及未来
HTML5 历史、现状及未来Yongbin Tian
 
Build website
Build websiteBuild website
Build websitecri fan
 
Html 5初探
Html 5初探Html 5初探
Html 5初探keelii
 
Regular expression
Regular expressionRegular expression
Regular expressioncri fan
 
HTML & JavaScript
HTML & JavaScriptHTML & JavaScript
HTML & JavaScriptSanji Zhang
 
用 Go 語言打造 DevOps Bot
用 Go 語言打造 DevOps Bot用 Go 語言打造 DevOps Bot
用 Go 語言打造 DevOps BotBo-Yi Wu
 
[DCTPE2010] Drupal 遇上行動網路服務
[DCTPE2010] Drupal 遇上行動網路服務[DCTPE2010] Drupal 遇上行動網路服務
[DCTPE2010] Drupal 遇上行動網路服務Drupal Taiwan
 
HTML5 生态系统和应用架构模型
HTML5 生态系统和应用架构模型HTML5 生态系统和应用架构模型
HTML5 生态系统和应用架构模型Tom Fan
 
HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)
HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)
HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)Will Huang
 
Web development introduced history and future
Web development introduced history and futureWeb development introduced history and future
Web development introduced history and futurejarryli
 
PHP WEB 应用组织与结构
PHP WEB 应用组织与结构PHP WEB 应用组织与结构
PHP WEB 应用组织与结构HonestQiao
 
Programming language basic
Programming language basicProgramming language basic
Programming language basiccri fan
 
使用GoogleAppEngine建立个人信息中心
使用GoogleAppEngine建立个人信息中心使用GoogleAppEngine建立个人信息中心
使用GoogleAppEngine建立个人信息中心Du Yamin
 
富文本编辑器在互联网上的应用
富文本编辑器在互联网上的应用富文本编辑器在互联网上的应用
富文本编辑器在互联网上的应用luolonghao
 

Similar to Web开发基础 (20)

Html5 最重要的部分
Html5 最重要的部分Html5 最重要的部分
Html5 最重要的部分
 
Web development overview
Web development overviewWeb development overview
Web development overview
 
PHP & AppServ
PHP & AppServPHP & AppServ
PHP & AppServ
 
前端開發學習簡介
前端開發學習簡介前端開發學習簡介
前端開發學習簡介
 
introduction of web 2.0
introduction of web 2.0introduction of web 2.0
introduction of web 2.0
 
HTML5 历史、现状及未来
HTML5 历史、现状及未来HTML5 历史、现状及未来
HTML5 历史、现状及未来
 
Build website
Build websiteBuild website
Build website
 
Html 5初探
Html 5初探Html 5初探
Html 5初探
 
Regular expression
Regular expressionRegular expression
Regular expression
 
HTML & JavaScript
HTML & JavaScriptHTML & JavaScript
HTML & JavaScript
 
用 Go 語言打造 DevOps Bot
用 Go 語言打造 DevOps Bot用 Go 語言打造 DevOps Bot
用 Go 語言打造 DevOps Bot
 
[DCTPE2010] Drupal 遇上行動網路服務
[DCTPE2010] Drupal 遇上行動網路服務[DCTPE2010] Drupal 遇上行動網路服務
[DCTPE2010] Drupal 遇上行動網路服務
 
Html5
Html5Html5
Html5
 
HTML5 生态系统和应用架构模型
HTML5 生态系统和应用架构模型HTML5 生态系统和应用架构模型
HTML5 生态系统和应用架构模型
 
HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)
HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)
HTML5 規格最新發展現況 (HTML5 趨勢發展與技術應用論壇)
 
Web development introduced history and future
Web development introduced history and futureWeb development introduced history and future
Web development introduced history and future
 
PHP WEB 应用组织与结构
PHP WEB 应用组织与结构PHP WEB 应用组织与结构
PHP WEB 应用组织与结构
 
Programming language basic
Programming language basicProgramming language basic
Programming language basic
 
使用GoogleAppEngine建立个人信息中心
使用GoogleAppEngine建立个人信息中心使用GoogleAppEngine建立个人信息中心
使用GoogleAppEngine建立个人信息中心
 
富文本编辑器在互联网上的应用
富文本编辑器在互联网上的应用富文本编辑器在互联网上的应用
富文本编辑器在互联网上的应用
 

Web开发基础