Introdução ao Vinyl 3.3: Introdução¶

Curso Objetivo¶

Este curso cobre as habilidades básicas necessárias para desenvolver com Vinyl, bem como a metodologia Vinyl usada para desenvolver e manter aplicativos.

Neste curso, construímos um aplicativo Vinyl simples de atendimento de pedidos usando o banco de dados Global Imports que construímos primeiro como fonte de dados do aplicativo. Percorremos o fluxo de dados da camada de dados para a camada de negócios e, por fim, para a camada de UI no Vinyl, para que você veja como os dados se tornam um aplicativo.

O objetivo deste curso é fazer com que você se sinta confortável navegando no Vinyl, construindo um banco de dados na camada de dados, construindo regras de negócios, construindo e editando páginas e gráficos simples na camada UI e mantendo páginas em uma aplicação Vinyl.

Visão Geral do Vinyl¶

Vinyl é uma plataforma de desenvolvimento baseada em navegador que permite que vários usuários criem aplicativos web. Esses aplicativos podem executar uma hospedar de serviços e workflows internos e externos da empresa. O Vinyl pode ser usado para melhorar quase todos os aspectos da condução dos negócios.

O Vinyl é independente de plataforma. Isso significa que ele funciona em qualquer navegador moderno e é totalmente compatível com dispositivos móveis. Ele pode ser acessado em qualquer sistema operacional e conectado a fontes de dados de praticamente todos os principais provedores de servidores de banco de dados. Além disso, a plataforma Vinyl é desenvolvida com design responsivo. Isso significa que a plataforma será executada e visível em qualquer tamanho de tela ou resolução e é automaticamente otimizada para dispositivos móveis.

Faça Login em uma Instância do Vinyl¶

Para começar a usar o Vinyl, acesse a URL da instância do Vinyl e faça login.

Para acessar a instância de treinamento, você precisará de um navegador padrão atual conectado à web. Você receberá um URL para usar na instância de treinamento do Vinyl, junto com um nome de usuário e uma senha para autenticação como usuário. Insira o Nome de usuário e a Senha atribuídos e clique no botão Entrar:

Navegando em Vinyl¶

O Vinyl utiliza web design responsivo em seu layout, permitindo que os aplicativos tenham a melhor experiência de visualização interativa em múltiplas plataformas. Isso é feito com grades flexíveis baseadas em proporções, que usam unidades relativas baseadas em porcentagens em vez de unidades fixas como pixels. Os painéis são agrupados e exibidos com base em sua prioridade, valor que pode ser designado pelo desenvolvedor do aplicativo, sendo que números menores têm maior prioridade. Isso significa que quando os aplicativos Vinyl são visualizados em um dispositivo móvel, apenas os painéis com maior prioridade são exibidos na tela. Além disso, quando um usuário do aplicativo está trabalhando em uma tela menor, pode ser necessária navegação adicional para acessar todos os painéis do aplicativo.

A página inicial do Vinyl, ou Menu do Site, mostrará todos os aplicativos aos quais o usuário tem acesso, organizados por prioridade de menu:

A navegação primária no Vinyl é realizada usando o menu Action Drawer , localizado no canto superior direito de todas as telas, uma vez logado. Dependendo de onde você está na interface do usuário e das permissões às quais você tem acesso, o menu apresenta opções dinâmicas para navegação posterior.

Gaveta de Ação¶

Localizado no canto superior direito da tela, o menu Action Drawer permite que você navegue rapidamente para algumas das páginas mais usadas do Vinyl. Dependendo do seu tipo de usuário, você verá a seguinte navegação:

Ícone	Etiqueta	Descrição
	Menu do site	Visualize e execute aplicativos disponíveis no servidor.
	Designer ao vivo	Abre o modo de design na mesma janela do navegador, para a página exibida atualmente. Usado para editar uma página ou seus painéis e controles.
	Centro de Design	Abre o Design Center onde os processos de desenvolvimento podem ser projetados.
	Imprimir página	Imprime a página atual.
	Documentação	Acesse o centro de recursos Vinyl Spotlight da Vinyl Community.
	Ver perfil do usuário	Gerencie propriedades de perfil de usuário e informações de contato, bem como altere senha.
	Sair	Saia do ambiente do aplicativo.
	Usuários ativos do aplicativo	Visualize registros de visualização de página, uma página de relatório em estilo de painel contendo dados sobre o envolvimento do usuário com aplicativos Vinyl.
	Atividade de rastreamento	Visualize dados de diagnóstico para ajudar a diagnosticar e resolver problemas problemas.
	Status do serviço	Monitor de status ativo, navega até a página Monitoramento com utilitários para gerenciar e visualizar informações sobre o status do ambiente.
	Configurações de localização	Permite ao usuário definir idioma, localidade e fuso horário para o ambiente Vinyl.
	Auditoria	Quando o escudo de auditoria é exibido, indica que o Vinyl está protegendo e monitorando dados. O Vinyl gerencia as permissões para garantir que você veja apenas os dados que está autorizado a visualizar, e quaisquer alterações nos dados sejam registradas para referência.

Navegação Adicional em Vinyl¶

Estes controles de navegação adicionais estão disponíveis:

• A seta para trás e o título no canto superior esquerdo exibem a página anterior em que você estava e retornam a ela quando clicados.

• O título à direita do botão Voltar mostra o título da página atual.

  Nota

  O título da página pode ser ocultado por design.

• O botão Criar em qualquer painel permite adicionar conteúdo a ele.

• O ícone de divisa leva a uma nova página e o ícone pop-up leva a uma nova página em uma janela pop-up.

• O botão Voltar do navegador retornará à tela anterior em que você estava no Vinyl. Esta pode ser uma ferramenta muito útil no desenvolvimento e manutenção de aplicativos.

Para obter uma visão geral mais detalhada do espaço de trabalho do Vinyl e dos componentes usados na construção de um aplicativo, consulte o Guia do usuário do Vinyl.

Centro de Design¶

O Design Center fornece atalhos rápidos para tarefas diárias necessárias para criar e manter aplicativos:

O Design Center fornece acesso às seguintes áreas comumente usadas no desenvolvimento e manutenção de aplicativos:

• Tabelas: Visualize e mantenha tabelas de aplicativos e o esquema do banco de dados.

• + Tabela: Crie uma nova tabela e gere automaticamente páginas para adicionar a um aplicativo.

• Regras: Visualize e mantenha todas as regras do aplicativo.

• + Regra: Crie uma nova regra de negócio.

• Usuários: Visualize e mantenha todos os usuários existentes do aplicativo.

• Adicionar um usuário: Crie um novo usuário para adicionar ao grupo de aplicativos.

• Páginas: Visualize e mantenha as páginas do aplicativo e o Menu do Site.

• + Página: Crie uma nova página no assistente de páginas.

• Menus: Visualize e mantenha menus para organizar as páginas do aplicativo.

• Configurações: Visualize e mantenha as configurações relacionadas ao aplicativo.

Aparência e Comportamento do Aplicativo¶

O botão Configurações no Design Center permite modificar o nome de um aplicativo, imagem associada e/ou tema:

• Nome do aplicativo: Nome atribuído ao aplicativo. Visível por padrão.

• Selecione uma imagem: Imagem usada para representar o aplicativo no Menu do Site.

• Selecionar tema: Tema associado que fornece personalização na aparência.

Ícones de Atalho da Barra de Ferramentas¶

Links de ícones de atalho estão disponíveis na barra de ferramentas do Design Center para áreas comumente acessadas para desenvolvimento de aplicativos. Esses links de ícones de atalho incluem:

• Usuários: Navegue até a área de autenticação de usuário e autenticação de fonte de dados para gerenciar e manter o acesso e a configuração.

• Aparência: Acesse e gerencie informações relacionadas à personalização da aparência de um aplicativo: temas, imagens, modelos e widgets.

Camadas de Vinyl¶

A criação de aplicativos é realizada usando três camadas distintas definidas no Vinyl: Camada de armazenamento de dados, Camada de lógica de negócios e Camada de UI. Essas camadas são codificadas por cores nas telas da plataforma para ajudar a distingui-las visualmente. A camada de dados é apresentada em azul, a camada de negócios em vermelho e a camada de UI em verde.

O acesso a todas as três camadas está disponível no Design Center.

Camada de Armazenamento de Dados¶

A Camada de armazenamento de dados contém todas as tabelas e colunas onde os dados físicos são armazenados. Nessa camada você pode visualizar todas as fontes de dados no servidor, criar e excluir fontes de dados, construir e modificar tabelas e colunas e gerenciar chaves, índices e relacionamentos entre tabelas.

Camada de Lógica de Negócios¶

A Camada Lógica de Negócios é usada para expor seus dados e também permite manipular e filtrar dados das tabelas na camada de dados. Nessa camada, você pode definir regras e objetos de negócios, criar trabalhos personalizados que podem ser acionados em eventos de maneira programada e criar funções de segurança para bloquear usuários nos aplicativos.

Camada de IU¶

A Camada UI é onde você cria o aplicativo real e personaliza a interface do usuário. Na camada UI você pode visualizar todos os aplicativos no servidor, criar novos aplicativos, projetar e modificar a interface do usuário dos aplicativos e até mesmo excluir cautelosamente um aplicativo.

Central de Sucesso do Vinyl¶

Para obter mais informações sobre como trabalhar com Vinyl, consulte Vinyl Success Central. O Vinyl Success Central contém toda a documentação técnica pública do Vinyl e é atualizado regularmente e para cada ciclo de lançamento. Para acessar o site de documentação no Vinyl, vá até o menu Action Drawer e selecione Documentação.

Esquema de Banco de Dados de Importações Globais¶

O esquema do banco de dados Importações Globais abaixo mostra as tabelas e colunas correspondentes que foram incluídas no aplicativo. Seguindo a metodologia do Vinyl, a primeira coluna de cada tabela é a chave primária e sempre tem ID anexado ao nome da coluna. Por exemplo: a coluna de chave primária da tabela Customer é denominada CustomerID. As setas mostradas no esquema do banco de dados representam relacionamentos de entidades existentes com chave primária (PK) e chaves estrangeiras (FK) dentro da estrutura do banco de dados: