O ES NA PALMA DA MÃO é um programa do Governo do Estado do Espírito Santo que reúne iniciativas e serviços do Governo em plataforma móvel (aplicativo) e web, com unidade de experiência do cidadão. Por meio do ES NA PALMA DA MÃO, diversos serviços governamentais podem ser acessados através da web e dispositivos móveis (sistemas operacionais iOS e Android) utilizando uma interface comum.
==================================================================================
Essas são as principais ferramentas, frameworks e libraries que dão suporte ao projeto:
SystemJS é um carregador universal de módulos. Construído sobre o recém-lançado ECMAScript 2015, que torna mais fácil a modularização do código client side bem como o carregamento dinâmico desses módulo sobre demanda. Como a maioria dos navegadores ainda não implementa nativamente um sistema de carregamento de módulos, o SystemJS usa o ES2015 Module Loader Polyfill "por baixo dos panos" para preencher essa lacuna.
AMD e Commonjs ainda são os sistemas de módulos mais utilizados. SystemJS implementa adapters para esses sistemas de módulos de forma que permita a utilização de bibliotecas populares como AngularJS ou Lodash que ainda não utilizam a nova sintaxe de importação/exportação do ECMAScript 2015. Como SystemJS entende qualquer um desses formatos: ES6, CommonJS, AMD e global, ganha-se, junto com o carregamento assícrono que o SystemJS oferece, a flexibilidade de escrever o código na maneira que seja mais confortável para o desenvolvedor.
NPM é um excelente gerenciador de pacotes mas foi inicialmente projetado para ser usado no lado do servidor. Ainda não existe uma maneira direta de carregar módulos npm no browser em runtime. JSPM facilita esse processo e também sobrescreve algumas propriedades do package.json quando necessário, como por exemplo o campo main.
AngularJS é um framework estrutural para aplicações web dinâmicas.
O Router nativo do Angular vem com uma série de limitações, como por exemplo a ausência de suporte para views aninhadas. UI Router permite essa e muitas outras facilidades, e por isso tem se tornado, de fato, o router padrão das aplicações Angular.
UI Router Extras adiciona ainda mais funcionalidades para o router do UI Router. A mais importante delas é Future States a qual nos permite descrever, de forma abstrata, o que os states da aplicação são e onde o código para eles reside, sem na realidade carrega-lós. O state é então carregado tardiamente(lazy load) em runtime, quando o usuário tenta acessá-lo pela primeira vez. Permite, por exemplo, o carregamento de states definidos num arquivo JSON montado dinâmicamente.
Por padrão, o Angular nos obriga o carregamento de toda a aplicação antes da inicialização(boot). Isso funciona bem para aplicações pequenas. Para aplicações grandes, essa abordagem introduz um tempo alto de carregamento que impacta negativamente na experiência do usuário, além de obrigar o carregamento de partes da aplicação que não são acessadas com frequência pelo usuário. ocLazyLoad permite o carregamento de módulos para o Angular em tempo de execução.
Nem todas as features do ES2105 já são suportados pelos browsers. Babel nos permite desfrutar de todas as novas características da linguage hoje, covertendo código ES6 em código equivalente em ES5.
O automatizador de tarefas de build da aplicação. Veja as tarefas definidas para o projeto em Gulp tasks.
Cada gulp task é implementada como uma receita que pode ser reaproveitada. Cada uma dessas receitas reside no seu próprio arquivo, tornando mais fácil a navegação até seu código fonte, melhorando a mantenabilidade, bem como clarificando quais as dependências cada task possui.
$: gulp help
Exibe a lista de tasks definidas na aplicação, bem como suas descrições e opções de configuração.
$: gulp
Atalho para run
$: gulp run
Atalho para recompile ➔ eslint ➔ index.html ➔ serve ➔ watch
$: gulp recompile
$: gulp clean
Limpa diretório/arquivos para onde será copiada a aplicação compilada
$: gulp compile
Atalho para css ➔ html ➔ babel ➔ json ➔ assets
$: gulp css
Aplica transformações(autoprefixer) no CSS e copia para pasta destino.
$: gulp html
Copia arquivos .html para pasta destino.
$: gulp babel
Compila ES6 => ES5 e copia para pasta destino.
$: gulp json
Copia arquivos .json para pasta destino.
$: gulp assets
Copia imagens e fontes para pasta destino.
$: gulp eslint-src
Realiza uma análize de qualdade de código Javascript da aplicação usando ESLint. Verifica se o código se conforma com o code style Idiomatic Code Style e exibe erros e warnings.
$: gulp eslint-gulp
Realiza uma análize de qualdade do código relacionado a automação de build (gulpfile, gulp tasks, etc) usando ESLint. Verifica se o código se conforma com o code style Idiomatic Code Style e exibe erros e warnings.
$: gulp index.html
Copia o arquivos principa da aplicação index.tpl.html para pasta destino e o renomeia para index.html.
$: gulp serve
Inicia um servidor nodemon para servir a aplicação com browser Sync configurado.
$: gulp watch
Inicia um watcher que compila a aplicação sempre que o código muda.