이 페이지는 Cloud Translation API를 통해 번역되었습니다.

Looker Studio에서 모든 데이터를 연결하고 시각화하기

1. 소개

Looker Studio를 사용하면 아름다운 데이터 시각화를 지원하는 실시간 대화형 대시보드를 무료로 빌드할 수 있습니다. Looker Studio에서 모든 수정 및 공유 기능을 사용하여 다양한 소스에서 데이터를 가져오고 무제한 보고서를 만들 수 있습니다. 다음 스크린샷은 Looker Studio 대시보드의 예입니다.

( Looker Studio에서 이 예시 보고서를 보려면 여기를 클릭하세요.)

커뮤니티 커넥터는 Apps Script를 사용하여 인터넷에서 액세스할 수 있는 모든 데이터 소스에 대한 커넥터를 빌드할 수 있는 Looker Studio용 기능입니다. 커뮤니티 커넥터는 Looker Studio 커뮤니티에서 구축합니다. 즉, 누구나 커뮤니티 커넥터를 만들 수 있습니다. 다른 사용자가 Looker Studio 내에서 자신의 데이터에 액세스할 수 있도록 커뮤니티 커넥터를 공유할 수도 있습니다.

커뮤니티 커넥터는 다양한 사용 사례에 사용할 수 있습니다.

상업용 플랫폼 (예: 소셜 미디어, 마케팅, 분석 등)의 데이터를 시각화하고 있습니다.
온프레미스 엔터프라이즈 데이터 (예: 온프레미스 MySQL 데이터베이스의 판매 데이터)를 시각화하고 있습니다.
고객이 서비스의 데이터를 시각화할 수 있는 방법을 제공합니다.
푸시 버튼 보고 플랫폼을 만드는 중입니다
웹 소스에서 자체 데이터를 시각화하고 있는 경우 (예: Google 피트니스 대시보드 생성)

학습할 내용

Looker Studio 커뮤니티 커넥터의 작동 방식
Google Apps Script를 사용하여 커뮤니티 커넥터를 구축하는 방법
Looker Studio에서 커뮤니티 커넥터를 사용하는 방법

필요한 항목

인터넷 및 웹브라우저 액세스
Google 계정
기본 JavaScript 및 웹 API에 대한 기본 지식

2. 간단한 설문조사

이 Codelab을 선택한 이유는 무엇인가요?

<ph type="x-smartling-placeholder"></ph> 일반적인 데이터 시각화에 관심이 있습니다.

Looker Studio에 대해 자세히 알고 싶음

자체 커뮤니티 커넥터를 만들고 싶습니다.

Looker Studio를 다른 플랫폼과 통합하려고 합니다.

Google Cloud 솔루션에 관심이 있습니다.

이 Codelab/튜토리얼을 어떻게 사용할 계획인가요?

<ph type="x-smartling-placeholder"></ph> 스키스루만 사용

읽고 연습 활동을 완료하세요

Looker Studio에 얼마나 익숙하신가요?

<ph type="x-smartling-placeholder"></ph> 들어본 적 없음

이것이 무엇인지 알지만 사용하지는 않습니다.

정기적으로 사용합니다.

전문 사용자입니다.

본인의 배경을 가장 잘 설명하는 항목은 무엇인가요?

<ph type="x-smartling-placeholder"></ph> 개발자

비즈니스 / 재무 / 데이터 분석가

데이터 과학자 / 데이터 엔지니어

마케팅 / 소셜 미디어 / 디지털 분석 전문가

디자이너

기타

다음 페이지로 이동하여 설문조사 정보를 제출할 수 있습니다.

3. 커뮤니티 커넥터 개요

Looker Studio 커뮤니티 커넥터를 사용하면 Looker Studio에서 인터넷에서 액세스할 수 있는 모든 데이터 소스에 직접 연결할 수 있습니다. 상용 플랫폼, 공개 데이터 세트 또는 자체 온프레미스 비공개 데이터에 연결할 수 있습니다. 커뮤니티 커넥터는 웹 API, JDBC API, 플랫 파일 (CSV, JSON, XML), Apps Script 서비스를 통해 데이터를 가져올 수 있습니다.

npm에 패키지를 게시했는데 시간 경과에 따른 패키지의 다운로드 횟수를 일별로 추적하려 한다고 가정해 보겠습니다. 이 Codelab에서는 npm 패키지 다운로드 횟수 API를 사용하여 데이터를 가져오는 커뮤니티 커넥터를 빌드합니다. 그런 다음 Looker Studio에서 커뮤니티 커넥터를 사용하여 다운로드 수를 시각화하는 대시보드를 빌드할 수 있습니다.

4. 커뮤니티 커넥터 워크플로

기본 커뮤니티 커넥터에서 다음 네 가지 기능을 정의합니다.

getAuthType()
getConfig()
getSchema()
getData()

워크플로의 현재 단계에 따라 Looker Studio는 이러한 커넥터 함수를 실행하고 후속 단계에서 응답을 사용합니다. 아래 동영상은 다음에 대한 개요를 제공합니다.

커뮤니티 커넥터 작동 방식
워크플로의 다양한 단계
서로 다른 함수가 호출될 때
Looker Studio에서 다양한 사용자 인터페이스가 표시되는 경우
다양한 단계에서 예상되는 사용자 액션

동영상을 시청한 후 Codelab을 다시 시작할 수 있습니다.

이 워크플로를 외울 필요는 없습니다. 커넥터에서 어떤 일이 발생하는지 살펴보기만 하면 됩니다. 언제든지 이 다이어그램으로 돌아올 수 있습니다.

다음 단계에서는 Google Apps Script에서 커넥터를 만들기 시작합니다. Apps Script UI와 이 Codelab을 오가며 전환해야 합니다.

5. Apps Script 프로젝트 설정

1단계: Google Apps Script를 방문합니다.

2단계: '+ 새 프로젝트'를 클릭하여 새 Apps Script 프로젝트를 만듭니다. 를 클릭합니다.

Code.gs 파일에 빈 myFunction 함수가 있는 셸 프로젝트가 표시됩니다.

3단계: myFunction 함수를 삭제합니다.

4단계: 프로젝트 이름을 지정합니다.

페이지 왼쪽 상단의 Untitled project를 클릭합니다.
프로젝트 제목을 입력합니다.

Code.gs 파일에 커넥터 코드를 작성합니다.

6. getAuthType() 정의

Looker Studio는 커넥터에서 사용하는 인증 방법을 알아야 할 때 getAuthType() 함수를 호출합니다. 이 함수는 커넥터가 타사 서비스를 승인하는 데 필요한 인증 방법을 반환합니다.

빌드 중인 npm 다운로드 커넥터의 경우 사용 중인 API에 인증이 필요하지 않으므로 서드 파티 서비스로 인증할 필요가 없습니다. 다음 코드를 복사하여 Code.gs 파일에 추가합니다.

Code.gs

var cc = DataStudioApp.createCommunityConnector();

function getAuthType() {
  var AuthTypes = cc.AuthType;
  return cc
    .newAuthTypeResponse()
    .setAuthType(AuthTypes.NONE)
    .build();
}

이것은 커넥터에 제3자 인증 (AuthTypes.NONE)이 필요하지 않음을 나타냅니다. 지원되는 모든 인증 방법을 보려면 AuthType() 참조를 확인하세요.

7. getConfig() 정의

커넥터 사용자가 커넥터를 사용하려면 먼저 커넥터를 구성해야 합니다. getConfig() 함수 응답은 사용자에게 표시되는 구성 옵션을 정의합니다. Looker Studio는 getConfig() 함수를 호출하여 커넥터의 구성 세부정보를 가져옵니다. getConfig()에서 제공한 응답에 따라 Looker Studio는 커넥터 구성 화면을 렌더링하고 특정 커넥터 동작을 변경합니다.

구성 화면에서 다음 양식 요소를 사용하여 정보를 제공하거나 사용자 입력을 가져올 수 있습니다.

`TEXTINPUT`	입력 요소	한 줄 텍스트 상자
`TEXTAREA`	입력 요소	여러 줄로 된 텍스트 영역 상자
`SELECT_SINGLE`	입력 요소	단일 선택 옵션의 드롭다운입니다.
`SELECT_MULTIPLE`	입력 요소	다중 선택 옵션의 드롭다운입니다.
`CHECKBOX`	입력 요소	불리언 값을 캡처하는 데 사용할 수 있는 단일 체크박스
`INFO`	표시 요소	사용자에게 안내나 정보를 제공하는 데 사용할 수 있는 정적 일반 텍스트 상자입니다.

INFO 요소를 사용하여 사용자 안내를 제공하고 TEXTINPUT 요소를 사용하여 사용자로부터 입력 패키지 이름을 가져옵니다. getConfig() 응답에서 이러한 양식 요소를 configParams 키 아래에 그룹화합니다.

연결하려는 API에는 매개변수로 날짜가 필요하므로 getConfig() 응답에서 dateRangeRequired를 true로 설정합니다. 그러면 모든 데이터 요청에 기간을 제공하도록 Looker Studio에 지시합니다. 데이터 소스에 매개변수로 날짜가 필요하지 않은 경우 생략할 수 있습니다.

Code.gs 파일의 기존 getAuthType() 코드 아래에 다음 getConfig() 코드를 추가합니다.

Code.gs

function getConfig(request) {
  var config = cc.getConfig();
  
  config.newInfo()
    .setId('instructions')
    .setText('Enter npm package names to fetch their download count.');
  
  config.newTextInput()
    .setId('package')
    .setName('Enter a single package name')
    .setHelpText('e.g. googleapis or lighthouse')
    .setPlaceholder('googleapis');
  
  config.setDateRangeRequired(true);
  
  return config.build();
}

이러한 configParams에 따라 Looker Studio에서 커넥터를 사용할 때 다음과 같은 구성 화면이 표시될 수 있습니다. 이 내용은 나중에 자세히 설명하겠습니다.

다음 함수인 getSchema()로 넘어가겠습니다.

8. getSchema() 정의

Looker Studio는 getSchema() 함수를 호출하여 커넥터에 대해 사용자가 선택한 구성과 연결된 스키마를 가져옵니다. getSchema()에서 제공한 응답에 따라 Looker Studio는 커넥터의 모든 필드를 나열하는 사용자에게 필드 화면을 표시합니다.

커넥터의 특정 구성에서 스키마는 커넥터가 데이터를 제공할 수 있는 모든 필드의 목록입니다. 커넥터는 다양한 구성에 따라 필드가 서로 다른 스키마를 반환할 수도 있습니다. 스키마에는 API 소스에서 가져오는 필드, Apps Script에서 계산하는 필드, Looker Studio에서 계산된 필드 수식을 사용하여 계산된 필드가 포함될 수 있습니다. 커넥터는 스키마의 각 필드에 대한 다음과 같은 메타데이터를 제공합니다.

필드 이름
필드의 데이터 유형
의미론적 정보

나중에 getSchema() 및 Field 참조를 검토하여 자세히 알아보세요.

커넥터가 가져오는 방법에 따라 getSchema()가 호출될 때 스키마가 고정되거나 동적으로 계산될 수 있습니다. 사용자가 정의한 getConfig()의 구성 매개변수는 getSchema() 함수의 request 인수에 제공됩니다.

이 Codelab에서는 request 인수에 액세스할 필요가 없습니다. request 인수에 관해서는 다음 세그먼트에서 getData() 함수 코드를 작성할 때 자세히 알아봅니다.

커넥터의 경우 스키마는 고정되어 있으며 다음 3개 필드를 포함합니다.

`packageName`	사용자가 제공하는 npm 패키지의 이름
`downloads`	npm 패키지의 다운로드 횟수
`day`	다운로드 횟수 날짜

다음은 커넥터의 getSchema() 코드입니다. getFields() 도우미 함수는 필드 생성을 추상화합니다. 이 기능은 getSchema()와 getData()에 모두 필요하기 때문입니다. Code.gs 파일에 다음 코드를 추가합니다.

Code.gs

function getFields(request) {
  var cc = DataStudioApp.createCommunityConnector();
  var fields = cc.getFields();
  var types = cc.FieldType;
  var aggregations = cc.AggregationType;
  
  fields.newDimension()
    .setId('packageName')
    .setType(types.TEXT);
  
  fields.newMetric()
    .setId('downloads')
    .setType(types.NUMBER)
    .setAggregation(aggregations.SUM);
  
  fields.newDimension()
    .setId('day')
    .setType(types.YEAR_MONTH_DAY);
  
  return fields;
}

function getSchema(request) {
  var fields = getFields(request).build();
  return { schema: fields };
}

이 스키마에 따라 Looker Studio에서 커넥터를 사용할 때 Looker Studio 필드 화면에 다음 필드가 표시될 수 있습니다. 하지만 나중에 커넥터를 테스트할 때 자세히 알아봅니다.

마지막 함수인 getData()로 이동해 보겠습니다.

9. getData() 정의: 1부

Looker Studio는 데이터를 가져와야 할 때마다 getData() 함수를 호출합니다. Looker Studio는 getData()에서 제공한 응답에 따라 대시보드에서 차트를 렌더링하고 업데이트합니다. getData()는 다음과 같은 이벤트 중에 호출될 수 있습니다.

사용자가 대시보드에 차트를 추가
사용자가 차트를 수정
사용자가 대시보드를 봅니다.
사용자가 연결된 필터 또는 데이터 컨트롤을 수정함
Looker Studio에 데이터 샘플 필요

완료된 코드가 모두 복사되므로 이 페이지에서 코드를 복사할 필요가 없습니다.

getData()

설명하겠습니다

`request` 객체 이해

Looker Studio는 getData() 호출마다 request 객체를 전달합니다. 아래에서 request 객체의 구조를 검토하세요. 이렇게 하면 getData() 함수의 코드를 작성하는 데 도움이 됩니다.

`request` 객체 구조

{
  configParams: object,
  scriptParams: object,
  dateRange: {
    startDate: string,
    endDate: string
  },
  fields: [
    {
      name: Field.name
    }
  ]
}

configParams 객체에는 getConfig()에서 정의되고 사용자가 구성한 매개변수의 구성 값이 포함됩니다.
scriptParams 객체에는 커넥터 실행과 관련된 정보가 포함됩니다. 이 Codelab에서는 이를 사용하지 않아도 됩니다.
dateRange에 getConfig()응답으로 요청된 경우 요청된 기간이 포함됩니다.
fields에는 데이터가 요청된 필드 이름 목록이 포함됩니다.

이 커넥터의 경우 getData() 함수의 request 예시는 다음과 같습니다.

{
  configParams: {
    package: 'jquery'
  },
  dateRange: {
    startDate: '2017-07-16',
    endDate: '2017-07-18'
  },
  fields: [
    {
      name: 'day',
    },
    {
      name: 'downloads',
    }
  ]
}

위 request의 getData() 호출의 경우 커넥터 스키마에 추가 필드가 있더라도 두 개의 필드만 요청되고 있습니다. 다음 페이지에는 이 getData()호출에 대한 예시 응답과 일반적인 getData()응답 구조가 포함되어 있습니다.

10. getData() 정의: 2부

getData() 응답에서 요청된 필드의 스키마와 데이터를 모두 제공해야 합니다. 코드를 세 개의 세그먼트로 나눕니다.

요청한 필드의 스키마를 만듭니다.
API에서 데이터를 가져오고 파싱합니다.
파싱된 데이터를 변환하고 요청된 필드에 맞게 필터링합니다.

완료된 코드가 모두 복사되므로 이 페이지에서 코드를 복사할 필요가 없습니다.

getData()

설명해 드리겠습니다

다음은 커넥터의 getData() 구조입니다.

function getData(request) {

  // TODO: Create schema for requested fields.
  
  // TODO: Fetch and parse data from API.
  
  // TODO: Transform parsed data and filter for requested fields.

  return {
    schema: <filtered schema>,
    rows: <transformed and filtered data>
  };
}

요청된 필드의 스키마 만들기

// Create schema for requested fields
  var requestedFieldIds = request.fields.map(function(field) {
    return field.name;
  });
  var requestedFields = getFields().forIds(requestedFieldIds);

API에서 데이터 가져오기 및 파싱

npm API URL의 형식은 다음과 같습니다.

https://api.npmjs.org/downloads/point/{start_date}:{end_date}/{package}

Looker Studio에서 제공하는 request.dateRange.startDate, request.dateRange.endDate, request.configParams.package를 사용하여 API의 URL을 만듭니다. 그런 다음 UrlFetchApp(Apps Script 클래스: 참조)를 사용하여 API에서 데이터를 가져옵니다. 그런 다음 가져온 응답을 파싱합니다.

  // Fetch and parse data from API
  var url = [
    'https://api.npmjs.org/downloads/range/',
    request.dateRange.startDate,
    ':',
    request.dateRange.endDate,
    '/',
    request.configParams.package
  ];
  var response = UrlFetchApp.fetch(url.join(''));
  var parsedResponse = JSON.parse(response).downloads;

파싱된 데이터 및 요청된 필드의 필터링 변환

npm API의 응답은 다음 형식입니다.

{
  downloads: [
    {
    day: '2014-02-27',
    downloads: 1904088
    },
    ..
    {
    day: '2014-03-04',
    downloads: 7904294
    }
  ],
  start: '2014-02-25',
  end: '2014-03-04',
  package: 'somepackage'
}

npm API의 응답을 변환하고 다음 형식으로 getData() 응답을 제공합니다. 이 형식이 명확하지 않은 경우 다음 단락의 응답 예를 살펴보세요.

{
  schema: [
    {
      object(Field)
    }
  ],
  rows: [
    {
      values: [string]
    }
  ]
}

응답에서 schema 속성을 사용하여 요청된 필드의 스키마만 반환합니다. rows 속성을 행 목록으로 사용하여 데이터를 반환합니다. 각 행에서 values의 필드 시퀀스는 schema의 필드 시퀀스와 일치해야 합니다. 이전 request 예에 기반한 getData()의 응답은 다음과 같습니다.

{
  schema: requestedFields.build(),
  rows: [
    {
      values: [ 38949, '20170716']
    },
    {
      values: [ 165314, '20170717']
    },
    {
      values: [ 180124, '20170718']
    },
  ]
}

이미 스키마의 하위 집합을 만들었습니다. 다음 함수를 사용하여 파싱된 데이터를 변환하고 요청된 필드로 필터링합니다.

function responseToRows(requestedFields, response, packageName) {
  // Transform parsed data and filter for requested fields
  return response.map(function(dailyDownload) {
    var row = [];
    requestedFields.asArray().forEach(function (field) {
      switch (field.getId()) {
        case 'day':
          return row.push(dailyDownload.day.replace(/-/g, ''));
        case 'downloads':
          return row.push(dailyDownload.downloads);
        case 'packageName':
          return row.push(packageName);
        default:
          return row.push('');
      }
    });
    return { values: row };
  });
}

11. getData() 정의: 3부

결합된 getData() 코드는 아래와 같습니다. Code.gs 파일에 다음 코드를 추가합니다.

Code.gs

function responseToRows(requestedFields, response, packageName) {
  // Transform parsed data and filter for requested fields
  return response.map(function(dailyDownload) {
    var row = [];
    requestedFields.asArray().forEach(function (field) {
      switch (field.getId()) {
        case 'day':
          return row.push(dailyDownload.day.replace(/-/g, ''));
        case 'downloads':
          return row.push(dailyDownload.downloads);
        case 'packageName':
          return row.push(packageName);
        default:
          return row.push('');
      }
    });
    return { values: row };
  });
}

function getData(request) {
  var requestedFieldIds = request.fields.map(function(field) {
    return field.name;
  });
  var requestedFields = getFields().forIds(requestedFieldIds);

  // Fetch and parse data from API
  var url = [
    'https://api.npmjs.org/downloads/range/',
    request.dateRange.startDate,
    ':',
    request.dateRange.endDate,
    '/',
    request.configParams.package
  ];
  var response = UrlFetchApp.fetch(url.join(''));
  var parsedResponse = JSON.parse(response).downloads;
  var rows = responseToRows(requestedFields, parsedResponse, request.configParams.package);

  return {
    schema: requestedFields.build(),
    rows: rows
  };
}

Code.gs 파일 사용을 마쳤습니다. 다음으로 매니페스트를 업데이트합니다.

12. 매니페스트 업데이트

Apps Script 편집기에서 프로젝트 설정 > 'appsscript.json' 표시 매니페스트 파일 수정

이렇게 하면 새 appsscript.json 매니페스트 파일이 생성됩니다.

appscript.json 파일을 다음으로 바꿉니다.

appsscript.json

{
  "timeZone": "America/Los_Angeles",
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",

  "dataStudio": {
    "name": "npm Downloads - From Codelab",
    "logoUrl": "https://raw.githubusercontent.com/npm/logos/master/npm%20logo/npm-logo-red.png",
    "company": "Codelab user",
    "companyUrl": "https://developers.google.com/looker-studio/",
    "addonUrl": "https://github.com/googledatastudio/example-connectors/tree/master/npm-downloads",
    "supportUrl": "https://github.com/googledatastudio/community-connectors/issues",
    "description": "Get npm package download counts.",
    "sources": ["npm"]
  }
}

Apps Script 프로젝트를 저장합니다.

축하합니다. 첫 번째 커뮤니티 커넥터를 만들었으며 이제 시승을 할 준비가 되었습니다.

13. Looker Studio에서 커넥터 테스트

배포 사용

1단계: Apps Script 개발 환경에서 배포를 클릭합니다. 배포 테스트를 클릭하여 배포 테스트 대화상자를 엽니다.

기본 배포인 헤드 배포가 나열됩니다.

2단계: Copy(복사)를 클릭하여 Head Deployment ID(헤드 배포 ID)를 복사합니다.

3단계: Looker Studio에서 커넥터를 로드하려면 <HEAD_DEPLOYMENT_ID>를 바꿉니다. 자리표시자를 커넥터의 헤드 배포 ID와 함께 사용하고 브라우저에서 해당 링크로 이동합니다.

https://lookerstudio.google.com/datasources/create?connectorId=<HEAD_DEPLOYMENT_ID>

커넥터 승인

Looker Studio 최초 사용자: 이전에 Looker Studio를 사용한 적이 없는 경우 Looker Studio를 승인하고 이용약관에 동의하라는 메시지가 표시됩니다. 승인 프로세스를 완료합니다. Looker Studio를 처음 사용하는 경우 마케팅 환경설정을 업데이트하라는 대화상자가 표시될 수도 있습니다. 이메일로 최신 기능, 업데이트, 제품 공지사항을 확인하려면 제품 출시에 가입하세요.

로드되면 커넥터를 승인하라는 메시지가 표시됩니다.

'승인'을 클릭하고 커넥터에 필요한 승인을 제공합니다.

커넥터 구성

승인이 완료되면 구성 화면이 표시됩니다. 'lighthouse'를 입력합니다. 을 입력하고 오른쪽 상단의 연결을 클릭합니다.

스키마 확인

필드 화면이 표시됩니다. 오른쪽 상단에서 보고서 만들기를 클릭합니다.

대시보드 만들기

Looker Studio 대시보드 환경이 표시됩니다. 보고서에 추가를 클릭합니다.

Looker Studio에서 사용자가 커넥터에 액세스하고 새 구성을 추가할 때마다 사용자의 Looker Studio 계정에 새 데이터 소스가 생성됩니다. 데이터 소스는 특정 구성을 기반으로 커넥터의 인스턴스화라고 생각하면 됩니다. 사용자가 선택한 커넥터와 구성에 따라 데이터 소스는 특정 필드 집합이 포함된 데이터 표를 반환합니다. 사용자는 동일한 커넥터에서 여러 데이터 소스를 만들 수 있습니다. 하나의 데이터 소스를 여러 보고서에서 사용할 수 있고, 같은 보고서에서 여러 데이터 소스를 사용할 수 있습니다.

이제 시계열 차트를 추가하세요. 메뉴에서 삽입 > 시계열. 그런 다음 캔버스에 시계열을 배치합니다. 선택한 패키지의 npm 다운로드 횟수 시계열 차트가 표시됩니다. 날짜 필터 컨트롤을 추가하고 아래와 같이 대시보드를 봅니다.

작업이 끝났습니다. 첫 번째 커뮤니티 커넥터를 만들었습니다. 이로써 이 Codelab을 마쳤습니다. 이제 취할 수 있는 조치를 살펴보겠습니다.

14. 다음 단계

빌드한 커넥터 개선

방금 만든 커넥터를 다음과 같이 개선합니다.

Looker Studio에서 커넥터의 구성 화면에 패키지 이름을 제공하지 않으면 시계열 차트를 그릴 때 오류 메시지가 표시됩니다. 커넥터 구성에 입력 유효성 검사 또는 기본 옵션을 추가해 보세요.
커넥터 구성에서 여러 패키지 이름을 동시에 쿼리할 수 있도록 지원을 추가해 보세요. 힌트: npm 패키지 다운로드 횟수 API 는 쉼표로 구분된 여러 패키지 이름의 입력을 지원합니다.
이 두 가지에 대한 솔루션은 npm 커넥터 코드에서 찾을 수 있습니다.

커뮤니티 커넥터로 더 많은 작업 수행

커넥터 API 및 매니페스트의 참조를 확인하세요.
오픈소스 저장소에서 커넥터 코드 예시를 살펴보고 권장사항을 알아보세요.
버클 Codelab을 완료하여 로컬 환경에서 커뮤니티 커넥터를 개발할 수 있습니다.
커뮤니티 커넥터를 완성했다면 사용 가능한 게시 옵션을 고려하세요.
Looker Studio의 커뮤니티 시각화를 빌드합니다.

추가 리소스

다음은 이 Codelab에서 다룬 자료를 자세히 살펴보는 데 도움이 되는 다양한 리소스입니다.

리소스 유형	사용자 기능	개발자 기능
문서	고객센터	개발자 문서
뉴스 및 업데이트	Looker Studio에서 가입하기 > 사용자 설정	개발자 메일링 리스트
질문하기	사용자 포럼	Stack Overflow [looker-studio]
동영상	DataVis DevTalk
예시	보고서 갤러리 커넥터 갤러리	오픈소스 저장소

Looker Studio에서 모든 데이터를 연결하고 시각화하기

1. 소개

학습할 내용

필요한 항목

2. 간단한 설문조사

이 Codelab을 선택한 이유는 무엇인가요?

이 Codelab/튜토리얼을 어떻게 사용할 계획인가요?

Looker Studio에 얼마나 익숙하신가요?

본인의 배경을 가장 잘 설명하는 항목은 무엇인가요?

3. 커뮤니티 커넥터 개요

4. 커뮤니티 커넥터 워크플로

5. Apps Script 프로젝트 설정

6. getAuthType() 정의

Code.gs

7. getConfig() 정의

Code.gs

8. getSchema() 정의

Code.gs

9. getData() 정의: 1부

request 객체 이해

request 객체 구조

10. getData() 정의: 2부

요청된 필드의 스키마 만들기

API에서 데이터 가져오기 및 파싱

파싱된 데이터 및 요청된 필드의 필터링 변환

11. getData() 정의: 3부

Code.gs

12. 매니페스트 업데이트

appsscript.json

13. Looker Studio에서 커넥터 테스트

배포 사용

커넥터 승인

커넥터 구성

스키마 확인

대시보드 만들기

14. 다음 단계

빌드한 커넥터 개선

커뮤니티 커넥터로 더 많은 작업 수행

추가 리소스

`request` 객체 이해

`request` 객체 구조