현인

이번 장에서는 GraphQL 서버에 어떻게 질의가 이루어지는지 상세하게 배워보겠다.FieldsGraphQL은 단순하게 말하면 객체의 특정 필드를 요청하는 것이다. 매우 간단한 쿼리와 이를 실행했을 때 얻는 결과를 살펴보자.//Operationhero { name }}//Response{ "data": { "hero": { "name": "R2-D2" } }쿼리 결과와 정확히 같은 모양이라는 것을 바로 알 수 있다. 이것은 GraphQL에게 필수적이다. 항상 기대하는 것을 반환받고, 서버는 클라이언트가 어떤 필드를 요청하는지 정확히 알고 있기 때문이다.name 필드는 String 타입을 반환한다.위 예시에서는 우리는 영웅의 이름만 요청했고, 그 결과 문자열이 반환되었지만, 필..

GraphQL을 사용하게 되어 공식문서를 통해 먼저 학습해보려고 한다.GraphQL은 API를 위한 쿼리 언어이며, 사용자가 데이터에 대해 정의한 타입 시스템을 사용하여 쿼리를 실행하는 서버 측 런타임이다. GraphQL 명세는 2015년에 오픈소스로 공개되었으며, 이후 다양한 프로그래밍 언어로 구현되었다. GraphQL은 특정 데이터베이스나 스토리지 엔진에 종속되지 않으며, 사용자의 기존 코드와 데이터를 기반으로 동작한다.타입 시스템으로 API를 설명한다GraphQL 서비스는 타입과 필드를 정의한 다음 각 필드에 필요한 데이터를 제공하는 함수를 작성하여 생성된다. 예를 들어, 로그인한 사용자의 이름을 알려주는 GraphQL 서비스는 다음과 같다.type Query { me: User} type Use..

이전 챕터에서는 Next.js 어플리케이션의 스타일링 방법에 대해 알아봤다. 이번 장에서는 커스텀 폰트와 hero image를 추가하는 방법에 대해 다뤄볼 예정이다.hero image란?웹사이트나 애플리케이션에서 가장 상단에 큰 배너 형식으로 배치되는 이미지. 보통 첫 화면에서 사용자가 가장 먼저 보게 되는 이미지로, 브랜드의 메시지나 핵심 내용을 시각적으로 전달하는 역할을 한다. - https://vwo.com/glossary/hero-image/3장에서 다룰 내용next/font를 활용한 커스텀 폰트 추가 방법next/image를 활용한 이미지 추가 방법Next.js에서 폰트와 이미지를 최적화하는 방법폰트는 왜 최적화 해야 할까?폰트는 웹사이트 디자인에서 중요한 역할을 한다. 하지만 커스텀 폰트를 활..