1. 程序员的
Web开发⼊入⻔门教程
13年11⽉月13⽇日周三

2. Web⽣生态系统
Web Server
Browser
Firefox
Chrome
Safari
360SE
IE
...
13年11⽉月13⽇日周三
HTTP
Nginx
Apache
IIS
...
App Service
IPC
===
FastCGI
CGI
...
Embded
PHP
Java
Python
C/C++
Ruby
...
Storage
Network
Embded
MySQL
SSDB
Redis
Hadoop
...

3. 前端和后端
• 前端 ~= Browser
• 后端 ~= Web Server + App Service +
Storage
• 前后端的交互同时属于前端和后端
• 优秀的软件⼯工程师必须同时会前端和后
端
13年11⽉月13⽇日周三

4. 前端 - ⼈人机交互
• 输出 - HTML+CSS显⽰示软件界⾯面
• 输⼊入 - 通过链接和表单等
• JavaScript在输⼊入和输出时做⼀一些处理
13年11⽉月13⽇日周三

5. 后端 - 数据处理
• Data = Input + Storage
• ⽣生成⽂文本(HTML+CSS+JS...)和⼆二进制数据
(图⽚片...)
13年11⽉月13⽇日周三

6. Web开发技术
• ⾓角⾊色内开发 - 编程
•
•
PHP, HTML, JavaScript, CSS, ...
•
•
HTTP, 各种⺴⽹网络协议
所有你能想到或者想不到的编程语⾔言
• ⾓角⾊色间开发 - 协议
13年11⽉月13⽇日周三
只要涉及交互, 就必须显式或者隐式地需要协议

7. Browser & Web Server
• BS架构就是CS架构
• 浏览器解析URL, 最终通过IP和端⼝口和服
务器的80端⼝口(默认)建⽴立TCP连接
• URL中的其它信息, 还有其它信息通过⺴⽹网
络连接发送
• Browser是什么?
• 协议!
13年11⽉月13⽇日周三

8. Web Server & App Service
• 静态Web Server只能将⽂文件内容返回
• 如果内容是即时⽣生成的, 那么就由App
Service来⽣生成
• App Service是什么?
• 交互和协议!
13年11⽉月13⽇日周三

9. App Service & Storage
• 数据要存储
• 协议!
13年11⽉月13⽇日周三

10. 为什么PHP
• 功能强⼤大
• 语法通⽤用, 友好, 不极端
13年11⽉月13⽇日周三

11. Web开发很美好
• 界⾯面好看
• 技术全⾯面
• 顶尖公司
13年11⽉月13⽇日周三

12. 不会, 就学
13年11⽉月13⽇日周三