Request Sequence Demos
Simple LR
-
Left: A
-
Right: B
-
Requests:
- LR ---> Hello!
- LR <--- Hello!
- LR ---> How are you?
- LR <--- I'm good, thanks
Simple LR with Info
-
Left: A
-
Right: B
-
Requests:
- LR ---> Hello!
- LR <-i- Thinks...
- LR <--- Hello!
- LR -i-> Happy!
- LR ---> How are you?
- LR <--- I'm good, thanks
HTTP Requests
-
Left: Web Browser
The web browser is the client
-
Right: Web Server
The web server services requests from the client
-
Requests:
- LR ---> GET Request: index.html
- LR <--- Response (200): index.html
- LR -i-> Parses HTML
- LR ---> GET Request: styles.css
- LR <--- Response (200): styles.css
- LR -i-> Renders the page
Simple LMR
-
Left: A
-
Middle: B
-
Right: C
-
Requests:
- LM ---> Hello!
- MR ---> Hello!
- MR <--- How are you?
- LM <--- How you are?
-
Left: A
-
Middle: B
-
Right: C
-
Requests:
- LM ---> Hello!
- LM <-i- Ponders on this
- MR ---> Hello!
- MR <-i- Is excited!
- MR <--- How are you?
- LM <--- How you are?
Web App
-
Left: Web Browser
The web browser is the client
-
Middle: Web Server
The web server services requests from the client
-
Right: DB Server
The DB server services database requests from the web server
-
Requests:
- LM ---> HTTP GET /
- LM <-i- Matches route
- MR ---> SQL SELECT
- MR <--- DB Data
- LM <-i- Builds page
- LM <--- HTTP Response HTML
- LM -i-> Parses HTML
- LM ---> HTTP GET styles.css
- LM <--- HTTP Response CSS
- LM -i-> Renders page
Animated
-
Left: A
-
Right: B
-
Requests:
- LR ---> Hello!
- LR <--- Hello!
- LR ---> How are you?
- LR <--- I'm good, thanks
-
Left: A
-
Right: B
-
Requests:
- LR ---> Hello!
- LR <-i- Thinks...
- LR <--- Hello!
- LR -i-> Happy!
- LR ---> How are you?
- LR <--- I'm good, thanks
Web App
-
Left: Web Browser
The web browser is the client
-
Middle: Web Server
The web server services requests from the client
-
Right: DB Server
The DB server services database requests from the web server
-
Requests:
- LM ---> HTTP GET: route /
- MR ---> SQL SELECT: required data
- MR <--- DB Data
- LM <--- HTTP Response: HTML of home page
- LM ---> HTTP GET: styles.css
- LM <--- HTTP Response: styles.css
Web App
-
Left: Web Browser
The web browser is the client
-
Middle: Web Server
The web server services requests from the client
-
Right: DB Server
The DB server services database requests from the web server
-
Requests:
- LM ---> HTTP GET /
- LM <-i- Matches route
- MR ---> SQL SELECT
- MR <--- DB Data
- LM <-i- Builds page
- LM <--- HTTP Response HTML
- LM -i-> Parses HTML
- LM ---> HTTP GET styles.css
- LM <--- HTTP Response CSS
- LM -i-> Renders page