Day 9,10. Server/Client/HTTP, AJAX

Server & Client

서버는 쉽게 말해 어떤 정보를 관리하고 제공해주는 녀석이고, 클라이언트란 해당 정보를 주문한 녀석입니다.

개발자에게 서버란?         네트워크 상에서 어떠한 자료 또는 서비스에 대한 접근을 관리하는 컴퓨터

A computer which manages access to a centralized resource or service in a network.

웹에서 말하는 서버란 네트워크에 연결되어 있어야 한다.

네트워크에 연결 된다면? IP주소를 부여받게 된다. IP주소를 부여 받는다면, 다른 컴퓨터들이 해당 주소로 방문할 수 있다. 그리고 클라이언트들이 해당 주소로 주문을 넣을 수 있다. 

IP Address

웹 네트어크 상의 컴퓨터마다 할당되는 주소

Domain 

IP address에 접근할 수 있는 주소

개발자에게 클라이언트란?

서버에 있는 자료를 접근할 수 있는 프로그램

1. 웹브라우저

2. 핸드폰 어플리케이션

3. 데스크탑 어플리케이션

제가 만약 www.google.com을 방문하는 시나리오를 살펴보면,

참가자 목록

1. 클라이언트 : 제가 사용하는 브라우저

2. 서버 : 구글 홈페이지 HTML을 관리하는 네트워크 상의 컴퓨터

브라우저가 구글 서버로 html 한개 주문을 넣어야 하는데, 구글 서버의 주소를 어떻게 찾아갈까요?

DNS Server    (Domain Name Servers)

모든 웹 서버들의 주소를 우리가 외우고 있을 수는 없습니다. 때문에 DNS 서버들이 클라이언트들이 IP주소를 쉽게 찾을 수 있도록 인터넷 주소록 역할을 해줍니다.

 

HTTP

HyperText Transfer Protocol

웹에서 주고 받는 메시지에 대한 규칙의 정의

웹에서 메시지 교류는 어떠한 형식으로 이루어져야 하는지, 요청과 응답은 어떤 식으로 이루어져야 하는지 등을 정의한다.

반드시 지켜야하는 것은 아니지만 오랜 시간 사용되며 검증된 시스템이다.

AJAX

Asynchronous Javascript And XML

프로그래밍 언어 혹은 툴이 아니라, 컨셉이고 개념입니다.

"the method of exchanging data with a server, and updating parts of a web page - without reloading the entire page."

예전에는 서버와 통신하게 되면 웹페이지를 새로 고침했어야 하는데, 요즘은 그렇게 하지 않습니다.

지금은 서버와 통신하는 방법 중 하나라고 알고 있으면 된다.

사용되는 것들

1. HTML

2. DOM

3. Javascript

4. XMLHttpRequest

개발자 도구의 XHR을 보면 AJAX에 대한 정보들을 볼 수 있다. 

HTTP Request

http로 정보들이 들어오고 나가고 하는데, 이런식으로 전송된다.

이런식으로 text 정보가 나가면 이 정보를 이용하여 server가 이에 해당하는 데이터를 요청한다.

Request Method

• GET    정보를 달라
• POST    정보를 만들라
• PUT    정보를 수정하라
• DELETE    정보를 지우라

Response Code

• 1XX    무시해도 됨
• 2XX    성공적
• 3XX    리디렉션
• 4XX    클라이언트 에러
• 5XX    서버 에러

JSON

Javascript Object Notation

AJAX 요청을 보낼 때 많이 쓰이는 파일형식,포맷이다.

key value 형식인데, key는 "" 안에 입력되어 있다.

JSON에 들어갈 수 있는 형식

AJAX 요청을 보내는 방법

비동기