Frameworks e Bibliotecas

Sencha Ext JS

image.png

Usado para a construção de módulos e recursos do illi

O Ext JS 4.2 é uma biblioteca de componentes JavaScript de código aberto que fornece ferramentas para criar aplicativos da web escaláveis e ricos em recursos. Ele inclui um conjunto abrangente de componentes de interface do usuário, como grade de dados, formulários, árvores e gráficos, além de recursos avançados, como vinculação de dados, arquitetura de aplicativos MVVM(Model-View-ViewModel) e gerenciamento de estado do aplicativo. Com o Ext JS 4.2, os desenvolvedores podem criar aplicativos da web complexos e interativos que funcionam em todos os principais navegadores e dispositivos, incluindo desktops, tablets e smartphones.

Links: Acesse a documentação! Assista o curso gratuito EXTJS 4

Quasar Framework

image.png  

Usado para a construção de aplicações illimitar mais recentes.

O Quasar Framework é um framework de código aberto baseado em Vue.js que permite aos desenvolvedores criar aplicativos da web, aplicativos móveis e aplicativos de desktop com uma única base de código. Ele inclui um conjunto abrangente de componentes reutilizáveis de interface do usuário, como botões, formulários, layouts e gráficos, além de recursos avançados, como suporte a PWA, roteamento e gerenciamento de estado do aplicativo. Com o Quasar, os desenvolvedores podem criar aplicativos em vários formatos e plataformas com um alto grau de personalização e flexibilidade, tornando-o uma opção popular para desenvolvedores que desejam criar aplicativos modernos e escaláveis.

Links: Acessar Documentação/Treinamento interno Arquitetura quasar/Acesso ao endpoint /Criando Projeto Quasar Cli / Introdução Quasar Framework 1.0

Pinia

image.png

Usado em conjunto com quasar para a construção de aplicações illimitar mais recentes.

Pinia é uma biblioteca oficial de gerenciamento de estado para aplicações Vue.js. Ela oferece uma abordagem leve, intuitiva e segura para tipagem na hora de gerenciar o estado da sua aplicação, tornando-se uma escolha popular entre desenvolvedores Vue.

Links: Assistir Curso de Pinia / Acessar Documentação

Ionic 1

image.png

Usado para a construção de aplicações do Gestor.

O Ionic 1 é um framework de código aberto baseado em AngularJS e Apache Cordova que permite aos desenvolvedores criar aplicativos móveis híbridos para iOS, Android e Windows Phone usando tecnologias da web, como HTML, CSS e JavaScript. Ele inclui um conjunto abrangente de componentes de interface do usuário, como botões, menus, listas e formulários, além de recursos avançados, como roteamento, suporte a PWA e integração com serviços em nuvem. Com o Ionic 1, os desenvolvedores podem criar aplicativos móveis com uma experiência de usuário rica e fluida, combinando o melhor dos aplicativos nativos e da web. O Ionic 1 foi muito popular em seu tempo e é ainda utilizado por algumas empresas, embora seja uma versão mais antiga do framework.

Ícones

Os ícones podem ser utilizados em botões quando se deseja reforçar visualmente uma ação ou acionar uma função do sistema. Para agilizar o desenvolvimento, nós usamos por padrão algumas bibliotecas de ícones.

Icons8

Usado para a construção de módulos e ferramentas do illi

Os ícones do icons8 possuem diversas categorias e coleções, no illi nós usamos os ícones da coleção color. Para incluir um novo ícone você deve percorrer o caminho: extras -> frontend -> resources -> css -> default -> icones.css

No documento icones.css você deve incluir uma classe com o código em formato base64 da imagem.

.icons8-More-Than, .ux-rangemenu-gt {

background-image: url ( data:image/png;códigobase64, ) !important ;

background-size: 16px;

}

Links: Acessar Icons8 na coleção color  

 

Material Icons

Usado para a construção de aplicações desenvolvidas com quasar

Links: Acessar biblioteca Materials Icons

 

Ionicons

Usado para a construção de aplicações do illiGestor

Links: Como usar ícones no Ionic / Acessar biblioteca de ícones Ionic

Variáveis de cor

A definição de variáveis de cor é uma etapa fundamental ao trabalhar com frameworks de desenvolvimento de aplicativos, como Quasar, Ionic 1 e Sencha. Esses frameworks oferecem recursos que permitem personalizar a aparência visual dos aplicativos por meio do uso de variáveis de cor. Este guia tem como objetivo fornecer uma breve documentação sobre como definir variáveis de cor em cada um desses frameworks.

 

Quasar Framework

Crie um arquivo de variáveis no Quasar, as variáveis de cor são definidas em um arquivo chamado quasar.variables.styl. Se esse arquivo ainda não existir no seu projeto, crie-o na pasta src/css/. Defina as variáveis de cor: Abra o arquivo quasar.variables.styl. Declare as variáveis de cor no formato nome-da-variavel = valor.

$primary: #1379df;

$secondary: #5cadff;

$accent: #0060bf;

$light:#f5f9ff;

$dark: #121314;

$positive: #21ba45;

$negative: #c10015;

$warning: #f2c037;

$info: #0060bf;

 

Links: Saiba mais acessando a documentação do Quasar

 

Ionic

Crie um arquivo de variáveis: No Ionic 1, as variáveis de cor são definidas em um arquivo chamado ionic.app.scss. Se esse arquivo ainda não existir no seu projeto, crie-o na pasta raiz do seu projeto Ionic. Defina as variáveis de cor: Abra o arquivo ionic.app.scss. Declare as variáveis de cor no formato $nome-da-variavel: valor.

$light: #FFFFFF;

$stable: #F7F7F7;

$positive: #0076EF;

$balanced: #21C65B;

$energized: #FFC029;

$assertive: #F43A36;

$royal: #7662E3;

$dark: #3C3C3C;

Links: Saiba mais acessando a documentação do Ionic

 

Sencha 4

Crie um arquivo de variáveis: No Sencha, as variáveis de cor são definidas em um arquivo chamado variables.scss. Se esse arquivo ainda não existir no seu projeto, crie-o na pasta sass/ do seu projeto Sencha. Defina as variáveis de cor: Abra o arquivo variables.scss. Declare as variáveis de cor no formato $nome-da-variavel: valor,

$primary-color: #ff0000;

$secondary-color: #00ff00;