Como Fazer Um Filtro Em Uma Tabela Com Angular

Começando uma série de melhorias que podemos fazer para trazer uma melhor experiência para o usuário, irei demonstrar como podemos fazer um filtro pelo Angular(2+) em uma tabela, de forma rápida e eficiente!
Este filtro percorrerá todas as colunas da tabela, procurando pelo valor que inserido dentro do input e retornar todos os resultados que correspondem! Desta forma, se tivermos os mesmos valores em colunas diferentes, aparecerá igualmente!

Iremos utilizar o componente ng2-search-filter, esta dependência funciona perfeitamente com Angular 2, 4+.

Ler mais

For of - Como Fazer Uma Condição De Parada No for No Javascript

Digamos que você tenha um objeto e que caso dentro desse objeto, contenha um determinado valor, deve retornar imediatamente um novo valor. Para isto, você pode pensar em utilizar um for com alguma condição para “quebrar” seu laço de repetição, mas por que não utilizar a declaração for... of?

O for of cria um loop a qual itera objetos, inclusive: Strings, Array, Map, Set. Assim como o for, forEach, o for of itera cada elemento porém com uma diferença que pode ser o essencial para resolver seu problema: você pode quebrar seu laço com o break.

Ler mais

Acessando Objetos Com Espaço No Javascript

Normalmente, acessamos os valores de um objeto javascript através de “.” (ponto), por exemplo, temos o seguinte objeto:

1
const user = { name: "Victor", idade: 22 };

Para resgatar o valor name, bastaria acessar usando: user.name, correto? Mas você sabe como acessar caso a chave do seu objeto tenha caracteres especiais ou espaços, como no exemplo abaixo?

1
const address = { Endereço: "Rua Nova", "Descrição Rua": "Uma rua nova" };

Ler mais

Alterando a Cor Do Texto Do Placeholder

Esses dias, estava construindo um input com background-color transparente e o conteúdo que estava atrás era justamente a mesma cor que o texto do placeholder! Obviamente, não seria legal deixar assim, afinal, não dava para ler nada! Mas, como alterar a cor do placeholder de um input? Pesquisando sobre isso, me deparei com o pseudo-elemento ::placeholder! Neste post, vou mostrar como usar esta propriedade de forma rápida e sem enrolação!

Ler mais

Quais as Principais Diferenças HTTP/1 E HTTP/2

Basicamente, HTTP é um conjunto de padrões que permite que um usuário da internet possa trocar informações com o site. Desde sua primeira versão, em 1991, contamos com quatro tipos de interações HTTP, que são: GET, HEAD, PUT e POST.

O HTTP/1.1 é a terceira versão e ficou sem nova atualização por quase duas décadas, até que em 2015, com os avanços dos sites, cada vez ficando mais complexos e o surgimento de aplicações web mais poderosas, foi lançado uma nova versão, o HTTP/2, que teve foi uma evolução do protocolo SPDY. Epa, Perai! Não estávamos falando de HTTP? Que raios é esse tal de SPDY?

Ler mais

Como Criar Environments No Angular

Você já precisou testar sua aplicação em ambientes diferentes, com bases diferentes mas com o mesmo front, no Angular? Você poderia alterar a URL base para que sua aplicação conecte-se em outras bases, mas isso seria viável? Com isso, você poderia esquecer de voltar a variável e acabaria commitando ou cansaria de trocar a todo momento. Pensando nisso, porque não criar environments diferentes no Angular, um para cada tipo de base ou ambiente?

Criando um novo ambiente

Primeiramente, é necessário alterar seu arquivo angular.json, que fica dentro da raiz do seu projeto, adicionando algumas configurações do novo environment que você está configurando.
Dentro do seu JSON, procure por configurations e em cima de production:

Ler mais

Fundamentos Do Teste De Software - Teste & Qualidade E Quanto Testar?

Teste é sinônimo de qualidade? Se testarmos o software, teremos qualidade?
Vamos tomar a definição de qualidade:

Qualidade: é o grau até o qual um componente, sistema ou processo, atende aos requisitos especificados e/ou às necessidades e expectativas do usuário ou consumidor.

Tendo essa definição, podemos dizer:

  • O teste por si só não constrói a qualidade do software
  • Tem a função de ajudar a medir a qualidade
  • Pode fornecer confiança na qualidade
  • Testes bem desenhados e executados reduzem os riscos de falhas

Avaliando a qualidade

Podemos afirmar que quanto menos defeitos encontrados, melhor será a qualidade do software?

Ler mais

Fundamentos Do Teste De Software - Falha, Defeito E Erro

Até um tempinho atrás, metade dos anos 90, poucas empresas utilizava softwares o que atualmente é raro! Softwares estão presentes em quase todos os lugares, na padaria de bairro até grandes e poderosos estabelecimentos como aeroportos, bancos. E todos nós já passamos por algum tipo de falha de software como insdisponibilidade de software e sites, lentidão, etc.

Quando falhas ocorrem

Softwares que não funcionam corretamente, podem levar a muitos problemas como prejuízos financeiros, perda de reputação, risco em relação a integridade física das pessoas, multas contratuais… E até consequências maiores como lesões corporais e mortes (softwares aeronáuticos por exemplo) e até desastres tecnológicos como um mal funcionamento de um sistema de controle de mísseis!

Porque falhas ocorrem

Todos os produtos de desenvolvimento de software, desde a especificação e requerimentos até a documentação geral, são escritos por pessoas, e as pessoas são propensas a cometer erros, independentemente de suas experiências e qualificações. Podemos listar outros itens como:

Ler mais

Como Otimizar Tarefas Com O Gulp

Alguns dias atrás, comentei sobre algumas técnicas para melhorar a performance de seu site e nele comentei sobre o Gulp, que serve para automatizar diversos processos repetitivos que desenvolvedores precisam realizar em seu dia-a-dia, de uma maneira simples e rápida! Mas afinal, como criar um script automatizador de tarefas com Gulp?

Instalação

Para utilizar o Gulp, é necessário ter instalado o NodeJS, com ele você consegue rodar o comando npm para instalar o gulp:

1
npm install -g gulp

Criando seu primeiro script de automatização

Para servir como exemplo, vamos pegar a dica dada antes, sobre minificação. O gulp requer um arquivo chamado gulpfile.js, esse arquivo conterá o script com a funções de minificação. Para isso, criei uma estrutura simples, como exemplo abaixo:

Estrutura de Arquivos - Gulp

Ler mais