Recursos frescos para web designers e desenvolvedores (abril de 2018)
Este mês vimos alguns anúncios de nomes notáveis em tecnologia. Por exemplo, a Apple abriu um novo sistema de banco de dados, o Google lançou uma nova ferramenta para medir a velocidade do seu site em dispositivos móveis, e o Github com um curso gratuito para você começar com Git, Github e codificação em geral..
Além disso, no post de hoje, eu também vou apresentam uma série de novas ferramentas que estão atualmente em ascensão. Vamos pular para o que temos mais na lista.
VuePress
Uma nova ferramenta do criador do Vue, o VuePress é um gerador de site estático projetado com o Vue.js em mente. Ele gera e pré-renderiza HTML estático para cada página e funciona como um SPA (aplicativo de uma única página). Ele vem com alguns recursos prontos para uso, incluindo a capacidade de adicionar o ID do Google Analytics, pesquisa, navegação anterior e anterior, barra lateral e PWA.
IMG-2
Uma biblioteca JavaScript que apresenta um elemento personalizado, img-2
. O novo elemento adiciona várias otimizações que não vêm com o padrão img
elemento, melhorando como a imagem é carregada para os usuários. Com o elemento personalizado, a imagem será pré-armazenada em cache, também carga preguiçosa as imagens e o serviço sairão do cache apenas quando as imagens entrarem na viewport do usuário. Confira a demonstração.
Tabler
Um painel de controle / painel de administração elegante baseado no Bootstrap 4. O painel apresenta componentes pré-fabricados, como gráficos, formulários, galerias, uma tabela de preços e um bom coleção de ícones personalizados. Um excelente ponto de partida para permitir que os desenvolvedores criem um painel de administração rapidamente. Confira a demonstração!
DayJS
DayJS Biblioteca JavaScript para formatar datas e horas. Ainda mais, o DayJS apresenta APIs semelhantes ao Moment.js, mas pesa apenas 2Kb. Dado isso, poderia ser um ótima alternativa para Moment.js, Se você gostaria de uma biblioteca mais leve ainda manter a familiaridade do que você já conhece.
UnifiedArchive
Uma biblioteca PHP para lidar com arquivos compactados, o UnifiedArchive suporta uma ampla gama de formatos, incluindo RAR, Zip, Gzip, Alcatrão, e muitos outros tipos de compactação. Com esta biblioteca, você pode arquivar e extrair arquivos ou diretórios. Ele fornece uma um punhado de APIs para manipular arquivos depois de ter sido extraído do arquivo. O UnifiedArchive está disponível como um pacote do Composer.
Laboratório de Aprendizagem do Github
O Github acaba de anunciar um curso gratuito cobrindo principalmente Git no Github. Existem 5 cursos no momento em que você pode aprender algumas coisas úteis, como como usar o Github para hospedar seus códigos, como usar páginas do Github para obter um site ou blog gratuito para o seu projeto e como gerenciar conflitos de mesclagem que são comuns quando você trabalha com muitos desenvolvedores em um projeto.
WordPress UnitTest DOM Parser
Uma boa dica de Takayuki Miyauchi em testando DOMElement ao executar UnitTest em aplicativos WordPress. Eu pessoalmente achei isso realmente útil; espero que você ache o mesmo.
Popmotion
Uma biblioteca JavaScript para uma animação suave e amanteigada na web, “Popmotion” fornece uma API chamada Physics que permite criar com efeitos de animação quase reais. É unopiniated; a biblioteca simplesmente gera valores com base no conjunto específico da configuração. Isso permite que você aplique essas saídas para animar qualquer mídia, incluindo CSS, SVG, Three.js e até mesmo React.js.
Driver.js
Uma biblioteca JavaScript que permite que você “dirigir” foco do usuário em uma página. Isso é particularmente útil se você quiser introduzir recursos específicos ou orientá-los para tarefas específicas na página. Driver.js é apenas 4 KB de tamanho, personalizável e amigável ao teclado.
Substituir o GIF animado por vídeo
GIF está em toda parte, depois de ter feito uma grande volta. Mas o problema do GIF é que normalmente é muito grande. É um desperdício de largura de banda, mas a qualidade gráfica é muitas vezes terrível. este diretriz do Google mostra como “Vídeo” pode substituir o GIF para mostrar gráficos animados.
Máscara de texto
Uma biblioteca JavaScript para Transformar o texto que requer formatação especial como um número de telefone, moeda ou um número de cartão de crédito. Conforme o usuário está digitando, o texto será automaticamente transformado em sua formatação apropriada, melhorando a experiência do usuário. TextMask pode ser usado com o React, o Vue ou simplesmente o JavaScript antigo.
Comparar a velocidade do site para celular
Esta é outra ferramenta útil do Google. Esta ferramenta permitirá que você verifique a velocidade do seu site ao carregar a partir do celular e estimar a perda total de receita quando o site carrega devagar. Você pode selecione o país e a velocidade dos quais seu site será testado contra.
VueNut
Um parceiro de desenvolvimento ao criar um aplicativo da Web com Vue.js e Vuex, o VueNut o torna mais fácil de explorar o estado dos dados armazenados e permite manipular os dados durante o desenvolvimento facilmente. Coisas legais!
FoundationDB
Recentemente a Apple fez o FoundationDB open source no Github. É um sistema de banco de dados de par de valores-chave que promete escalabilidade e desempenho. É legal ter grandes empresas de tecnologia começando a dedicar ao código aberto alguns de seus produtos.
Livros de história
StoryBooks é uma ferramenta para criar um componente React em isolamento. Ele fornece uma interface do usuário no navegador, permitindo que você visualize os diferentes estados de cada componente, bem como testar os componentes.
GhostText
Uma extensão do navegador que irá sincronizar o que você escreve no navegador para o seu editor de texto ou vice-versa. Eu achei isso útil em última análise, se você gostaria de poder escrever em um site com a conveniência e os recursos do seu editor de código. O GhostText está disponível para o Chrome, Firefox e Opera.
Coala
Coala é um CLI fornecendo uma interface para linting e correção de código, independentemente dos idiomas usados. Você pode usar o Coala em um editor de código, integrá-lo a um CI (Integração Contínua) e personalizá-lo com uma sintaxe de configuração .coquete
. Coala suporta muitas linguagens como CSS, JavaScript, PHP, e você pode encontrar mais neste diretório.
ReactStrap
ReactStrap é uma coleção de componentes do Bootstrap 4 transformados em componentes React reutilizáveis. Se você gostaria de modernizar seu site antigo baseado em Bootstrap, esta biblioteca é algo que você pode querer olhar para.
Reacto
Outra ferramenta relacionada ao React, o Reacto é um IDE construído em cima do Electron e projetado para desenvolver aplicativos da Web com o ReactJS. Isso parece muito útil se o seu desenvolvimento primário gira em torno de ReactJS.
PicoJS
Uma biblioteca JavaScript que permite a detecção de rosto. Funciona com uma foto estática ou a partir da câmera integrada. É realmente fascinante como a tecnologia web evolui nos últimos anos.