Você já ouviu falar sobre HTML semântico?
Ou marcação semântica?
Atualmente, com a evolução do HTML, tornou-se frequente ouvirmos falar
sobre desenvolvimento de HTML semântico.
Isto significa que passamos a usar elementos HTML pelo o que eles são
e deixamos de lado a construção das tags pensando apenas no lado visual.
Você sabia que existe uma pseudo-classe chamada empty?
Ela representa um elemento que não possui nenhum filho, isto é
elementos que estejam dentro desta tag.
Você conhece?
Uma das coisas mais poderosas e enriquecedora que podemos fazer em nossas
aplicações web é adicionar validações em nossos formulários.
De forma com que o utilizador do sistema consiga identificar
rapidamente o que está fazendo de errado ou o que está faltando.
Para isso, podemos fazer algumas modificações em nosso CSS,
aplicando estilos para quando os formulários possuem algum erro.
Neste exemplo, vamos mostrar como aplicar um estilo em um input obrigatório,
alterando sua cor quando não preenchido!
O processo de desenvolvimento de um site envolve muitas coisas
Planejamento, desenho de um wireframe, organização dos elementos nas páginas
Construção do código de forma semântica, acessível e organizado
E após termos tudo devidamente construído, precisamos colocar esse nosso site em algum lugar
As vezes, não queremos gastar dinheiro nisso
Pode ser que uma hospedagem gratuita apenas para demonstração para o cliente seja o suficiente.
Mas existe algo gratuito assim? A resposta é sim!
Em nosso desenvolvimento web, é comum precisarmos passar parâmetros de uma página para outra.
Uma das formas de fazermos isso, é passando diretamente pela URL algum ID
Com o Angular, conseguimos fazer isso de uma maneira muito simples!
Primeiramente, precisaremos editar nosso arquivo de rotas:
Quando estamos desenvolvendo, devemos nos preocupar em como a informação será apresentada na tela
Nossos sistemas normalmente contém algumas imagens, seja elas estáticas (aquela que nós mesmo inserimos o endereço da foto)
Quanto também imagens que foram enviadas pelo próprio usuário (foto de perfil, por exemplo)
E obviamente, não queremos que nosso layout fique quebrado por um erro na imagem, certo?
Pensando nisso, você sabia que a tag img aceita um evento chamado onerror?
Uma das coisas mais comum que acontece no desenvolvimento diário é a necessidade de adicionar um token de uma API.
Frequentemente, quando precisamos fazer uma chamada API, é comum pedir que passe esse token como parâmetro na URL, no header, etc.
Entretanto, deixar nosso token exposto dentro do código e consequentemente em nossos repositórios, é uma péssima coisa!
Afinal, onde fica a segurança nisso?
Mas você sabia, que você pode acessar suas variáveis de ambiente para ler um valor e injetar dentro do código?
Com isso, você não se expõe e tudo continua funcionando normalmente!
Cada linguagem tem um modo de acessar essas variáveis, e hoje vamos ver como fazemos isso com o NodeJS
Um desenvolvedor tem em seu cotidiano o git constantemente.
Em diversos momentos, trabalhamos com branches, modificamos arquivos, criamos novas estruturas.
E precisamos trazer para nossa MASTER as mudanças que realizamos em nossas branches.
Este ato de trazer as mudanças é chamado de merge
Então, como realizamos um merge da nossa branch para master?
Você acaba de desenvolver uma aplicação super bacana em Angular e deseja mostrar para todos.
Mas onde subir sua aplicação? E como?
Podemos utilizar uma plataforma muito conhecida, chamada Heroku, que é uma plataforma em nuvem para implantação e execução de aplicações.
Com ele, conseguimos fazer o deploy de nossa aplicação facilmente e inclusive configurar um deploy contínuo com Github em apenas um clique!
Para fazermos isto, precisamos de algumas coisas:
Você sabia que você consegue alterar o estilo de um input, podendo adicionar o estilo que quiser, mas mantendo as propriedades de um input?
Como por exemplo, um input do tipo file, ter a forma de um botão com uma imagem/ícone.
Desta forma, conseguimos manter o estilo da nossa página e conseguimos manter o comportamento padrão do componente!