Haeguri Devlog

Jest에서 Mock을 정리하는 방법

소개 테스트에서는 Mock을 테스트 대역(Test Double)으로 부른다. 테스트 대역 은 구현 코드를 테스트하는데 필요한 것(객체, 함수, 데이터 등)들을 테스트를 실행하는 동안 대신하는 요소들을 말한다. 테스트 대역이 구현 코드를 잠깐 대…

최근 들어서 정해진 프로세스를 따르기만하는 것이 아닌가 하는 생각이 들었다. 회사의 프로세스를 따르는 것도 중요하지만 어디든 개선해야 할 부분이 있기 마련이다. 그런데 나는 어떻게 개선해야 할지에 대한 아이디어가 잘 떠오르지 않았다. 익스트림 프로그…

자바스크립트의 네이티브 타이머 함수들은 실제 시간에 의존하기 때문에 테스트 환경에는 적합하지 않다. 예를 들어 n분 뒤에 실행되는 로직에 대한 테스트 결과를 실제로 n분이 지난 후에 알 수 있다면 테스트 실행 시간이 너무 길어질 것이다. 테스트 환경…

프로젝트가 끝나거나 새로운 프로젝트가 시작하기 전에는 "다음에는 꼭 테스트 코드를 작성하겠다"라고 다짐하지만 마음대로 되지 않았다. 가장 많이 했던 핑계는 "시간이 부족해서"였던 것 같다. 사실은 시간이 있었어도 어떻게 하면 테스트 코드를 잘 작성할…

Hooks를 공부하기 위해서 공식 문서를 읽으면서 개인적으로 정리한 내용입니다. 정리하는 과정에서 내용이 생략되거나 추가된 내용이 있을 수 있습니다. 리액트 Hooks는 16.8.0에서 새로 도입된 기능입니다. 기존에는 함수형 컴포넌트에서 상태를 관…

타입스크립트의 데코레이터를 사용하면 클래스, 프로퍼티, 메서드 등에 이전에는 제공하지 않던 방법으로 새로운 기능을 추가할 수 있습니다. 사실 데코레이터라는 문법은 이미 자바스크립트 표준으로써 논의되고 있는 단계이며 현재는 초안 단계에 있습니다. 자바…

1. 소개 Gulp는 Node.js 기반의 프로세스 자동화 도구이며 MIT 라이센스의 오픈소스 프로젝트입니다. 회사 일을 하면서 스크립트를 난독화하거나 파일을 복사하는 등의 작업이 반복될 때가 많았는데, Gulp는 이런 반복되는 작업들을 자동화하기 …

다른 프로그래밍 언어에서 this 는 일반적으로 생성자나 메서드에서 자기 자신의 인스턴스를 가리키기 위한 목적으로 사용된다. 하지만 자바스크립트의 this 는 메서드는 물론이고 일반 함수에서 사용될 수도 있다. 그리고 특정 메서드를 사용하면 t…

소개 브라우저는 동일 출처 정책(Single Origin Policy, SOP)에 의해 스크립트 단에서 다른 도메인의 서버로 HTTP 요청을 하는 것이 제한된다. 예를 들면 브라우저를 통해 "naver.com"이라는 URL의 웹 페이지에서 XMLH…

소개 브라우저는 HTML 문서의 엘리먼트들을 화면에 그리기 위해 각 엘리먼트를 박스(box)로 표현한다. 이 때 모든 HTML 엘리먼트를 둘러싸고 있는 사각형 박스를 CSS 박스 모델(CSS Box Model) 이라고 한다. CSS 2.1 스펙 …

개인 프로젝트 를 개발하면서 서버가 필요하게 되었는데 자바스크립트를 더 공부해보고 싶어서 서버를 Node.js, Express를 사용하여 개발하고 있다. 지금 작성된 모든 서버 API는 Express를 통해서 JSON 응답을 하도록 구현되어 있다. …

리액트 문서의 "Refs and the DOM"을 번역한 자료 원문 : https://reactjs.org/docs/refs-and-the-dom.html Ref는 DOM 노드 혹은 render 메서드로 생성된 리액트 엘리먼트에 접근할 수 있…