A proposta deste artigo é iniciar uma série para construção de uma aplicação Web em Angular 7 que possa consumir dados de uma API Rest a partir do serviço de dados de uma instituição pública.

Contextualizando

Dados abertos podem ser acessados livremente, modificados e compartilhados para qualquer finalidade. Essa definição, proposta pela Open Knowledge International, ainda é composta por diretrizes de como organizar, publicar e manter esses tipos de dados.

A razão para o fomento da prática está na transparência da gestão pública, contribuindo para uma participação mais efetiva da sociedade nos investimentos e gastos do dinheiro público.

“Não existe essa coisa de dinheiro público, existe apenas o dinheiro dos pagadores de impostos.” – Margareth Thatcher

No Portal Brasileiro de Dados Abertos, site disponibilizado pelo governo federal que permite encontrar e utilizar os dados e informações públicas, é possível realizar pesquisas utilizando Etiquetas (filtros) e formatos:

Infelizmente, nem todas as organizações distribuem as informações conforme as diretrizes dos dados abertos – ainda há muitos arquivos em PDF.

Nas minhas pesquisas para definição de um escopo, onde e quais dados seriam consumidos, acabei encontrando uma ferramenta do meu estado, o Paraná.

A ferramenta disponibilizada no site Portal de Transparência permite o consumo de “informações do tema e do assunto selecionado, de forma irrestrita e estruturada”. Exatamente como rege os princípios dos dados abertos.

Postas as considerações iniciais, mãos à obra!

Iniciando o projeto

Para dar inicio a criação do projeto utilizando o Angular 7, você pode instalar através do gerenciador de pacote NPM, a última versão.

Neste artigo você encontra o passo a passo mostrando como preparar o ambiente, o que é basicamente instalar o Node e logo em seguida abrir um terminal e digitar:

Espere finalizar o processo e informe no terminal:

> ng version

Instalado a versão 7:

O próximo passo é criar o projeto utilizando a ferramenta Angular CLI.

Para isso, ainda no terminal, certifique-se de posicionar o cursor no caminho de preferência de seus projetos. No meu caso, estou em:

Vamos informar:

> ng new

A novidade da versão é a interação do processo. Na verdade, nas versões anteriores bastava utilizar parâmetros na criação do projeto.

O console solicitará o nome do projeto:

Informei como transparencia-pr. Após o Enter, foi solicitada a possibilidade de incluir o arquivo de rota – coloquei Y.

Finalmente, o formato para usar estilos. Deixei como CSS.

Aguarde a finalização do processo, entre no diretório do projeto criado e execute o server através dos passos a seguir:

> cd transparencia-pr

> ng serve -o

Se tudo deu certo será aberto no navegador a seguinte página:

Finalizando, deixo o link de dois artigos nacionais sobre o Angular 7:

• a) Angular 7  – Novas Funcionalidades, por Thiago Adriano
• b) Angular 7, mas já?, por André Rodrigues

Além do blog oficial:

• Version 7 of Angular — CLI Prompts, Virtual Scroll, Drag and Drop and more

Na próxima parte criaremos os serviços que acessam os endponts do portal de transparência.

• Repositório no GIT

Até mais!