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
760
CTF From Zero To One
inndy
5
5.1k
Other Decks in Technology
See All in Technology
バッチ処理で悩むバックエンドエンジニアに捧げるAWS Glue入門
diggymo
3
120
スプリントレトロスペクティブはチーム観察の宝庫? 〜チームの衝突レベルに合わせたアプローチ仮説!〜
electricsatie
1
160
BPaaSにおける人と協働する前提のAIエージェント-AWS登壇資料
kentarofujii
0
120
進捗
ydah
2
240
【Grafana Meetup Japan #6】Grafanaをリバプロ配下で動かすときにやること ~ Grafana Liveってなんだ ~
yoshitake945
0
230
ヒューリスティック評価を用いたゲームQA実践事例
gree_tech
PRO
0
540
ZOZOマッチのアーキテクチャと技術構成
zozotech
PRO
3
1.3k
エラーとアクセシビリティ
schktjm
0
980
テストを軸にした生き残り術
kworkdev
PRO
0
170
Kubernetes における cgroup v2 でのOut-Of-Memory 問題の解決
pfn
PRO
0
460
5年目から始める Vue3 サイト改善 #frontendo
tacck
PRO
3
190
自作JSエンジンに推しプロポーザルを実装したい!
sajikix
1
150
Featured
See All Featured
Raft: Consensus for Rubyists
vanstee
140
7.1k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
For a Future-Friendly Web
brad_frost
180
9.9k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
800
Done Done
chrislema
185
16k
Making Projects Easy
brettharned
117
6.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.4k
Navigating Team Friction
lara
189
15k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
A Modern Web Designer's Workflow
chriscoyier
696
190k
Balancing Empowerment & Direction
lara
3
610
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 ࢧ䛑