bherald

이번 글에서는 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