B.Herald

이번 글에서는 GraphQL 통합 방법에 대해 알아보겠습니다. Enterprise Solution 기준으로 설명드릴 예정이니 이 부분을 참고하시면서 보시면 되겠습니다. GraphQL에 대한 전반적인 내용이 궁금하시면 아래 글을 먼저 참고하세요. Apollo GraphOS 플랫폼이란? GraphQL 사용 이유 (Feat. GraphQL 장점) 이 섹션에서는 통합된 GraphQL 아키텍처의 이점과 일반적인 통합 그래프를 통해 이러한 이점을 실현하는 방법에 대해 알아봅니다. Apollo에서 다양한 기업과 함께 일한 경험을 바탕으로 조직이 그래프를 통합할 준비가 되었는지 여부를 결정하기 위한 프레임워크도 제공합니다. GraphQL을 통합해야 하는 이유? GraphQL 커뮤니티와 관련 소프트웨어의 생태계는 놀라운 속도로 성장했습니다. 2015년 공개 릴리스 이후 몇 년 동안 이 GraphQL은 거의 모든 애플리케이션 아키텍처의 구성 요소로 사용할 수 있는 수준까지 빠르게 발전했습니다. Airbnb, GitHub 및 New York Times와 같은 회사는 이미 기술 스택에 GraphQL을 채택한 것으로 유명합니다. 강력한 유형 시스템과 데이터 가져오기에 대한 선언적 접근 방식을 통해 기업 전체의 팀이 GraphQL의 많은 이점을 기꺼이 수용한 이유를 쉽게 알 수 있습니다. Apollo에서 매주 150만 회 이상의 Apollo 클라이언트 패키지 다운로드와 매주 수백만 건 이상의 Apollo 서버, 페더레이션 및 게이트웨이 패키지 다운로드를 통해 GraphQL에 대한 팀의 열정을 직접 확인할 수 있습니다. 회사의 여러 팀을 스캔하면 오늘날 많은 팀이 이미 프로덕션에서 GraphQL을 사용하고 있음을 금방 알 수 있습니다. 회사 전체에서 GraphQL이 사용되는 방식에 대한 최상위 수준의 통찰력을 갖는 것은 이러한 노력을 통합할 수 있고 통합해야 하는지 이해하기 위한 첫 번째 단계입니다. GraphQL을 잘 활용하려면? 개발자가 GraphQL을 실험하기 시작할 때 클라이언트 애플리케이션이 단일 GraphQL 서버를 쿼리하는 기본 아키텍처로 시작하는 경우가 많습니다. 차례로 서버는 이러한 요청을 백업 데이터 원본에 배포하고 클라이언트가 원하는 형태로 데이터를 반환합니다. 여러 팀이 GraphQL을 채택하기 시작하면 접근 방식은 일반적으로 이 기본 아키텍처에서 조정되지만 구현 세부 사항은 팀마다 다를 수 있습니다. Apollo에서 우리는 일반적으로 이러한 초기의 통합되지 않은 노력이 다음 네 가지 패턴 중 하나와 유사하다는 것을 보았습니다. Client-only인 경우? GraphQL의 클라이언트 중심 데이터 가져오기 기능의 이점을 얻고자 하는 클라이언트 팀은 미리 비용을 청구하고 애플리케이션 컨텍스트 내에서 GraphQL API를 구현할 수 있습니다. 이러한 구현을 통해 이러한 팀은 단일 GraphQL API 끝점으로 기존 API를 래핑하는 편의를 위해 종종 GraphQL을 채택하도록 동기를 부여받습니다. Front-end를 고려한 Back-end 설계 … Read more

이번 글에서는 GraphQL을 이용하시는 분들이 자주 궁금해하시는 부분들에 대해 정리해두었습니다. GraphQL 사용 이유, Apollo GraphOS 플랫폼 관련해서는 앞선 글들에서 소개를 드린 바 있으니 이를 먼저 참고하시길 바랍니다. Apollo GraphOS 플랫폼이란? GraphQL 사용 이유 (Feat. GraphQL 장점) GraphQL이 뭔가요? GraphQL은 데이터 쿼리를 위한 언어입니다. 대부분의 쿼리 언어(예: SQL)와 달리 특정 유형의 데이터 저장소(예: MySQL 데이터베이스)를 쿼리하는 데 GraphQL을 사용하지 않습니다. 대신 GraphQL을 사용하여 다양한 소스에서 데이터를 쿼리합니다. GraphQL을 사용하면 클라이언트(예: 웹 앱)는 필요한 정보가 포함된 데이터 저장소를 알 필요가 없습니다. 대신 클라이언트는 GraphQL … Read more

이번 글에서는 GraphQL 사용 이유와 GraphQL이 가지는 장점에 대해 알아보겠습니다. Apollo Supergraph에 대해서는 아래 글에서 설명 드린 바 있으니 먼저 참고하셔도 좋습니다. Apollo GraphOS 플랫폼이란? 최신 애플리케이션에서 데이터를 관리하는 것은 어려운 일입니다. 대부분의 애플리케이션에는 아래와 같은 것들이 필요하기 때문입니다.. GraphQL과 Apollo를 채택하면 이러한 문제를 상당히 줄일 수 있습니다. GraphQL의 선언적 모델은 모든 클라이언트에서 사용할 수 있는 일관되고 예측 가능한 API를 만드는 데 도움이 됩니다. 백엔드 데이터 저장소를 추가, 제거 및 마이그레이션할 때 해당 API는 클라이언트 관점에서 변경되지 않습니다. 다른 많은 이점에도 불구하고 GraphQL의 가장 큰 이점은 그것이 제공하는 개발자 경험입니다. API에 새 유형과 … Read more

이번 글에서는 Apollo GraphOS 플랫폼에 대해 설명드려볼까 합니다. React와 React Native 관련된 내용도 몇 번 다룬 적이 있었는데 이에 대해서는 아래 글을 참고해주시면 되겠습니다. React 프로젝트 생성 방법 (create-react-app) React Native 장점, 설치 방법 (npx create-expo-app) Apollo GraphOS 플랫폼이란? Apollo GraphOS는 데이터, 서비스 및 기능의 통합 네트워크인 수퍼그래프를 구축, 관리 및 확장하기 위한 플랫폼으로, 모두 하나의 포괄적인 API로 구성됩니다. 수퍼 그래프의 라우터에 대한 하나의 쿼리로 애플리케이션 클라이언트는 모든 소스 조합에서 데이터를 가져올 수 있습니다. 클라이언트는 GraphQL이라는 강력한 언어로 슈퍼 그래프를 쿼리하여 오버페칭 없이 필요한 데이터를 정확하게 검색할 수 있습니다. 수퍼 그래프의 아키텍처는 노출되지 않으며 클라이언트는 GraphOS에서 관리하는 단일 엔드포인트를 통해 이를 쿼리합니다. 수퍼 그래프는 기존 인프라를 대체하지 않습니다! 대신 기존 인프라를 상호 연결하여 데이터와 상호 작용하는 모든 사람이 더 쉽게 액세스하고 유용하게 사용할 수 있도록 하는 방법론입니다. Apollo GraphOS 주요 기능 GraphOS 플랫폼은 슈퍼 그래프를 구축하고 조직과 함께 안전하게 확장하는 데 도움이 … Read more

이번 글에서는 React 사용 시 가장 중요한 개념인 State, 생명 주기 (Life-cycle) 관련된 설명을 드리도록 하겠습니다. React 설치가 아직 안되신 분들은 아래 글을 먼저 참고해주시길 바랍니다. React 프로젝트 생성 방법 (create-react-app) 일단 시계를 작동시키는 간단한 React 예제로 시작하겠습니다. 아래 코드는 보시면 쉽게 이해가 가능하실 겁니다. const root = ReactDOM.createRoot(document.getElementById(‘root’)); function tick() { const element = ( … Read more

이번 글에서는 React에서 사용되는 JSX 문법에 대해 알아보겠습니다. React 설치가 아직 되시지 않은 분들은 아래 글을 참고해서 React 설치를 먼저 진행해주시길 바랍니다. React 프로젝트 생성 방법 (create-react-app) React JSX const element = <h1>Hello, world!</h1>; 이 재미있는 태그 구문은 문자열도 HTML도 아닙니다. 이는 JSX라고 하며 JavaScript의 구문 확장입니다. JSX 문법은 UI가 어떻게 보여야 하는지 설명하는 역할을 하게 … Read more

이번 글에서는 Expo App 생성 방법에 대해 알아보도록 하겠습니다. Expo 설치가 필요하신 분들은 먼저 아래 글을 참고하시길 바랍니다. Expo 설치 방법 (npx expo -h) 새로운 Expo App 생성 방법 새 Expo 앱을 만들기 전에는 아래 사항들을 먼저 확인해야 합니다. 만약 이 부분이 제대로 되어 있지 않다면 앞선 Expo 설치 방법 글을 참고해서 Expo CLI, Expo Go … Read more

이번 글에서는 Expo 설치 방법, App 생성 방법에 대해 알아보도록 하겠습니다. React Native가 생소하신 분들은 아래 문서를 먼저 참고하시길 바랍니다. React Native 장점, 설치 방법 (npx create-expo-app) Expo로 애플리케이션을 개발하려면 두 가지 도구가 필요합니다. 프로젝트를 제공하는 Expo CLI라는 명령줄 도구와 Android 및 iOS 플랫폼에서 프로젝트를 여는 Expo Go라는 모바일 클라이언트 앱. 또한 모든 웹 브라우저를 사용하여 웹에서 프로젝트를 실행할 수 있습니다. Expo CLI Expo CLI는 개발자와 다른 Expo 도구 간의 기본 인터페이스인 명령줄 도구입니다. 개발 중인 프로젝트 제공, 로그 보기, 에뮬레이터 또는 물리적 장치에서 앱 열기 등과 같은 프로젝트의 … Read more

이번 글에서는 React Native의 장점과 설치 방법에 대해 알아보겠습니다. React Native를 처음 시작하시는 분들은 주로 Expo를 쓰는데 npx create-expo-app를 통해 쉽게 프로젝트 설치가 가능합니다. React Native란? 리액트 네이티브(React Native)는 페이스북이 개발한 오픈 소스 모바일 애플리케이션 프레임워크입니다. React Native는 네이티브 개발의 가장 좋은 부분을 사용자 인터페이스 구축을 위한 동급 최고의 JavaScript 라이브러리인 React와 결합합니다. 리액트 네이티브를 사용하면 Android와 … Read more

이번 글에서는 React 프로젝트 생성 방법에 대해 알아보겠습니다. 흔히 아시는 ‘create-react-app’ 커맨드를 쓰면 되는데 그 전후로 정확히 어떤 프로세스로 진행해야 하는지 참고하시면 좋을 듯 합니다. React란? 먼저 React에 대해 간단히 알아야겠죠. React를 쓰면 html 파일을 1개만 쓰면서도 다른 페이지를 보여주고 싶을 때 html 부분만 갈아치워서 보여줄 수가 있습니다. 그래서 기존 프론트엔드 결과물들보다는 훨씬 부드럽게 동작하게 … Read more