카테고리: JavaScript

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 연동 없이 임의의 유저 객체를 리턴하는

Vue CLI 3 사용법

2018년 8월 10일 Vue CLI 3가 정식 릴리즈되었습니다. Github 릴리즈 페이지: https://github.com/vuejs/vue-cli/releases Evan You의 포스트: https://medium.com/the-vue-point/vue-cli-3-0-is-here-c42bebe28fbb Vue CLI는 React의 creat

GraphQL API 간단하게 호출하기

GraphQL API를 별다른 라이브러리 없이 최대한 간단하게 호출하는 방법에 대해서 알아보겠습니다. 아래에 소개된 방법들로 GraphQL API 호출하는 방법에 대한 감을 잡는데 도움이 되셨으면 좋겠습니다. 내장 Web UI많은 GraphQL 서비스는 GraphiQL이나 Playground와 같은 내장 UI를 제공합니다. 예를 들어, 가짜 데이터를 응답해

웹팩(Webpack) 개발 편의 기능

웹팩은 자바스크립트 개발자들이 좀 더 쾌적한 개발 경험을 할 수 있도록 여러가지 개발 편의 기능을 제공합니다. 이번 포스트에서는 웹팩을 사용하면서 개발 편의성을 개선시킬 수 방법에 대해서 알아보겠습니다. 관련 포스트웹팩에 대한 지식이나 경험이 전혀 없으신 분들을 아래 포스트를 먼저 읽어보시면 따라오시기가 좀 더 수월하실 겁니다. 웹팩(Webpack) 기본