[React.js, 스트링부트, AWS로 배우는 웹개발 101] 1장 개발을 시작하기 전에

• 이 책은 커맨드라인 인터페이스(Command Line Interface)를 많이 이용한다.
• CLI는 운영체제 의존성이 낮다.
• CLI에 익숙해지는 것이 개발자에게 많은 도움이 되므로 CLI가 처음이라면 이 기회에 익혀보자.

> CLI(Command Line Interface)란?

명령 줄 인터페이스 또는 명령어 인터페이스는 텍스트 터미널을 통해 사용자와 컴퓨터가 상호 작용하는 방식을 뜻한다. 즉, 작업 명령은 사용자가 컴퓨터 키보드 등을 통해 문자열의 형태로 입력하며, 컴퓨터로부터의 출력 역시 문자열의 형태로 주어진다.

- CLI는 입력과 출력으로 구성되어 있는데, 이런 입출력이 가능하게 해주는 소프트웨어를 터미널이라고 합니다. 사용자가 입력한 명령어를 해석해주는 소프트웨어를 셸(shell)이라고 합니다.

- CLI는 윈도우에서는 명령 프롬프트(CMD)이고 '>'이 형태입니다. 그리고 맥과 리눅스에서는 Terminal 환경이고, '$'의 형태로 표시합니다.

 

기술과 구현 사이

• HTML/CSS/React.js : 프론트엔드 애플리케이션 개발에 사용한다. 이 애플리케이션은 프론트앤드 클라이언트를 반환하는 서버로, React.js 애플리케이션을 반환하는 것이다.
• 스프링부트 : 백엔드 애플리케이션 개발에 사용한다. 이 애플리케이션으로 REST API를 구현하고, 이를 프론트엔드 애플리케이션이 사용한다. 이때, 애플리케이션은 웹 애플리케이션 말고도 별도의 백엔드 개발 없이 REST API를 모바일 앱에서도 사용할 수 있다.
• AWS : 프론트엔드와 백엔드 애플리케이션이 실행될 프로덕션 환경을 구축하기 위해서 사용한다. 이는 6장에서 자세히 설명한다.

 

HyperText Transfer Protocol, 하이퍼텍스트 트랜스퍼 프로토콜(HTTP)

 

HTTP는 애플리케이션 레벨의 네트워크 프로토콜이다. 이는 서버와 클라이언트 간에 통신한다.

HyperText: '다른 문서로 향하는 링크가 있는 텍스트'로 시작

- HyperText Markup Language(HTML): 문서 내에서 HyperText를 지정하기 위해서 HTML을 사용해야 한다.

Transfer Protocol: 통신을 하기 위한 규약

-> 오늘날의 HTTP는 HTML 문서를 주고 받던 간단한 프로토콜에서 벗어나 그림 파일, 동영상, 3D 등 다양한 미디어 리소스를 주고받는 형태로 발전했다.

 

HTTP 요청과 응답

• 브라우저 창에 URL을 치면, HTTP GET 요청을 해당 URL 서버로 전송한다.
• 그 결과 HTTP 응답을 브라우저에 렌더링(화면에 디스플레이)한다.

 

HTTP 메서드와 기능

 

메서드	기능
GET	리소스를 가져올 때 사용
POST	리소드에 대해 임의의 작업(ex. 생성, 수정)을 할 때 사용
PUT	리소스를 대체할 때 사용
DELETE	리소스를 삭제할 때 사용

• HTTP 메서드 '기능'이라는 의미란 '이런 기능을 위한 API에 사용하는게 좋다'라는 의미다.
• 각 메서드에 연결되는 API는 개발자가 작성해야 한다.

 

HTTP 응답 코드

 

HTTP 응답 코드	의미
200	성공적으로 요청을 처리함
404	해당 리소스는 존재하지 않음
403	송신자에게 해당 리소스에 접근할 수 권한이 없음
500	서버의 에러로 인해 요청을 처리할 수 없음

 

Content-Type

• 응답의 미디어 타입을 의미한다.
• 예로는, text/html, text/css, application/json, video/mpeg 등이 있다.

 

JSON, JavaScript Object Notation

• 단순한 문자열이 아닌, '오브젝트'를 표현하기 위한 문자열이다.

이때, 오브젝트란 메모리 상에 존재하는 어떤 자료구조이다.

서로 다른 언어와 아키텍쳐를 가진 두 애플리케이션이 존재할 때, 오브젝트를 전송할 때 둘 다 이해할 수 있는 형태로 오브젝트를 변환해야 한다.

여기서 전송하기 위해서 메모리 상의 오브젝트를 다른 형태로 변환하는 작업을 직렬화(Serialization)이라 하고, 이 반대 작업을 역직렬화(Deserialization)이라 한다.

 

• 키-값(Key-Value)의 형태로 오브젝트를 표현한 문자열이다.
• Key: 자바의 인스턴스 변수의 이름, Value: 변수에 들어간 값

{
    "title": "myTitle",
    "done": false
}

자료형/구조	표현 방법
Boolean	true 또는 false
숫자	쌍따옴표 없는 숫자. ex) 10
문자열	쌍따옴표로 감싼 형태 ex) "Study"
오브젝트	중괄호로 감싼 형태 ex) {"title" : "myTitle" }
배열	대괄호로 감싼 형태 ex) ["abc" : "myTitle"]

 

서버

서버란 프로그램이다. 포트에 소켓을 열고 클라이언트가 연결할 때까지 무한 대기하면서 기다린다.

정적 웹 서버, Static Web Server
- HTTP 서버 중에서도 리소스 파일을 반환하는 서버를 의미한다.
- 서버가 해당 HTMl 파일에 아무 작업도 하지 않고, 파일을 있는 그대로 반환한다.

- 서버를 설치 및 설정하고, 원하는 리소스를 경로에 지정하는 것 말고는 개발자가 따로 할 일이 없다.
- 이런 서버로는 아파치나 Nginx 등이 존재한다.

동적 웹 서버, Dynamic Web Server
- 정적 웹 서버처럼 파일을 있는 그대로 출력하지 않는다.
- 요청을 처리한 후, 처리한 결과에 따라 응답 바디를 재구성하거나 HTML 템플릿 파일에 결과를 대체해 보낸다.
- 어떤 클라이언트가 요청하든 같은 으으답을 반환하는 정적 웹 서버와 달리, 동적 웹 서버는 클라이언트가 누군지, 어떤 매개변수를 보내는 지에 따라 같은 요청이라도 다른 응답을 받을 수 있다.

- 자바 프로그램 중에서 동적 웹 서버 구현을 도와주는 프로그램이 있다. 이는 바로 서블릿 엔진이다. ex) 아파치 톰캣

 

자바 서블릿 컨테이너/엔진

• 서블릿 엔진이 이해할 수 있는 클래스란, Javax.servlet.httpHttpServlet의 상속받는 서브 클래스를 의미한다.
• 서블릿이 어떠한 역할을 수행하는 정의서라면, 서블릿 컨테이너는 그 정의서를 수행한다고 볼 수 있음

 

참고자료

https://a-toz.tistory.com/15

CLI(Command Line Interface)란?

 

https://imyena.tistory.com/61

[스프링] 서블릿, 서블릿 컨테이너, JSP