자바스크립트

Closer의 뜻은 닫는 것, (종료를 알리는 신호가 되는) 행위이다. 본론으로 넘어가보자. 클로저는 함수가 선언될 당시의 환경을 기억했다가 나중에 호출되었을 때 원래의 환경에 따라 수행하는 함수이다. 이름이 클로저인 이유는 함수 선언 시의 스코프를 포섭하여 이후 실행될 때 이용하기 때문이다. 실무에서 클로저를 가장 많이 사용하는 언어는 자바 스크립트이다. 클로저의 장점은 다음과 같다. 1. 데이터 보존 외부 함수의 샐행이 끝나도, 외부 함수 내 변수를 사용할 수 있다. 2. 정보의 접근 제한 '클로저 모듈 패턴'을 사용해 객체에 담아 여러 개의 함수를 리턴하도록 만든다. 3. 모듈화 유리 클로저 함수를 각각의 변수에 할당하면 독립적으로 값을 사용하고 보존할 수 있다. 자바스크립트의 클로저를 예로 들면 ..

노드에서는 기본적인 내장 객체와 내장 모듈을 제공한다. global 브라우저의 window와 같은 전역 객체이며, 모든 파일에서 접근할 수 있다. global 객체 내부에는 매우 많은 속성들이 들어있으며, 내부를 보려면 REPL을 이용해야 한다. $ node > global > globalThis > globalThis === global > global.console 노드 버전에 따라 콘솔 내용이 다를 수 있으며, global 객체 안에는 수십 가지의 속성이 담겨 있다. 그 속성 모두를 알 필요는 없고, 자주 사용하는 속성들만 알아보자. 전역 객체라는 점을 이용해 파일 간에 간단한 데이터를 공유할 때 사용하기도 한다. module.exports = () => global.message; const A ..

노드는 코드를 모듈로 만들 수 있다는 점에서 브라우저의 자바스크립트와는 다르다. 모듈이란 특정한 기능을 하는 함수나 변수들의 집합을 말한다. ex) 수학에 관련된 코드들만 모아서 모듈을 하나 만들 수 있다. 모듈로 만들어두면 여러 프로그램에 해당 모듈을 재사용할 수 있다. CommonJS 모듈은 표준 자바스크립트 모듈은 아니지만 노드 생태계에서 가장 널리 쓰이는 모듈이다. 아래 소스 코드에서 변수를 두 개 선언했고, module.exports에 변수들을 담은 객체를 대입했다. 다른 파일에서 이 파일을 불러오면 module.exports에 대입된 값을 사용할 수 있다. const odd = 'CJS 홀수입니다.'; const even = 'CJS 짝수입니다.'; module.exports = { odd, ..

노드는 V8과 더불어 libuv라는 라이브러리를 사용한다. V8과 libuv는 C와 C++로 구현되어 있으며, 코딩한 자바스크립트 코드는 노드가 알아서 V8과 libuv에 연결해주므로 C와 C++는 몰라도 된다. libuv 라이브러리는 노드의 특성인 이벤트 기반, 논블로킹 I/O 모델을 구현하고 있다. 이벤트 기반 이벤트가 발생할 때 미리 지정해둔 작업을 수행하는 방식을 의미한다. 이벤트로는 클릭이나 네트워크 요청 등이 있을 수 있다. 이벤트 기반 시스템에서는 특정 이벤트가 발생할 때 무엇을 할 지 미리 등록해둬야 한다. 이를 이벤트 리스너에 콜백 함수를 등록한다고 표현한다. ex) 버튼을 클릭할 때 경고창을 띄우도록 설정하는 것을 예로 들어보자. 클릭 이벤트 리스너에 경고창을 띄우는 콜백 함수를 등록해..

웹 애플리케이션에서 라우팅이라는 개념은 사용자가 요청한 URL에 따라 알맞은 페이지를 보여주는 것을 의미한다. 글쓰기 페이지: 새로운 포스트를 작성하는 페이지이다. 포스트 목록 페이지: 블로그에 작성된 여러 포스트의 목록을 보여주는 페이지이다. 포스트 읽기 페이지: 하나의 포스트를 보여주는 페이지이다. 이렇게 여러 페이지로 구성된 웹 애플리케이션을 만들 때 페이지 별로 컴포넌트들을 분리해가면서 프로젝트를 관리하기 위해 필요한 것이 바로 라우팅 시스템이다. 리액트 라우터: 이 라이브러리는 리액트의 라우팅 관련 라이브러리들 중에서 가장 오래됐고, 가장 많이 사용되고 있다. Next.js: 리액트 프로젝트의 프레임워크이다. 앞에서 사용한 Create React App처럼 리액트 프로젝트 설정을 하는 기능, 라..

리액프 프로젝트를 생성하는 사전 준비 작업을 수행하고 나서 첫 리액트 프로젝트를 만들어 볼 것이다. 1-1. Node.js와 npm 리액트 프로젝트를 만들 때는 Node.js를 반드시 먼저 설치해야 한다. https://hyunho1lee.tistory.com/30 Node JS 설치하기 2009년 5월 27일 처음 공개된 Node.js는 오픈 소스 JavaScript 엔진인 크롬 V8에 비동기 이벤트 처리 라이브러리인 libuv를 결합한 플랫폼이다. 다시 말해, JavaScript로 브라우저 밖에서 서버를 구축하는 등 hyunho1lee.tistory.com Node.js를 설치하면 Node.js 패키지 매니저 도구인 npm이 설치된다. npm으로 수많은 개발자가 만든 패키지를 설치하고 설치한 패키지의..