[GraphQL] GraphQL 개요

웹과 모바일 애플리케이션이 복잡해지면서, 클라이언트가 서버로부터 데이터를 가져오는 방식 또한 진화하고 있다. 그 중심에 GraphQL이 존재한다.

 

GraphQL은 Facebook이 2012년에 개발하고, 2015년에 오픈소스로 공개한 API 쿼리 언어로, 기존 REST API의 한계를 극복하기 위해 등장했다.

 

🔍 GraphQL의 등장 배경

---

REST API의 한계

1. Over-fetching (과다 요청)
   • 클라이언트는 필요한 데이터보다 많은 정보를 받아야 한다.
   • ex) 사용자 이름만 필요한데, 사용자 정보 전체를 받아야 하는 경우
2. Under-fetching (부족한 요청)
   • 원하는 데이터를 얻기 위해 여러 번 API를 호출해야 한다.
   • ex) 게시글과 작성자 이름을 보려면 /posts 와 /users 를 따로 호출해야 하는 구조
3. 복수의 엔드포인트 관리 필요
   • 다양한 리소스를 관리해야 하므로 유지보수 복잡도가 증가한다.
4. 프론트엔드와 백엔드 간의 간극
   • 프론트엔드는 유연한 데이터 구조를 원하지만, 백엔드는 고정된 응답 구조를 갖는 경우가 많다.

 

---

🧭 GraphQL의 시작: FQL에서 출발하다

---

GraphQL의 기원은 Facebook의 내부 쿼리 언어였던 FQL(Facebook Query Language)이다.

 

FQL의 특징

• SQL과 비슷한 문법 사용
• Facebook의 소셜 그래프에 최적화된 구조
• 특정 리소스에 대한 접근 제어 기능 포함

하지만...

• 복잡성이 높고,
• 유연성이 부족하며,
• 범용성이 떨어져

결국 개발 및 지원이 종료되었다.

이러한 FQL의 단점을 보완하고 확장하기 위해 만들어진 것이 바로 GraphQL이다.

 

---

💡 GraphQL의 중요성: FQL에서의 진화

---

GraphQL은 다음과 같은 방향으로 개선되었다.

기능	설명
정확한 데이터 요청과 전달	클라이언트가 필요한 데이터만 명시하여 요청 가능
단일 엔드포인트	모든 요청을 하나의 URL로 처리
타입 시스템	정적 타입을 기반으로 한 강력한 쿼리 구조 제공
효율적인 데이터 로딩	네트워크 비용 최소화, 캐싱 구조와 잘 어울림

 

---

GraphQL이란?

---

GraphQL은 클라이언트가 필요한 데이터만 명시적으로 요청할 수 있는 쿼리 언어(Query Language)이다.

 

즉, 서버가 제공하는 모든 데이터를 고정된 응답으로 받는 것이 아니라, 클라이언트가 "필요한 것만" 요청하고 "필요한 것만" 응답받는 방식이다.

 

GraphQL의 주요 특징과 장점

---

1️⃣ 클라이언트 중심의 쿼리

• 클라이언트가 원하는 필드를 직접 선택해 요청할 수 있음
• REST처럼 정해진 응답 구조가 아닌, 요청한 형태 그대로 응답

 

2️⃣ 타입 시스템

GraphQL은 명확한 스키마 기반으로 작동하며, 모든 API의 구조는 다음처럼 정의된다.

• '!'는 필수 필드를 의미
• 스키마가 문서화와 자동화된 검증에 도움이 됨

 

3️⃣ 단일 엔드포인트

• REST는 /users, /posts, /commnets 등 여러 엔드포인트 존재
• GraphQL은 /graphql 하나로 모든 요청 처리

 

4️⃣ Over-fetching & Under-fetching 방지

• Over-fetching: 필요한 데이터보다 많은 정보 응답 -> 불필요한 네트워크 낭비
• Under-fetching: 원하는 데이터 부족 -> 추가 요청 발생

GraphQL은 필요한 정보만 한 번에 요청 가능하여 이러한 문제를 자연스레 해결한다.

 

5️⃣ 다양한 오픈소스 생태계 지원

GraphQL은 다양한 언어와 프레임워크에서 지원되며, 이를 통해 빠르게 도입하고 확장할 수 있다.

 

서버 측 라이브러리

• Apollo Server (Node.js)
• Graphene (Python)
• Spring for GraphQL (Java)

 

클라이언트 측 라이브러리

• Apollo Client (React, Vue, Angular 등)
• Realy (Facebook이 개발한 고성능 클라이언트)

 

테스트 & 모니터링 도구

• GraphQL Playground: 쿼리 테스트 및 탐색 도구
• Apollo Studio: 모니터링, 성능 추적, 스키마 관리 도구

 

---
## 🔍 GraphQL의 등장 배경

### ✅ REST API의 한계

1. **Over-fetching (과다 요청)**
   - 클라이언트는 필요한 데이터보다 많은 정보를 받아야 합니다.
   - 예: 사용자 이름만 필요한데, 사용자 정보 전체를 받아야 하는 경우

2. **Under-fetching (부족한 요청)**
   - 원하는 데이터를 얻기 위해 여러 번 API를 호출해야 합니다.
   - 예: 게시글과 작성자 이름을 보려면 `/posts`와 `/users`를 따로 호출해야 하는 구조

3. **복수의 엔드포인트 관리 필요**
   - 다양한 리소스를 각각 관리해야 하므로 유지보수 복잡도가 증가합니다.

4. **프론트엔드와 백엔드 간의 간극**
   - 프론트엔드는 유연한 데이터 구조를 원하지만, 백엔드는 고정된 응답 구조를 갖는 경우가 많습니다.

---

## 🧭 GraphQL의 시작: FQL에서 출발하다

GraphQL의 기원은 Facebook의 내부 쿼리 언어였던 **FQL(Facebook Query Language)**입니다.

### FQL의 특징
- SQL과 유사한 문법 사용
- Facebook의 소셜 그래프에 최적화된 구조
- 특정 리소스에 대한 접근 제어 기능 포함

하지만...
- 복잡성이 높고,
- 유연성이 부족하며,
- 범용성이 떨어져 

결국 개발 및 지원이 종료되었습니다.

이러한 FQL의 단점을 보완하고 확장하기 위해 만들어진 것이 바로 **GraphQL**입니다.

---

## 💡 GraphQL의 중요성: FQL에서의 진화

GraphQL은 다음과 같은 방향으로 개선되었습니다:

| 기능 | 설명 |
|------|------|
| **정확한 데이터 요청과 전달** | 클라이언트가 필요한 데이터만 명시하여 요청 가능 |
| **단일 엔드포인트** | 모든 요청을 하나의 URL로 처리 |
| **타입 시스템** | 정적 타입을 기반으로 한 강력한 쿼리 구조 제공 |
| **효율적인 데이터 로딩** | 네트워크 비용 최소화, 캐싱 구조와 잘 어울림 |

---

## 🚀 GraphQL의 주요 특징과 장점

### 1️⃣ 클라이언트 중심의 쿼리

- 클라이언트가 원하는 필드를 직접 선택해 요청할 수 있음
- REST처럼 정해진 응답 구조가 아닌, 요청한 형태 그대로 응답

📌 예시
```graphql
query {
  user(id: 1) {
    name
    email
  }
}
```

응답:
```json
{
  "data": {
    "user": {
      "name": "Alice",
      "email": "alice@example.com"
    }
  }
}
```

---

### 2️⃣ 타입 시스템

GraphQL은 명확한 스키마 기반으로 작동하며, 모든 API의 구조는 다음처럼 정의됩니다:

```graphql
type User {
  id: ID!
  name: String!
  email: String
}
```
- `!` 는 필수 필드를 의미
- 스키마가 문서화와 자동화된 검증에 도움이 됨

---

### 3️⃣ 단일 엔드포인트

- REST는 `/users`, `/posts`, `/comments` 등 여러 엔드포인트 존재
- GraphQL은 `/graphql` 하나로 모든 요청 처리

```http
POST /graphql
Content-Type: application/json
{
  "query": "{ user(id: 1) { name } }"
}
```

---

### 4️⃣ Over-fetching & Under-fetching 방지

- **Over-fetching**: 필요한 데이터보다 많은 정보 응답 → 불필요한 네트워크 낭비
- **Under-fetching**: 원하는 데이터 부족 → 추가 요청 발생

GraphQL은 필요한 정보만 한 번에 요청 가능하여 이러한 문제를 자연스럽게 해결합니다.

---

### 5️⃣ 다양한 오픈소스 생태계 지원

GraphQL은 다양한 언어와 프레임워크에서 지원되며, 이를 통해 빠르게 도입하고 확장할 수 있습니다.

#### 서버 측 라이브러리
- **Apollo Server (Node.js)**
- **Graphene (Python)**
- **Spring for GraphQL (Java)**

#### 클라이언트 측 라이브러리
- **Apollo Client (React, Vue, Angular 등)**
- **Relay (Facebook이 개발한 고성능 클라이언트)**

#### 테스트 & 모니터링 도구
- **GraphQL Playground**: 쿼리 테스트 및 탐색 도구
- **Apollo Studio**: 모니터링, 성능 추적, 스키마 관리 도구

---

## 📚 예시로 보는 GraphQL 쿼리 구조

```graphql
query {
  book(id: 10) {
    title
    author {
      name
    }
  }
}
```

응답:
```json
{
  "data": {
    "book": {
      "title": "GraphQL 시작하기",
      "author": {
        "name": "홍길동"
      }
    }
  }
}
```

- 단일 요청으로 연관된 모든 데이터까지 가져올 수 있음
- 프론트엔드 개발자 입장에서 매우 편리하고 예측 가능한 구조

---

## ✅ 결론: 왜 GraphQL인가?

| 장점 | 설명 |
|------|------|
| **유연성** | 원하는 데이터를 원하는 구조로 요청 가능 |
| **효율성** | 불필요한 요청 제거, 네트워크 효율 향상 |
| **생산성** | 타입 기반 문서화, IDE 자동완성 기능으로 개발 생산성 향상 |
| **호환성** | 다양한 프레임워크 및 도구와 통합 가능 |
| **실시간 지원** | Subscriptions를 통한 실시간 데이터 제공 가능 |

GraphQL은 REST의 대안이 아닌, **보다 발전된 데이터 통신 방식**입니다. 복잡한 데이터 구조, 다양한 프론트엔드 앱, 실시간 기능이 필요한 서비스에 적합합니다.

> 📌 다음 포스팅에서는 GraphQL 스키마 설계, Apollo Server 구축 방법 등을 소개하겠습니다.