[생활코딩 & 그랩의 기술블로그] 서버와 클라이언트 간단 기초 학습 메모(#웹서버, #Api 서버)

역시 기본은 생활코딩.. 예전에 웹을 처음 공부하기 시작했을 때 보았던 영상이지만, 한창 공부하다가 다시 돌아와서 보니 이해가 쉬워졌다.. 역시 반복학습이 최고다. +그랩의 개발블로그 또한 최고.. 생활코딩과 함께 두고, 서버와 클라이언트에 대한 전반적인 이해에 성공했습니다! 핵심적인 것들만 개인 리마인드 용으로 이곳에 메모메모합니다.. 혹, 필요하신 분들은 하단에 첨부한 원문 포스트 참고해 주세요!

이 클라이언트와 서버의 소통 과정을 좀 더 들여다보자.

웹과 API의 서버 통신 @출처: 그랩의 블로그- 프론트엔드(웹) 큰그림 뿌셔먹기

좀 더 풀어서 보면, 다음과 같다. 

1. 브라우저가 웹을 요청(사용자가 브라우저에 url입력 시) 했을때, 웹서버가 갖고있던 웹(html,css, js)을 넘겨준다. 

2. 1번 과정을 통해 브라우저가 최종적으로 웹을 화면에 그렸다(브라우저 렌더링). 

3. 사용자가 웹을 사용하면서 서버와의 소통이 필요해지는 순간이 오면, 브라우저는 웹서버에게 요청하는 것이 아니라 API 서버에게 요청을 하게 된다. 

4. 백엔드 API 서버에서는 브라우저에게 요청 결과를 전달한다. 

5. API 결과를 바탕으로, 메인 페이지로 이동시키라는 코드가 실행된다. 

 

 @출처: 그랩의 블로그- 프론트엔드(웹) 큰그림 뿌셔먹기

 

웹서버에 대한 추가 정보

 

+API 서버에 대한 추가 설명

@출처: 그랩의 블로그- 백엔드(서버/클라우드) 큰그림 뿌셔먹기

 

 

 

 

 

 

출처: 

생활코딩 : www.youtube.com/watch?v=YfXj8kOo7j4&list=RDCMUCvc8kv-i5fvFTJBFAk6n1SA&start_radio=1&t=62

그랩의 블로그 : www.grabbing.me/8d9e92b19e084c5a8cb173a695aa81af#1837c3e178cf4f0bbe9cc097cd07662f

그랩의 블로그 : www.grabbing.me/69a68655ae9c46efaeae5014b9f9034d#29f0197387954cfa88b7cbb2b51356b7

백엔드(서버/클라우드) 큰그림 뿌셔먹기