태그: JavaScript

Apollo Client로 React 앱 개발하기

Apollo Client는 GrpahQL API를 호출하기 위해 사용되는 라이브러리입니다.이번 포스트에서는 React 앱에서 Apollo Client를 사용하여 GraphQL API를 호출하는 방법에 대해서 알아보겠습니다. 사실, GraphQL API를 호출할 때, 반드시 Apollo Client와 같은 전용 클라이언트가 필요한 것은 아닙니다.GraphQL

GraphQL 서버 테스트 방법 (Apollo Server Testing)

GraphQL 서버를 개발할 때도 여느 Rest API 서버와 마찬가지로 테스트의 중요성의 아무리 강조해도 지나치지 않습니다.이번 포스트에서는 Apollo Server로 개발된 GraphQL 서버에 대한 테스트를 작성하는 방법에 대해서 알아보도록 하겠습니다. 기존에 Apollo Server를 이용해서 GraphQL 서버를 개발하신 적이 없으신 분들은 관련

Jest Mock: jest.fn(), jest.spyOn()

자바스크립트 테스트 테스팅 프레임워트로 Jest를 사용할 때 장점 중에 하나는 다른 라이브러리 설치 없이 바로 mock 기능을 지원한다는 점입니다.여기서 mock을 한국어로 뭐라고 번역해야 모르겠는데, 주변에서 보면 “모킹하다”, “뫀객체” 등으로 영어를 차용해서 쓰고 있는 것 같습니다. mocking 이란?먼저 mocking이 생소하신 분들을 위해서 mo

Apollo Server를 이용한 초간단 GraphQL 서버 개발

이번 포스트에서는 Apollo Server를 이용하여 매우 간단하게 GraphQL 서버를 개발해보도록 하겠습니다.기존에 GraphQL 서버를 한 번도 개발해보신 적이 없으신 분들께 도움이 되었으면 합니다. 프로젝트 생성원하는 디렉토리(ex. my-server)에 index.js 파일을 생성합니다.그리고 NPN 초기화 명령어를 실행하면 package.json

Jest로 테스트 전/후 처리하기

테스트를 작성하다보면 모든 테스트 함수에서 공통적으로 필요한 공통 로직이 필요할 때가 있습니다.이번 포스트에서는 Jest를 이용해서 이렇게 테스트 전이나 후에 실행되야 하는 코드를 작성하는 방법에 대해서 알아보겠습니다. 테스트 대상 코드데이터베이스에 접근하는 코드에 대한 테스트를 작성한다는 가정 하에, 다음과 같이 간단한 예제 코드를 작성해보겠습니다. /

Jest로 비동기 코드 테스트 작성하기

지난 포스트에서 Jest로 기본적인 테스트 코드 작성하는 방법에 대해서 알아보았습니다.자바스크립트 언어 특상 상 실제 프로젝트에서는 비동기(Asynchronus)로 돌아가는 코드를 테스트해야 할 일이 많은데요.Jest Runner가 비동기 코드에 대한 테스트라는 사실을 인지할 수 있도록 테스트를 작성해주지 않으면 예상치 못했던 테스트 결과에 당황할 수가 있

Jest로 기본적인 테스트 작성하기

Jest는 페이스북에서 만들어서 React와 더불어 많은 자바스크립트 개발자들로 부터 좋은 반응을 얻고 있는 테스팅 라이브러리입니다.출시 초기에는 프론트앤드에서 주로 쓰였지만 최근에는 백앤드에서도 기존의 자바스크립트 테스팅 라이브러리를 대체하고 있습니다. Jest: All-in-one 테스팅 라이브러리페이스북에서는 Jest를 단순한 테스팅 라이브러리가 아닌

[자바스크립트] 비동기 처리 3부 - async/await

이전 두 개의 포스트를 통해서 기존에 자바스크립트로 어떻게 비동기 처리 코드를 작성해왔는지에 대해서 살펴보았습니다.이번 포스트에서는 좀 더 개선된 방식으로 비동기 처리를 할 수있도록 도와주는 async/await에 대해서 알아보도록 하겠습니다.async/await를 제대로 시용하려면 Callback과 Promise에 대한 이해가 무엇보다 중요하오니 아래 포

[자바스크립트] 비동기 처리 2부 - Promise

많은 분들이 자바스크립트 공부를 하시다가 프라미스(Promise)에 때문에 그만 두시곤 합니다.이번 포스트에서는 자바스크립트에서 비동기 처리를 위해 굉범위하게 사용되는 Promise에 대해서 알아보겠습니다. 콜백 함수를 통한 비동기 처리의 문제점ES6에서 Promise가 도입되어 지금처럼 널리 사용되기 이전에는 주로 콜백 함수를 다른 함수의 인자로 넘겨서

[자바스크립트] 비동기 처리 1부 - Callback

자바스크립트의 콜백 함수와 비동기 함수애 대해서 혼란스러워 하시는 분들이 주변에 많은 것 같아서 개념 정리를 해보고자 합니다.이번 포스트에서는 실제 프로젝트에서 자주 접할 수 있는 유저 데이터 조회 시나리오를 통해 콜백 함수를 이용한 비동기 처리에 대해서 알아보겠습니다. 콜백 함수유저 ID를 인자로 받아 DB나 API 연동 없이 임의의 유저 객체를 리턴하는