기묘한 개발 이야기

개요 프로젝트 하던 중 HTTP Status code를 다루게 되어 정리 겸 찾아보게 되었다. https://developer.mozilla.org/en-US/docs/Web/HTTP/Status 내용 HTTP Response Status Code 란? 클라이언트가 서버에게 요청을 보낼 때 그 요청의 결과가 어떻게 되었는지를 알려주는 숫자로 된 코드이다. 총 5가지의 종류로 그룹화 되어있다. 정보 응답 (1xx) 성공적인 응답 (2xx) 리다이렉션 메시지 (3xx) 클라이언트 오류 응답 (4xx) 서버 오류 응답 (5xx) 정보 응답 (1xx) 요청을 받았으며 계속 작업을 할 때 사용하는 코드 100 - Continue (계속) 클라이언트가 요청을 계속하거나 요청이 이미 완료되어 응답을 무시해야하는 경우..

개요 서버사이드 렌더링과 클라이언트 사이드 렌더링이 무엇인지 알아보고 각 장단점을 알아보기 위해 아래 링크의 글을 정리하였다. https://ferie.medium.com/what-is-the-server-side-rendering-and-how-it-works-f1d4bf9322c6 What is the Server-Side Rendering and how it works Server-side rendering (SSR) is a technique for rendering web content on the server-side, i.e., before the page is sent to the client. ferie.medium.com https://ferie.medium.com/what-is-the..

1. 찾는데 시간이 걸린다. 2. 귀찮다 3. 귀찮다. 4. 귀찮다. 5. 귀찮다.

개요 자바스크립트가 왜 단일 쓰레드를 선택했는지, 그리고 그 이유가 무엇인지 찾아보다가 알게 된 글을 정리하게 되었다. https://www.geeksforgeeks.org/why-javascript-is-a-single-thread-language-that-can-be-non-blocking/ https://www.freecodecamp.org/news/javascript-under-the-hood-v8/ https://www.geeksforgeeks.org/applications-advantages-and-disadvantages-of-stack/ How JavaScript Works: Under the Hood of the V8 Engine Today we’ll look under the hood ..

개요 브라우저에서 웹 페이지를 렌더링 하는 과정을 알아보기 위해 해당 글을 읽고 정리한다. https://javascript.plainenglish.io/web-performance-understanding-critical-rendering-path-72283caefc1f 내용 브라우저 렌더링이란? 화면에 웹 페이지를 렌더링 하기 위해 브라우저에서 수행하는 작업 또는 단계의 시퀀스. 1. 로더(Loader)가 서버에서 리소스(HTTP, CSS, JavaScirpt) 스트림을 읽음. 2. 수신된 HTML을 파싱하여 DOM생성 3. CSS 파싱하여 CSSOM 생성 4. DOM과 CSSOM이 결합된 Render Tree 생성 - 모든 요소의 위치 및 치수(레이아웃) 계산 포함 5. 화면에 실제 픽셀을 페인팅 ..

개요 HTTP와 HTTPS의 차이점을 잘 모르겠어서 찾아보았다. https://www.freecodecamp.org/news/http-vs-https/ 해당 블로그를 읽고 정리하였고, 일부 필요한 이미지는 구글 검색으로 추가한다. HTTP vs HTTPS – What's the Difference? We interact with HTTP and HTTPS a lot in our day-to-day lives, but many people don't know the difference. Most computer users just see that the browser is telling them their application is not safe and that a hacker might want to ..

개요 현업에서도 많이 들었으나 잘 이해가 가지 않았던 CORS 가 뭔지 공부하고 해당 링크의 내용을 정리한다. https://ko.javascript.info/fetch-crossorigin#ref-400 CORS ko.javascript.info 내용 cors 란? - 브라우저에서 실행중인 스크립트에서 시작되는 cross-origin Http 요청을 제한하는 브라우저 보안 기능. - 제한한 cross-origin HTTP 요청을 하기 위해 서버의 동의가 필요함. - 동의시 브라우저에서는 요청 허용, 동의하지 않는 경우엔 브라우저에서 거절하는 메커니즘은 HTTP-header를 이용하는데 이것이 바로 CORS Cross-origin이란? 아래 3가지 중 하나라도 다른 경우를 지칭함. 1. 프로토콜 2. 도..

개요 이전 스터디를 듣다가 왠지 자바와 자바스크립트의 메모리가 비슷한 것 같다는 생각이 들었고, 왜 힙 영역에 변수를 저장하는지가 궁금해짐. 참고한 블로그 정리하는 내용. 내용 대부분의 메모리 생명 주기는 비슷하다. 메모리 할당 OS가 생성한 객체에 필요한 메모리를 자동으로 할당한다. 객체는 메모리 관리의 맥락에서 Object 뿐만 아니라 함수와 함수의 스코프까지 포함하는 개념이다. 저수준 언어의 개발자는 명시적 처리가 필요하다. 고수준 언어는 개발자가 신경 쓸 필요가 없는 부분이다. 메모리 사용 할당된 메모리를 프로그램이 사용하는 단계. 개발자가 코드에서 명시적으로 수행하여 이루워지는 작업. 메모리를 읽고 쓰는 작업은 곧 변수에서 읽거나 변수에 쓰는 작업을 의미함. 함수에 인수를 넘겨줄 때도 일어남. ..

개요 자바스크립트를 통하여 브라우저를 제어하기 위해 객체를 다루는 방법에 대해 정리한다. 내용 객체화를 어떻게 할까? -> document.get 메서드를 통해 찾아낸 객체에 값을 추가하여 동적으로 변경하게 하는것이 객체화이다. 어떻게 객체를 통해 브라우저를 제어할까? 1. 브라우저에서 이미 웹페이지를 읽는 과정에서 각각의 태그들마다 미리 객체를 만든다. 2. 이미 만들어진 태그에 해당되는 객체를 찾는다. 3. 찾은 객체를 대상으로 어떠한 메서드나 프로퍼티 값을 가져온다거나 하는 것을 통하여 객체 제어를 한다. (객체 제어 = 객체가 가르키는 태그 제어) window 객체의 2가지 의미 1. 전역객체 2. window.frames 와 같은 메서드를 제어하기 위한 객체 전역변수를 생성하고, 어떤 객체에 소..

자꾸 잊어버려서 기록용으로 작성. 추가로 사용하는 명령어가 있을 경우 글 업데이트 합니다. 명령어 설명 기타 ./h2.sh h2 실행 폴더 h2/bin 에 접근 후 명령어 사용해야함.