Nesta página, descrevemos como gerar e configurar um modelo básico de extensão do Looker em que é possível adicionar funcionalidades.
Para criar uma nova extensão do Looker, você precisa realizar as seguintes tarefas:
- Configurar um projeto do LookML que inclua um arquivo de modelo e um de manifesto do projeto e que esteja conectado ao Git
- Gerar os arquivos de modelo de extensão
Os procedimentos abaixo mostram como criar os elementos anteriores.
Como configurar o Looker para uma extensão
Cada extensão do Looker exige um projeto do LookML que inclui um arquivo de modelo e um arquivo de manifesto para ser executado.
Crie um projeto em branco para sua extensão.
No novo projeto, crie um arquivo de modelo usando o
+
na parte de cima do navegador de arquivos no ambiente de desenvolvimento integrado do Looker.O novo arquivo de modelo é gerado com parâmetros
connection
einclude
:Substitua
connection_name
no parâmetroconnection
pelo nome de uma conexão de banco de dados válida na instância. A extensão requer um arquivo de modelo válido porque os dados de permissões do Looker são acessados pelo modelo LookML. Para gerenciar o acesso à extensão, é preciso associá-la a um modelo LookML válido e conceder permissões aos usuários para acessar esse modelo. Quando terminar de editar o arquivo de modelo, clique em Salvar alterações.Como sua extensão não requer um arquivo de visualização, exclua o parâmetro
include: "/views/*.view.lkml"
ou adicione um caractere#
no início da linha para transformá-la em um comentário. Deixar o parâmetroinclude: "/views/*.view.lkml"
como está fazendo com que o validador do LookML gere erros.Crie um arquivo de manifesto de projeto usando a
+
na parte de cima do navegador de arquivos no ambiente de desenvolvimento integrado do Looker.Inicialmente, o arquivo de manifesto do projeto estará vazio, mas mais adiante neste procedimento você copiará o conteúdo gerado no arquivo de manifesto do projeto que incluirá o parâmetro
application
. O parâmetroapplication
atribui um rótulo à extensão, informa ao Looker onde encontrar o JavaScript da extensão e fornece uma lista de direitos para a extensão. Os direitos definem os recursos do Looker que a extensão pode acessar. A extensão não poderá acessar um recurso do Looker, a menos que ele esteja listado nos direitos.Por enquanto, você pode deixar o arquivo de manifesto como está, já que o restante do conteúdo do arquivo será copiado mais tarde neste processo.
Configure uma conexão Git para o novo projeto.
Você pode acessar a página Configurar Git clicando no botão Configurar Git no canto superior direito do ambiente de desenvolvimento integrado do Looker ou usando a página Configuração do projeto, conforme descrito na página de documentação Como configurar e testar uma conexão Git.
Depois de configurar o projeto para sua extensão e conectá-lo ao Git, você poderá gerar os arquivos de modelo de extensão.
Gerar os arquivos de modelo de extensão
Há duas maneiras de gerar arquivos de código de modelo de extensão:
Os dois processos exigem Yarn, portanto, instale o Yarn.
Como usar create-looker-extension
para criar um modelo de extensão
O utilitário create-looker-extension
cria uma extensão básica do Looker que inclui todos os arquivos de extensão e dependências necessários. Você pode usar isso como ponto de partida e adicionar mais códigos e funcionalidades para concluir sua extensão.
Para gerar o modelo de extensão:
Execute o utilitário
create-looker-extension
, substituindo<extension_name>
pelo nome da sua extensão:yarn create looker-extension <extension_name>
Confirme o nome da extensão ou forneça um nome diferente e selecione a linguagem e o framework que você quer usar para criar a extensão:
O utilitário
create-looker-extension
usará o framework que você especificou para preencher um modelo base e colocar todos os arquivos gerados em um novo diretório que usa o nome da extensão:Navegue até o diretório que foi criado para sua extensão:
cd <extension_name>
Instale as dependências da extensão:
yarn install
Inicie o servidor de desenvolvimento:
yarn develop
A extensão está agora em execução e exibindo o JavaScript localmente em
http://localhost:8080/bundle.js
.No diretório da extensão, está o arquivo
manifest.lkml
. Copie o conteúdo desse arquivo.No projeto do LookML, cole o conteúdo de
manifest.lkml
no arquivo de manifesto do projeto:Clique em Save Changes para salvar o arquivo de manifesto do projeto.
No ambiente de desenvolvimento integrado do LookML, clique em Validar LookML, em Confirmar alterações e enviar e em Implantar na produção.
Atualize o Looker usando a função de atualização do navegador.
O nome da nova extensão vai aparecer na seção Aplicativos do menu principal do Looker.
Selecione sua extensão na seção Aplicativos para visualizar a saída dela.
Como clonar um repositório Git para criar um modelo de extensão
O Looker mantém um repositório Git com vários modelos de extensão em https://github.com/looker-open-source/extension-examples. Se você quiser usar um dos exemplos, navegue até o repositório desse exemplo e siga as instruções mostradas a seguir.
Este procedimento requer Yarn, portanto, verifique se você tem o Yarn instalado.
Na linha de comando local, use o seguinte comando para clonar o repositório Git:
git clone git@github.com:looker-open-source/extension-examples.git
Navegue até o diretório que contém o modelo que você quer instalar no sistema. Neste exemplo, usaremos a extensão "Hello World" do React e JavaScript:
cd extension-examples/react/javascript/helloworld-js
Instale as dependências da extensão:
yarn install
Talvez seja necessário atualizar sua versão do Node ou usar um gerenciador de versões do Node para alterar essa versão.
No diretório da extensão, está o arquivo
manifest.lkml
. Copie o conteúdo desse arquivo.No projeto do LookML, cole o conteúdo de
manifest.lkml
no arquivo de manifesto do projeto:Clique em Save Changes para salvar o arquivo de manifesto do projeto.
No canto superior direito do ambiente de desenvolvimento integrado do LookML, clique em Validar LookML e em Confirmar alterações e enviar. Depois, clique em Implantar na produção.
No seu terminal, inicie o servidor de desenvolvimento:
yarn develop
A extensão está em execução e veiculando o JavaScript em um servidor de desenvolvimento local especificado no parâmetro
url
do arquivo de manifesto:http://localhost:8080/bundle.js
.Atualize o Looker usando a função de atualização do navegador.
Na seção Applications do menu principal do Looker, o nome da nova extensão é mostrado, e é determinado pelo parâmetro
label
no arquivo de manifesto do projeto.Selecione sua extensão na seção Aplicativos para visualizar a saída dela.
Como modificar a extensão
Depois de criar a extensão básica, você pode modificar ou adicionar código a ela modificando o arquivo JavaScript ou TypeScript apropriado.
O diretório src
no diretório da extensão contém o arquivo de origem em que você pode adicionar o código. No exemplo anterior, para o modelo "Hello World" do React e JavaScript, o nome do arquivo era HelloWorld.js
. Modificar ou adicionar código a esse arquivo modifica ou adiciona à função da extensão.
Veja a seguir a saída do arquivo HelloWorld.js
do React e do JavaScript:
import React, { useEffect, useState, useContext } from 'react'
import { Space, ComponentsProvider, Text } from '@looker/components'
import { ExtensionContext } from '@looker/extension-sdk-react'
export const HelloWorld = () => {
const { core40SDK } = useContext(ExtensionContext)
const [message, setMessage] = useState()
useEffect(() => {
const initialize = async () => {
try {
const value = await core40SDK.ok(core40SDK.me())
setMessage(`Hello, ${value.display_name}`)
} catch (error) {
setMessage('Error occured getting information about me!')
console.error(error)
}
}
initialize()
}, [])
return (
<>
<ComponentsProvider>
<Space p="xxxxxlarge" width="100%" height="50vh" around>
<Text p="xxxxxlarge" fontSize="xxxxxlarge">
{message}
</Text>
</Space>
</ComponentsProvider>
</>
)
}
No exemplo anterior, você poderia mudar a saída de texto da extensão mudando o texto na linha:
setMessage(`Hello, ${value.display_name}`).
Ao adicionar funcionalidades, talvez seja necessário modificar os direitos concedidos à extensão no parâmetro
application
no arquivo de manifesto do projeto.