Construtor de componente personalizado

Desenvolva componentes personalizados usando o Estrutura de IU do Next Experience e o extensão do componente iu.

Componentes são blocos de construção reutilizáveis que você usa para criar uma interface do usuário personalizada. O Next Experience Design System vem com um conjunto de componentes personalizáveis que você pode arrastar para a IU personalizada. Desenvolva seus próprios componentes se não encontrar o que precisa na biblioteca Next Experience Design System.

Para ver a biblioteca Next Experience Design System, visite ServiceNow® Site do desenvolvedor.

Benefícios da criação de componentes personalizados

O desenvolvimento de componentes personalizados permite:

• Personalize uma IU de acordo com as necessidades do seu agente, cliente e empresa.
• Torne seus funcionários mais eficazes e reduza a alternância de contexto com acesso rápido a dados e informações importantes.
• Acomode o ambiente omnicanal exclusivo da sua empresa usando APIs para consolidar seus dados.

Por exemplo, você pode criar um componente que exibe os casos associados a um ANS ou que rastreia os bate-papos ativos em uma fila específica. Você pode usar o Estrutura de IU do Next Experience e o extensão do componente iu para desenvolver o componente necessário e acessar dados da sua plataforma usando a API de efeito Http. Você também pode consultar dados da plataforma usando a GraphQL criando um esquema personalizado. Para obter mais informações, consulte GraphQL com script.

O que saber antes de começar

Antes de começar a projetar e criar seu componente, certifique-se de ter:

• Algum conhecimento geral de conceitos, desenvolvimento e design de componentes da Web.
• Conhecimento JavaScript para definir o comportamento do componente.
• Conhecimento do Node Package Manager (npm).
• A versão mais recente do Node.js instalada na máquina local. Para obter mais informações, consulte Node.js.
• O ServiceNow CLI instalado em sua máquina.

Estrutura de IU do Next Experience

O Estrutura de IU do Next Experience é uma estrutura JavaScript que permite estender suas aplicações e criar componentes da Web que são reutilizáveis em todas as suas aplicações. Usar o Estrutura de IU do Next Experience permite que você:

• Crie um único componente para usar em vários locais em suas aplicações.
• Encapsule o escopo do componente para evitar conflitos com outro código.
• Adicione propriedades, slots e ações ao seu componente, permitindo que os usuários personalizem o componente sempre que o usarem em um Espaço.

Para obter mais informações, consulte ServiceNow® Site do desenvolvedor.

extensão do componente iu e fluxo de desenvolvimento

O extensão do componente iu é uma extensão do ServiceNow CLI que permite desenvolver componentes personalizados usando o Estrutura de IU do Next Experience. Com o extensão do componente iu, você pode:

• Crie o conjunto de arquivos necessários para desenvolver um componente ou andaime de projeto.
• Inicie um servidor de desenvolvimento local para testar seu componente.
• Crie um projeto de componente e implante-o em uma instância ServiceNow.

Escopo da aplicação

Quando você implanta um componente Estrutura de IU do Next Experience, ele é implantado em uma aplicação com escopo na instância. Você pode fornecer um escopo da aplicação para o componente usar como um identificador de namespace. Use as diretrizes de identificador de namespace para desenvolvimento de aplicações na instância. Para obter mais informações, consulte Escopo da aplicação.

Ao reservar um escopo da aplicação, siga estes requisitos:

• Máximo: 18 caracteres.

• Caso: caso de cobra.

• Formato: x_customerprefix_componentname, em que:
  • customerprefix é o valor na propriedade do sistema glide.appcreator.company.code em sua instância.
  • componentsname é o valor fornecido no parâmetro de nome do componente quando você criou o projeto.

Se você não fornecer um escopo da aplicação ao criar seu projeto de componente, a Now CLI criará um para você.

Como alternativa, você pode adicionar um valor ao parâmetro scopeName no arquivo now-ui.json. Para obter mais informações, consulte Alterar o escopo da aplicação de um componente.

Guia de referência

Para ver o guia de referência da Now CLI, visite o Site do desenvolvedor.

• Configurar seu ambiente
  Prepare seu ambiente local instalando o ambiente de tempo de execução JavaScript Node.js, o gerenciador de pacotes Node (npm) e o extensão do componente iu. Essas ferramentas permitem desenvolver e criar componentes localmente e implantá-los em sua instância.
• Configurar seu projeto
  Crie o projeto de componente e o conjunto de arquivos necessários para desenvolver um componente. Você pode se conectar à sua instância e criar um escopo da aplicação para o seu componente ou pode reservar um escopo para verificar mais tarde.
• Use um servidor proxy com extensão do componente iu
  Use um servidor proxy com a Now CLI para definir uma fonte de dados separada para o seu componente. Ao usar um servidor proxy, a instância encaminha as solicitações da Now CLI para o servidor proxy.
• Desenvolver um componente
  Adicione seu código de componente e teste-o usando um servidor de desenvolvimento local.
• Desenvolver um componente para Virtual Agent
  Crie um componente Virtual Agent personalizado para coletar informações de entrada ou exibir na interface do cliente Virtual Agent.
• Adicionar um componente a Espaço do agente
  Use componentes personalizados para criar uma interface Espaço personalizada para atender à necessidade específica dos agentes da sua empresa.
• Implantar um componente em uma instância
  Implante seu componente para ser exibido em sua instância como um plug-in de aplicação.
• Alterar o escopo da aplicação de um componente
  Altere o escopo da aplicação de um componente se você encontrar problemas de escopo ao implantar seu componente em uma instância. Por exemplo, você pode ter definido um escopo da aplicação que já está em uso ou é inválido ao criar um componente no modo off-line.