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
470
資訊安全:麻瓜的黑魔法防禦術
inndy
3
2.7k
HackmeCTF 平台背後的心酸血淚史
inndy
2
740
COSCUP 2018 Lightning Talk - 審稿好難,所以我們來寫程式吧
inndy
0
340
逆向工程:從入門到放棄
inndy
7
3.3k
HITCON 2017 Zeroday 發表會
inndy
0
1.2k
No More Crypto Fails
inndy
33
7.6k
你再共用密碼啊
inndy
1
680
CTF From Zero To One
inndy
5
4.5k
Other Decks in Technology
See All in Technology
データマネジメントを支える武器としてのメタデータ管理
10xinc
2
1k
AFTを運用していたらAWS Configの課金が急増していた件
msato
0
120
「XX試験の環境作ってよ」と言われた時によく使うAWSのソリューションについて
bun913
0
120
Azureコストは水道代/The_47th_Tokyo_Jazug
aeonpeople
3
390
エンジニア候補者向け資料2024.03.28.pdf
macloud
0
2.9k
業務で使えるかもしれない…!?GitHub Actions の Tips 集 / CI/CD Test Night #7
ponkio_o
PRO
24
7.3k
初心者が行く!サーバレスWebアプリ開発の道
nagaharutogawa
0
460
生成AIサービスPanorama AIご説明資料
sdt
0
300
継続的テストモデルを実現するためにスリーアミーゴスを用いた10Xでのシフトレフトの事例
nihonbuson
3
270
統計的学習理論読み Chapter 2
kmatsui
1
300
Why do you get AWS certificates
hirosys
0
120
SREsのためのSRE定着ガイド
netmarkjp
10
1.7k
Featured
See All Featured
Art, The Web, and Tiny UX
lynnandtonic
288
19k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
39
4.3k
Optimizing for Happiness
mojombo
369
69k
A designer walks into a library…
pauljervisheath
199
23k
Making the Leap to Tech Lead
cromwellryan
123
8.4k
Designing Experiences People Love
moore
135
23k
In The Pink: A Labor of Love
frogandcode
137
21k
RailsConf 2023
tenderlove
0
510
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
19
1.6k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
18
1.7k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
242
20k
How GitHub (no longer) Works
holman
301
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 ࢧ䛑