전체 글 (20) 썸네일형 리스트형 Gatsby로 블로그 만들기 Gatsby? Gatsby는 React 기반의 Static Site Generation(SSG) 툴이다. SSG는 간단히 말해 빌드 타임에 각 페이지마다 필요한 리소스(주로 html과 json파일 형태)를 미리 생성하고, 요청이 있을 때 정적(static)으로 제공하는 방식이다. 그래서 개인 블로그처럼 동적인 API 호출이 굳이 필요하지 않고, 복잡한 상태관리가 요구되지 않는 사이트에 적합하다. 그리고 HTML을 만들어두기 때문에 SEO 친화적이라는 것도 장점이다. Gatsby Starter Blog Gatsby는 React의 create-react-app 같은 몇 가지 스타터 프로젝트를 제공하는데, gatsby-starter-blog도 그 중 하나다. 블로그를 만드는데 필요한 최소한(정말 최소다..)의.. HTTP 세션과 쿠키 HTTP HTTP는 stateless 하다. HTTP를 기반으로 통신하는 서버는 기본적으로 클라이언트에 대해 어떤 상태 정보도 유지하지 않는다는 뜻이다. 어떤 요청이 들어왔을 때 해당 클라이언트가 이전에 요청을 보냈던 클라이언트인지, 몇 번째로 요청을 보내고 있는 것인지 등을 알 수 없다. 그렇기 때문에 클라이언트의 인증 상태(로그인한 사용자인지 여부 등)를 판단하려면 추가적인 조치가 필요하다. 여기서 등장하는 것이 쿠키와 세션이다. 쿠키 아래는 IETF RFC와 MDN을 참고 및 요약, 정리한 내용이다. 보다 상세한 설명을 보려면 링크를 참고하면 될 것 같다. 개념 쿠키란 간단히 말해 '작은 데이터 조각'이다. 서버가 클라이언트에게 응답을 보낼 때 '쿠키를 설정하겠다'는 의미의 HTTP 헤더 필드와 값.. JavaScript 클로저 자바스크립트에서 Closure가 무엇인지 정리를 해보려고 한다. Closure가 워낙 다양한 방식으로 설명되다보니 필요 이상으로 어렵게 느껴지는 면이 있는 것 같아서 내가 이해한대로 설명을 적어보는게 도움이 될 것 같다. 정의 MDN의 설명에 따르면 클로저는 어떤 함수와 그 함수가 레퍼런스를 가진 lexical 환경의 합을 의미한다. A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). 어떤 코드가 실행될 때 상위 스코프의 변수들이 사용될 수 있고 이와 관련된 개념으로 Lexical Scope, Scope Cha.. JavaScript 실행 컨텍스트와 관련 개념들 Execution Context는 자바스크립트 코드가 어떻게 실행되는지를 이해하는 데 가장 기본이 되는 개념이다. 그리고 Scope, Hoisting, this, Closure 등 자바스크립트의 중요한 특성으로 꼽히는 것들과 밀접한 관련이 있다. 이미 좋은 자료들이 많이 있지만 한번쯤 스스로 정리를 해야겠다는 생각이 들어 포스트를 작성하게 되었다. 정의 Execution Context(EC)는 자바스크립트 코드가 실행되는 환경을 의미하는 추상적인 개념이다. 여기서 환경은 실행되고 있는 코드가 사용할 수 있는 변수들, this의 값 등을 말한다. EC는 크게 전역(Global), 함수 호출(Function Call), eval 함수 내 이렇게 세 가지 경우에 생성된다. 보통 eval 함수를 사용할 일은 별.. 이전 1 2 3 다음