💾 2025/웹 기본지식

🤔 쓰읍..그 API는 Restful 하지 않은데? 🤬 규칙 다 지켰구만. Restful API가 대체 뭔데? REpresentation State Transfer? 어디서 만든 표준인데? 🤔 그걸 묻는 것 자체가 Rest 하지 않네. 🤬 $#*%*#&% 🚩 인터넷의 역사 💭 인터넷은 언제 나온건가요? - 세계 2차 대전이후 1960년, 미국 국방부는 기존 중앙에만 집중된 통신 체계를 개선하고자 한다. - 미국 국방부는 중앙이 없더라도 통신이 가능한 전국적인 네트워크 인프라, 아파넷을 구성하기 시작했다. - 1973년 TCP/IP 도입, 모든 컴퓨터를 한 통신망에 연결(International Network)한다는 의미로 Internet 이라 부르기 시작. - 이 때 당시 인터넷은 군대, 대형기업, 기관..

# 네트워크는 Layerd Architecture로 구성되어 있다. 네트워크는 결국 전기신호를 다른 장치, 컴퓨터로 보내는 작업이다. 어플리케이션에서 문제,, 네트워크를 찾는 과정에서 문제, 전기 신호의 문제가 하나로 통합되어 있다면 유지보수, 개발이 상당히 복잡하고 어려워진다. 또한 문제가 터졌을 때 트러블슈팅을 하기도 힘들다. PC방에서 게임을 하는데 연결이 끊겼다. 어떻게 확인해야 할까? - 모든 PC에서 문제가 있다면 네트워크 라우터(3-Network Layer) 또는 네트워크 회선(1-Physical Layer)의 문제. - PC의 특정 게임에만 문제가 있다면 (7-Application Layer)의 문제일 가능성이 높다. 그래서 우리가 사용하는 네트워크는 OSI 7 계층구조로 이루어져있다. T..

로그인/로그아웃처럼 상태정보를 유지하기위해 쿠키를 사용한다. 쿠키에 사용자 정보를 넣는다면 중간에 가로채서(intercept) 정보가 탈취/유출될 수 있다. 쿠키를 암호화한다 한들, 암호화된 쿠키를 한번 탈취당하면 평생 재사용 가능하다. 그래서 웹 서버에 'Session 저장소'를 따로 만들어 사용하는게 일반적이다. 그리고 그 이후에 나온 방식인 JWT 토큰에 대해서도 알아보자. 참고로 데이터 관점에서 보는 물리적인 의미는 다음과 같다. Cookie : 브라우저에서 응답요청에 포함하여 보내는 데이터 Storage : 브라우저에서 사용하는 데이터. 쿠키처럼 자동으로 응답에 포함하지 않는다. Session : 서버가 가지고 있는 저장소, 유효기간이 없는 Session Cookie를 함께 활용 Token : ..

HTTP 헤더에는 StartLine 정보 (HTTP 버전, URI, 상태코드)를 제외한 모든 정보를 넣는다. Key-Value 구조를 가지며 하나의 Key에 여러개의 값을 할당할 수 있다. 물론 이렇게 사용하는 경우는 거의 없지만. # 1999년 - HTTP 표준 RFC2612 헤더의 종류를 구분하고 순서대로 작성했었다. # 2014년 - 표준 RFC7230~5 [Entity헤더와 Body메시지]를 [Representation헤더와 Payload메시지]로 바꾸고 HTTP 스펙을 크게 개정하였다. 이제 Request, Response의 구분이 없다. 표현 헤더는 전송 데이터를 해석할 수 있는 정보를 제공해주며 [Request Response]에 둘 다 사용한다. ➡ Contet-length처럼 해석 정보가..

# HTTP의 상태코드 HTTP 응답 메시지 첫 줄(Start-Line) 헤더에는 상태코드가 포함되어 있다. HTTP 코드를 추가해서 사용하더라도 앞자리 (2XX, 4XX)는 바뀌지 않으므로, 만약 클라이언트에서 응답코드를 정확하게 모르더라도 추가적인 행동이 필요한건지 확인할 수 있다. 다만 모든 HTTP 상태코드를 사용하는 건 아니다. 무작정 코드를 많이 사용해봐야 클라이언트에서 처리하기도 힘들고 굳이 그렇게 할 이유도 없기 때문이다. ✔ 실제 서비스에서 사용할만한 코드만 빠르게 알아보도록 하자. 없는 번호는 안쓴다고 생각하면 된다. # 성공 2XX 성공은 현업에서 200만 사용하는 경우도 많다. 그 외에는 201, 204 정도만 자주 사용하는 편이다. [200 OK] 성공을 의미한다. 응답을 반환받으..

# Request (클라이언트 ➡ 서버) URI 에 쿼리 파라미터를 통한 데이터 전송 ➡ ✔GET HTTP Form을 이용하여 데이터 전송 ➡ ✔POST 직접 Body에 데이터를 넣어 전송 ➡ ✔POST, PUT, PACTH 참고로 웹 브라우저에서는 메서드 지정이 없다면 기본값을 GET으로 사용한다. 그래서 웹 브라우저에서 GET요청은 URI 입력으로 바로 가능하지만 POST PUT등은 코드 작성하거나 추가적인 도구를 이용해야 한다. (Postman) @ GET - 정적, 동적데이터 조회 GET을 사용한다. 정적인 데이터는 경로만 지정하면 되니 파라미터가 필요없다. 요청 메시지가 필요한 동적인 데이터는 URI (=Header)에 쿼리 파라미터를 넣어 요청한다. @ HTML Form을 이용한 전송 HTML..

# HTTP URI를 이용하여 데이터를 받아와보자 단순하게 생각하면 아래와 같이 만들 수 있다. 이것이 과연 좋은 URI 설계일까? # Resource의 의미를 담아야한다. URI는 리소스를 대표하는 식별자 (Uniform Resource Identifier)이다. 우리가 필요한 건 Member라는 리소스이다. 위와 같이 설계하면 update, read, delete에 따라 같은 리소스를 조회하는데 다른 URI를 사용해야한다. 이는 사용하는데에도, API 서버를 개발하는데에도 설계하기 어려워진다. 하지만 모든 요청을 [/member] 라고만 전달하게 된다면, 어떻게 의미를 구분해서 전달할 수 있을까? ➡ HTTP 메서드를 사용하자. 리소스와 행위를 분리하자. # HTTP 메서드의 종류 우리는 앞의 글에서..

Hypertext Transfer Protocol, 하이퍼 텍스트 문서(HTML)을 전송하는 통신 규약 웹 브라우저는 HTTP 스펙(표준 인터페이스)를 기준으로 만든 클라이언트 프로그램이다. 즉, 웹 브라우저가 아니더라도 HTTP 스펙을 이용하면 다른 곳과 통신도 가능하다. # HTTP의 시대 인터넷의 반응속도가 정말 중요한 일부 서버(ex 온라인 PC게임)를 제외하고는 현대의 대부분의 서비스는 HTTP를 이용해 네트워크 통신을 한다. 웹에 사용되는 [HTML, 이미지, 영상]은 기본이고 [Json, XML] 같은 데이터를 네트워크에 전송하고, 여러 서버간에 통신을 할 때도 HTTP 를 사용한다. HTTP의 역사 HTTP는 비연결성, 무상태성, 클라이언트-서버 구조를 가진다. 이를 하나씩 알아보자. # ..

# URI? URL? URN? 웹상에서 자원의 정보를 나타내는 문자라는 의미로 Uniform Resource Identifier 라고 이름짓고 URI라고 부른다. URI를 만드는 방법에는 리소스의 위치를 사용하는 방법(Resource Locator, URI)과 리소스의 고유 이름을 사용하는 방법 (Resource Name, URN)이 있다. 하지만 웹 환경에서 '고유한 이름'을 사용해서 자원을 구분하기에는 여러가지 문제점이 있기에, 사용하려고 시도는 했었지만 현대의 웹에서는 대부분 URL만 사용한다. 그래서 개발할 때는 URL과 URI를 거의 동의어로 사용한다. 참고로 도서명을 전세계 공통의 고유한 이름으로 나타내는 ISBN이 URN과 비슷한 방식이라고 생각하면 된다. # URL의 구조 참고로 프로토콜과..

# 네트워크, 미국과 한국을 어떻게 연결했을까? 개발하면서 여기까지는 몰라도 되긴하지만, 궁금하다면 아래 링크를 읽어보자. 2021.01.04 - [기본 지식/웹 기본지식] - 네트워크의 동작원리 1. 인터넷의 동작원리 웹사이트의 동작 원리를 이해하기 전, 인터넷이 어떻게 네트워크를 구성하는지 간단하게 알아보고자 한다. 1. Web 참고로 웹은 World Wide Web을 줄여 부르는 것으로 1989년 팀 버너스리가 연구원간 자 jiwondev.tistory.com # 기초지식 만약 두 컴퓨터, 클라이언트와 서버가 선으로 직접 연결되어있다면 인터넷이라는 개념은 필요없을 것이다. 실제로 네트워크가 보급되지않았던 옛날에는 한 건물 내의 서버 컴퓨터와 클라이언트 컴퓨터를 선으로 연결했었다. # 1. 프로토콜 ..

개요 웹 개발을 크게 나누면, 보통 Front-End 와 Back-End 로 나누어지게 됩니다. 이를 알아봅시다. 웹 프론트엔드 사용자에게 웹을 통해 다양한 데이터(문서, 동영상, 사진)를 보기좋게 만들어 제공한다. 사용자의 동작에 따라 반응하며, 실질적으로 눈에 보이는 부분이라고 생각하면 된다. 웹 프론트엔드가 하는일 웹 컨텐츠를 어떻게 보여줄 것인지 기본적인 구조를 작성합니다 - HTML 적절한 배치와 디자인을 제공합니다. - CSS 사용자의 요청을 읽고 반응하여 원하는 모양으로 바꾸어줍니다. - Javascript * Javascript는 Java와 아무련 관련이 없다. 자바의 인기의 편승할려고 비슷하게 이름을 지은건데, 상표권이 문제가 되어 공식 표준이름은 ECMA Script으로 바꾸었지만, 아..

웹사이트의 동작 원리를 이해하기 전, 인터넷이 어떻게 네트워크를 구성하는지 간단하게 알아보고자 한다. 1. Web 참고로 웹은 World Wide Web을 줄여 부르는 것으로 1989년 팀 버너스리가 연구원간 자료를 주고받을 때 편하게 사용하려고 개발한 HTML과 함께 만든 데이터 공유시스템에서 시작되었다. 2. Internet - 미국 군방부 네트워크 (아파넷)을 구성하기 위해 만든 것이 인터넷의 시초이다. - 인터넷이라는 이름은 1973년 TCP/IP를 도입하면서 모든 컴퓨터를 하나의 통신망에 연결(International Network)하는 프로젝트라는 의미로 internet이라고 부르기 시작했다. 2-1 네트워크로 데이터를 주고 받는 방법 우리가 데이터를 주고받는 가장 쉬운방법은, 그냥 컴퓨터와 ..