초기의 웹은 단방향
자료구조:HTML
UI: CSS
<h3 id="heading-ui">UI 체계 추가</h3>
<ul>
<li>HTML 파일만 쓰다가 UI 필요성</li>
<li>CSS 파일, 사진도 생김</li>
<li>순서도 HTML, CSS, 사진 순으로 날라온다</li>
</ul>
<h3 id="heading-7kcc7ja0ioyytoqzhcdstptqsia">제어 체계 추가</h3>
<ul>
<li>양방향 상호작용</li>
<li>예) 로그인 기능 시 id를 보냄</li>
<li>이벤트 발생 시 http.request.method == POST</li>
<li>웹서버: 송수신 담당</li>
<li>처리담당에게 넘긴다</li>
<li>문맥(상태-&gt;전이) -&gt;기억(기록)</li>
<li>예) 로그인 전, 로그인 중, 로그인 후</li>
<li>DB: SQL로 처리담당과 연결(select)</li>
<li>동적인 문서가 생성됨</li>
<li>예) id님 안녕하세요</li>
</ul>
<hr />
Script의 역사: 
<ul>
<li>Mocha</li>
<li>Live</li>
<li>JavaScript
브라우저(Web Client)에서 실행됨</li>
</ul>
<hr />
<h3 id="heading-3">웹서비스 3대 요소</h3>
<ol>
<li>구문 분석기</li>
<li>렌더링 엔진</li>
<li>연산 (JS)</li>
</ol>

초기의 웹은 단방향

자료구조:HTML
UI: CSS

### UI 체계 추가
- HTML 파일만 쓰다가 UI 필요성
- CSS 파일, 사진도 생김
- 순서도 **HTML, CSS, 사진** 순으로 날라온다

### 제어 체계 추가
- **양방향** 상호작용
- *예) 로그인 기능 시 id를 보냄*
- 이벤트 발생 시 http.request.method == POST
- **웹서버**: 송수신 담당
- **처리담당**에게 넘긴다
- **문맥**(상태->전이) ->**기억**(기록)
- *예) 로그인 전, 로그인 중, 로그인 후*
- **DB**: SQL로 처리담당과 연결(select)
- **동적**인 문서가 생성됨
- *예) id님 안녕하세요*

---
Script의 역사: 
- Mocha
- Live
- JavaScript
**브라우저(Web Client)에서 실행됨**

---

### 웹서비스 3대 요소
1. 구문 분석기
2. 렌더링 엔진
3. **연산** (JS)





11.[Network] 웹 서비스 3대 요소

UI 체계 추가

제어 체계 추가

웹서비스 3대 요소