Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Web Architecture
Search
Inndy
May 11, 2016
Technology
0
400
Web Architecture
那些在瀏覽器背後發生的大小事情
Inndy
May 11, 2016
Tweet
Share
More Decks by Inndy
See All by Inndy
工程師一定要懂的 Text Encoding
inndy
1
690
資訊安全:麻瓜的黑魔法防禦術
inndy
3
3k
HackmeCTF 平台背後的心酸血淚史
inndy
2
830
COSCUP 2018 Lightning Talk - 審稿好難,所以我們來寫程式吧
inndy
0
440
逆向工程:從入門到放棄
inndy
7
3.5k
HITCON 2017 Zeroday 發表會
inndy
0
1.3k
No More Crypto Fails
inndy
33
8.1k
你再共用密碼啊
inndy
1
750
CTF From Zero To One
inndy
5
5.1k
Other Decks in Technology
See All in Technology
アカデミーキャンプ 2025 SuuuuuuMMeR「燃えろ!!ロボコン」 / Academy Camp 2025 SuuuuuuMMeR "Burn the Spirit, Robocon!!" DAY 1
ks91
PRO
0
150
はじめての転職講座/The Guide of First Career Change
kwappa
5
4.4k
[kickflow]20250319_少人数チームでのAutify活用
otouhujej
0
170
Delegate authentication and a lot more to Keycloak with OpenID Connect
ahus1
0
240
JAWS-UG のイベントで使うハンズオンシナリオを Amazon Q Developer for CLI で作ってみた話
kazzpapa3
0
120
PFEM Online Feature Flag @ newmo
shinyaishitobi
1
150
メルカリIBIS:AIが拓く次世代インシデント対応
0gm
2
460
Jamf Connect ZTNAとMDMで実現! 金融ベンチャーにおける「デバイストラスト」実例と軌跡 / Kyash Device Trust
rela1470
1
210
オブザーバビリティ文化を組織に浸透させるには / install observability culture
mackerelio
0
340
20250807 Applied Engineer Open House
sakana_ai
PRO
2
610
会社にデータエンジニアがいることでできるようになること
10xinc
7
820
プロジェクトマネジメントは不確実性との対話だ
hisashiwatanabe
0
160
Featured
See All Featured
Thoughts on Productivity
jonyablonski
69
4.8k
Art, The Web, and Tiny UX
lynnandtonic
301
21k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
460
Documentation Writing (for coders)
carmenintech
73
5k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
21k
How GitHub (no longer) Works
holman
314
140k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Balancing Empowerment & Direction
lara
2
570
Imperfection Machines: The Place of Print at Facebook
scottboms
268
13k
A designer walks into a library…
pauljervisheath
207
24k
Scaling GitHub
holman
462
140k
Transcript
WEB ARCHITECTURE NTUST CODING CLUB
WEB ARCHITECTURE OUTLINE ▸ Server & Client ▸ HTTP? ▸
ೲӥ Enter ԏ盅咳ኞጱԪ ▸ 蝢懱㶧ਧ ▸ 礚፡ HTTP 獉
֑๐瑊 / ਮ䜛ᒒ Ӟ獤傶ԫ
CLIENT SERVER ———— 翕᪠蝫娄 ————
WEB ARCHITECTURE ਮ䜛ᒒ ▸ ֦ጱ倵薩瑊 ▸ 礓㮆 App ҁֺই物Facebook҂ ▸
curl, netcatҁLinux 瞲犤҂ ▸ request ҁNodeJS ጱ HTTP client library҂
WEB ARCHITECTURE ֑๐瑊 ▸ Apache ▸ LAMP — Linux /
Apache / MySQL / PHP ▸ nginx ▸ 斕ᰁ玕ᘒӬ穉斃盠ጱ֑๐瑊 ▸ IIS ▸ 盏敟ڊߝ牧砇蟴 ASP.NET 螀֢ࣁ Windows Ӥ
HTTP?
HYPER TEXT TRANSFER PROTOCOL HTTP WEB ARCHITECTURE
ᮎ犚ࣁೲӥ ENTER ԏ盅咳ኞጱԪ眐
None
None
None
奾牐
WEB ARCHITECTURE ᮎ犚ࣁೲӥ ENTER ԏ盅咳ኞጱԪ眐 ▸ DNS 礚扇 ▸ 翕࣎旉矦౮
IP ֖࣎ ▸ TCP 蝫娄 ▸ ݻ֑๐瑊咳蚏 TCP 蝫娄ᥝ穩 ▸ ୌ缏 HTTP 藶穩㪔Ӭ蝑ڊ ▸ 虏౯㮉㬵፡፡ HTTP ጱ獉牦 蝡犚Ԫ眐᮷ฎኧਮ䜛ᒒਠ౮ጱ
WEB ARCHITECTURE ▸ Routing ▸ 䲆礯䌘䛑 / 碝ᄤጱ敟誢᪠ኧ ▸ Controller
/ Script / CGI ▸ ݢ胼ฎӞ㮆 php 䲆礯牧犖ݢ胼ฎ NodeJS ጱ纷ୗ ▸ 蜴ࢧ HTTP ࢧ䛑妔ਮ䜛ᒒ ▸ 匍ࣁ֦ݢ犥፡ک Google Ḓ殷ԧ牦 ᮎ犚ࣁೲӥ ENTER ԏ盅咳ኞጱԪ眐 蝡犚Ԫ眐᮷ฎኧ֑๐瑊ਠ౮ጱ
WEB ARCHITECTURE ▸ 倵薩瑊ӥ斉ٌ犢虻碘 (瑽粙, CSS, ...) ▸ 叨ኞๅग़ጱ HTTP
藶穩 ▸ HTML 礕砻樄ত向ڊ翕殷 ▸ JavaScript 砻樄ত᪒ JavaScript 纷ୗ ▸ 匍ࣁ֦ݢ犥ࣁ Facebook Ӥ咳䔂ԧ牦 ᮎ犚ࣁೲӥ ENTER ԏ盅咳ኞጱԪ眐 蝡犚Ԫ眐᮷ฎኧਮ䜛ᒒਠ౮ጱ
WEB ARCHITECTURE HTTP 藶穩 GET / HTTP/1.1\r\n Host: localhost\r\n Accept:
text/html\r\n \r\n
WEB ARCHITECTURE HTTP/1.1 200 OK\r\n Content-Length: 45\r\n Content-Type: text/html\r\n \r\n
<html><body><h1>Hello, Web</h1></body></html> HTTP ࢧ䛑