Earn this, Earn it.

OSI 7계층 중 다른 계층에 대한 포스팅은 아래 링크를 참고해주세요! :) 물리, 데이터 링크 계층 : https://hanastro.tistory.com/51 네트워크 계층 : https://hanastro.tistory.com/45 전송 계층 : https://hanastro.tistory.com/54 OSI 7계층이란 무엇일까요? 네트워크에서 통신이 일어나는 과정을 7단계로 나눈 것을 말하며, ISO라는 국제표준화기구에서 OIS 모델이라는 표준 규격을 제정했습니다. 7계층을 나눈 이유? 통신이 일어나는 과정을 단계별로 파악하기 위함입니다. 만약 7계층 중 특정 계층(레이어 라고도 함)에서 이상이 생기면 그 특정 계층에서만 이상 현상을 수정하면 됩니다. 따라서 문제를 파악하기 쉽죠. OSI 7계층과..

코딩을 하다보면 인코딩 관련해서 UTF-8 이란 말을 많이 들어봤을 것입니다. 저도 평소 많이 보았지만 그 의미에 대해 한 번도 생각해 본 적이 없어서 이번 기회에 공부하였습니다. UTF-8 ? 이는 유니코드(Unicode)를 위한 가변 길이 문자 인코딩 방식이라고 위키백과에 나와있습니다. (Universal Coded Character Set + Transformation Format – 8-bit 의 약자) 여기서 유니코드란? 전 세계 모든 문자를 컴퓨터에서 일관되게 표현하기 위한 산업 표준으로서 유니코드 협회에서 제정한다고 하네요. 기원에 대해 살펴보면 초기에 ASCII 코드로 문자를 주고 받을 때, 1바이트로는 표현에 한계가 있어서 2~4바이트로 세상의 모든 문자를 할당하였던 것이 유니코드인데요...

오늘은 AJAX에 대해 알아보겠습니다. AJAX (Asynchronous Javascript And XML) 직역하면 비동기 자바스크립트와 XML 자바스크립트를 통해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기법 또는 방식을 의미합니다. 자바스크립트에서는 axios, fetch 함수를 생각하면 쉽습니다. Javascript를 이용해서 XML(또는 JSON, text 기타 등등)을 비동기 통신하면 그게 AJAX라고 볼 수 있습니다. 자 그럼 단어 하나하나의 의미를 먼저 알아봅시다. 비동기 (Asynchronous, 동시에 일어나지 않는) 비동기는 요청과 결과가 동시에 일어나지 않을 것이라는 약속입니다. 이러한 방식은 페이지 리로드가 일어나지 않고 데이터를 불러올 수 있으며, AJAX..

오늘은 HTTPS에 대해서 알아보겠습니다. HTTP란? HTTPS란 (HyperText Transfer Protocol over Secure Socket Layer)의 약자로, HTTP위에 SSL의 보안 프로토콜이 추가된 형태를 말합니다. HTTP에는 어떤 약점이 있기에 HTTPS가 나오게 되었을까요? 암호화되지 않은 통신이기 때문에 패킷을 수집하는 도청에 취약하다 통신 상대를 확인하지 않으므로 위장 가능하다 정보의 정확성(발신된 데이터와 수신된 데이터가 같은지)을 증명할 수 없기 때문에 변조 가능하다. SSL이란? 그렇다면 HTTPS는 이 약점을 어떻게 해결하였을까요? HTTPS는 직접 TCP와 통신하지 않고 SSL을 거쳐 TCP와 통신하게 됩니다. HTTPS 통신 과정을 알아보기 전에 SSL에 대해 ..

오늘은 클라이언트 최적화에 대해서 아는 것을 제외하고 모르는 것 위주로 찾아보면서 습득한 내용을 바탕으로 기록할 것입니다. 따라서 최적화에 대한 전반적인 내용을 담고 있지 않음을 알립니다. defer/ async 평소 맨날 헷갈리는 둘의 사용법에 대해서 알아봤습니다. 아래 그림이 매우 잘 나타낸 것 같아서 그림으로 대체합니다. 공통점 - 스크립트를 다운로드 하는 동안 HTML 파싱이 중단되지 않는다 차이점 - async는 스크립트 다운로드 후 곧바로 실행하고 -defer는 스크립트 다운로드 후 HTML 파싱이 다 끝난 후에 실행한다. SSR과 CSR에 대해 이것 또한 그림으로 대체하겠습니다. 다음에는 리액트 훅 중에, useCallback, useMemo, useEffect 리액트 lazy import ..

OSI 7계층 중 다른 계층에 대한 포스팅은 아래 링크를 참고해주세요! :) 물리, 데이터 링크 계층 : https://hanastro.tistory.com/51 네트워크 계층 : https://hanastro.tistory.com/45 전송 계층 : https://hanastro.tistory.com/54 네트워크 계층의 역할과 네트워크간의 연결에 대해 알아보겠습니다! OSI 7계층이란? 네트워크계층의 역할은? 네트워크 간의 통신을 가능하게 하는 것을 말합니다. 추가로 서로 다른 네트워크 간에 데이터를 전송하려면 라우터가 필요합니다. 라우터란? 간단한 기능만 알아보면, 데이터의 목적지가 정해지면 해당 목적지까지 어떤 경로로 가는 것이 좋은지 알려주는 기능을 합니다. 여기서 필요한게 바로 IP주소인데요 ..

프로젝트에 대해선 Github Link 에서 확인해볼 수 있습니다. :) 이번 프로젝트에서는 WebRTC라는 최근 핫한 기술을 적용해봄으로써 기술적 도전을 해보기로 했습니다. 제일 처음으로 WebRTC API와 바닐라 JS만을 이용해 구현해봤는데, 서버측 인프라가 충분치 않은 환경에서 Mesh구조로 구현할 수 밖에 없었고, 이와 같은 Mesh 구조는 다중 사용자가 이용하는 저희 프로젝트에서는 적합하지 않다고 판단했습니다. 그래서 저희는 Agora SDK를 이용하기로 하였는데 리액트 관련 예제가 없어서 어려움을 겪었기 때문에 제가 공식문서를 공부하면서 정리한 튜토리얼을 공유해볼까 합니다.😁 최대한 많은 블로그와 공식문서를 참고했으나 요약하는 과정에서 잘못 해석된 내용이 있을 수 있습니다. 잘못된 점이 있으..

데이터베이스를 사용하는 이유 DB가 있기 이전에는 파일 시스템을 이용했다. 이때 각 파일 단위로 저장하였는데 데이터 종속성 문제와 중복성, 무결성 문제가 대두되었다. 데이터베이스의 성능 DB의 성능 이슈는 디스크 I/O를 어떻게 줄이느냐에서 시작된다고 한다. 데이터를 읽는데에 디스크 헤더를 움직여서 읽고 쓸 위치로 옮기는 등의 성능을 통해 결정된다고 볼 수 있다. 때문에 순차 IO가 랜덤 IO보다 빠르다. 하지만 현실에서 대부분의 IO작업은 랜덤IO이다. 이런 랜덤IO를 순차IO로 바꿔서 실행할 수는 없을까? 이런 생각에서부터 시작되는 쿼리 튜닝은 랜덤 IO 자체를 줄여주는 것이 목적이다. 인덱스 인덱스란 무엇인가? 인덱스는 말 그대로 책의 색인이라고 볼 수 있다. 이 비유를 그대로 가져와서 인덱슬르 살..