일단, DataLoader가 뭔지 설명하기 전 GraphQL에서 발생할 수 있는 n+1 문제를 이해해야 한다. n+1 문제란? query { posts { id title contents user {...} } } 다음과 같이 posts라는 데이터를 조회하는 쿼리가 있을 때, posts 데이터를 가져오는 쿼리 1개, 그리고 각각의 posts 별로 가지고 있는 user라는 데이터를 가져오는 쿼리가 n개가 필요하며 이를 N + 1 문제라고 한다. 즉, 내부 객체를 얻기 위해 외부 객체에서 N개의 쿼리

글을 쓰는 지금 시점에서 개발 공부를 시작하고 약 1년 반 정도가 지났다. 길다면 길다고 볼 수도 있고, 짧다면 짧다고 볼 수도 있는데, 나름 열심히 노력해서 네이버에 개발자로 취업하게 되었다. 오늘은 그 과정에 대해 간략하게 나의 후기를 적어보려고 한다. 제목이 "부스트캠프부터 네이버 개발자가 되기까지"인 이유는 과정 자체에서 부스트캠프에서 교육받은 기간도 길었고, 네이버에 입사할 수 있었던 핵심적인 역할을 했다고 생각했기 때문이다. (게다가 이 블로그도 부스트캠프에 포트폴리오 하나는 제출하고 싶어서 개발했었다) 부스트캠프

스택(Stack) 스택은 단어 그대로 데이터를 쌓아놓는 자료구조 형태를 뜻한다. 쌓아논 데이터는 아래가 막혀있으니 당연히 위에서 부터 접근할 수 있고, 자연스럽게 처음에 들어온 데이터가 마지막에 나가고 나중에 들어온 데이터가 가장 먼저 나가는 LIFO(Last In First Out) 형식의 자료구조를 가지게 된다. 스택은 스택의 가장 상단에 있는 데이터를 Top, 그리고 상단에 데이터를 추가하는 작업을 Push, Top데이터를 제거하는 작업을 Pop이라고 한다. 스택을 구현하는 방법은 배열을 사용하는 방식과 링크드 리스트

큐(Queue) 큐는 컴퓨터의 기본적인 자료 구조의 한가지로, 먼저 집어 넣은 데이터가 먼저 나오는 FIFO(First In First Out)구조로 데이터를 저장한다. 쉽게 이야기 하면 은행에서 번호표를 뽑을 때 가장 먼저 번호표를 뽑은 사람이 번호표를 늦게 뽑은 사람보다 빠르게 업무를 볼 수 있는 것처럼 생각하면 된다. 큐는 가장 일찍 추가된 데이터를 Front, 마지막에 추가된 데이터를 Rear라고 한다. 그리고 큐에 Enqueue를 통해 데이터를 하나씩 추가를 할 때마다 Rear가 입력된 데이터로 변경이 되고, Dequ

배열이란? 배열은 컴퓨터에서 리스트를 저장하는 데이터 타입 중 하나이다. 아마 따로 자료구조를 공부하지 않았더라도 개발 언어를 사용해봤더라면 알만할만큼, 자주 사용하는 자료 구조이다. 배열은 데이터를 메모리 상에서, 순차적으로 저장하며 메모리를 정적인 크기로 할당받는다. 즉, 배열의 데이터들은 연속적(continuouse)이며 인접(contiguous)해 있어야 한다. 그렇기 때문에 배열은 메모리를 할당받게 되면 데이터에 대한 index를 가지게 되며 이 index를 사용해 배열의 요소를 읽을 수 있다. 앗? 자바스크립트의

링크드리스트란? 연결 리스트, 링크드 리스트라고 하며 각 노드가 데이터와 포인터를 가지며 연결되어 있는 형태의 자료구조를 말한다. 데이터는 말 그대로 노드의 데이터를 가지고 있고, 포인터는 그 다음 순서의 자료가 있는 주소를 가지며 연결되어 있다. 링크드 리스트는 첫 노드의 주소를 가지고 있는 head와 노드의 개수를 표현하는 length가 있다. 종류로는 단순 링크드 리스트, 원형 링크드 리스트, 양방향 링크드 리스트가 있다. 장점 링크드 리스트의 장점은 노드의 삽입이 간단하다. 노드를 생성 후 이전 노드의 링

클라이언트와 서버가 통신할 때 토큰을 사용할 경우 토큰을 탈취당할 우려가 있기 때문에 보통 API에 접근할 때 사용하는 Access Token과 Access Token을 재발급 받는 Refresh Token으로 구성하는 경우가 많다. Access Token은 API에 접근할 때 사용하지만 탈취당할 경우 서버에서 접근을 막기가 어렵기 때문에 토큰의 유효기간을 짧게 두고 Refresh Token을 통해 주기적으로 재발급받으며 인증을 처리한다. 하지만 서비스를 이용하는 도중에 Access Token이 만료된다면 요청이 실패하게 된

부스트캠프 멤버쉽 과정이 끝난지 3주 정도 지난 것 같은데 이제야 후기를 작성하게 되었다. 아무래도 취업 준비로 가장 바쁜 시기이기 때문에 미루다 미루다 오늘이야 작성하게 되었는데, 부스트캠프 과정 자체가 내 인생에서 무척 기억에 남게 되었고 많은 것도 얻게 된 소중한 추억이기 때문에 꼭 기록으로 남겨두고 싶었다. 사실 부스트캠프 교육 과정에 대해 자세한 내용은 보안상 발설할 수 없기 때문에 공개된 과정의 내용이나 느낀점 위주로 후기를 작성하려고 한다. 학습 스프린트🏃 말 그대로 스프린트, 전력 질주를 하며 웹에 대한 학

리액트에는 ContextAPI, Redux, MobX 등 전역으로 상태관리를 하기 위한 많은 선택지가 있다. Apollo Client도 그 중 하나의 선택지로 로컬에서 전역 상태관리를 하기위해 사용할 수 있다. 원래 Apollo Client는 GraphQL을 사용해 서버와 통신을 하며 반환 값을 캐시로 보관하는 상태 관리 라이브러리이다. 하지만 일부 서비스는 서버 없이 완전히 독립적으로 작동할 수 있고, Apollo Client는 그런 경우에도 로컬 상태를 관리할 수 있다. 즉, Apollo Client만 사용해 전역 상태관리

자바스크립트라는 언어는 싱글 쓰레드 언어라고 알려져있다. 보통 싱글 쓰레드라고 하면 한 번에 하나의 작업만 수행할 수 있다고 생각한다. 그렇다면 자바스크립트를 주로 사용하는 웹 사이트에서는 어떻게 한번에 여러 요청을 받을까? 그리고 여러 요청이 오갈 수 있는 자바스크립트는 왜 싱글 쓰레드일까? 오늘은 이 주제에 대해 알아보려고 한다. 자바스크립트는 정말 싱글 쓰레드일까? 맞다, 정확하게 말하면 자바스크립트의 메인 쓰레드인 이벤트 루프가 싱글 쓰레드이기 때문에 자바스크립트를 싱글 쓰레드 언어라고 부른다. 하지만 이벤트 루프만