Recursos frescos para web designers e desenvolvedores (junho de 2016)

Estamos expandindo a lista para a edição do meio do ano. Esta parte apresenta algumas CLIs (e aqui está o nosso post sobre por que você deve aprender a linha de comando), um aplicativo de desktop para trabalhar e diversão, além de várias bibliotecas CSS e JavaScript. Também estão incluídos materiais de leitura, referências e guias sobre práticas recomendadas que você deve verificar, marcar como favorito e possivelmente ler um dia.

Eu não vou estragar o resto da lista, então você vai. Para mais recursos frescos, clique aqui.

Clique para mais recursos

Encontre toda a nossa coleção de recursos recomendados e as melhores ferramentas de web design e desenvolvimento disponíveis.

CertBot

CertBot fornece uma maneira mais prática de implantar certificados do Let's Encrypt. Ele fornece um conjunto de linhas de comando com suporte para várias configurações de servidor, como Apache, NGINX e Plesk. Falando nisso, Let's Encrypt é um esforço comum para tornar a Web mais segura, fornecendo um certificado SSL gratuito. Atualmente é usado em mais de 3 milhões de sites.

Mononoki

Mononoki é uma fonte projetada especificamente para exibir código. Mononoki está disponível como uma fonte de desktop instalável (.ttf) e fonte web (.eot, e .woff). É uma nova alternativa ao clássico monotipos como Monaco, Menlo e Courier.

BideoJS

Mostrar um vídeo de reprodução automática de página inteira na página inicial parece ser uma tendência crescente. BideoJS é uma biblioteca JavaScript que permite fazer exatamente isso com menos barreiras. É leve, responsivo e pode ser configurado para atender às suas necessidades.

Limpeza de CSS

Limpeza de CSS é uma coleção de referências, artigos e estatísticas para CSS. Uma informação engenhosa como essa pode ajudá-lo a tomar decisões bem informadas sobre quais metodologias, ferramentas e estrutura de CSS você gostaria de adotar em seu projeto.

Mailgen

Mailgen é um módulo Node para gerar um e-mail em HTML responsivo simples e agradável. Um punhado de opções é fornecido, permitindo que você personalize quase todas as áreas do email. Você pode definir o email “tema”, o cabeçalho do email e o “Apelo à ação” botão. Também pode ser integrado ao seu desktop ou aplicativo da Web baseado em Node.

Deco

Deco é um IDE para criar um aplicativo móvel usando a iniciativa Facebook React Native. Pense em Deco como o XCode ou o Visual Studio, onde você pode criar um aplicativo com uma interface amigável usando arrastar e soltar, controles deslizantes e selecionadores de cores.

IE8 Linter

O Internet Explorer 8 (IE8) é um navegador antigo que não oferece suporte a tecnologias da Web modernas, como Animações CSS3, Transformações, Transições e a maioria dos elementos HTML5 sem um polyfill. O princípio DRY é uma ferramenta que podemos usar para verificar sites da Web para compatibilidade com o IE8. Fornece o relatório e as soluções.

Caprino

Caprino é um aplicativo de desktop não oficial do Facebook Messenger. Ele é construído sobre o Node.js e o Electron, o que permite que ele seja um aplicativo de plataforma cruzada; está disponível no OS X, Windows e Linux. Em também vem em duas cores, Dark and Light.

Kit de fótons

Kit de fótons é um framework para iniciar um novo aplicativo com o Electron. Muito parecido com Bootstrap, Foundation e os gostos, Photon vem com um número de componentes que permite que você crie elementos de interface do usuário comuns em um aplicativo como os botões, barra de ferramentas e barra lateral.

Yeoman App

Yeoman App é um aplicativo de desktop que gera boilerplates, framework e scaffolds do projeto da Yeoman. É uma boa alternativa para aqueles que não se sentem confortáveis em trabalhar através de terminais e linhas de comando..

SQLectron

SQLectron é um cliente de desktop SQL que permite visualizar e executar várias operações SQL de maneira mais conveniente. Suporta MySQL, PostgreSQL e Microsoft SQL Server. SQLectron está disponível para OS X, Windows e Linux.

SCSS da família

FamilySCSS é uma coleção de mixins que faz a seleção de elementos com : n-filho mais intuitivo. Os mixins são declarativos. Por exemplo, você pode escrever @incluir primeiro (3) para selecionar os três primeiros elementos filhos e escrever @incluir entre (2, 4) para selecionar o segundo para o quarto filho elementos.

EasyEngine

O EasyEngine é uma coleção de linhas de comando que permitem configurar o WordPress com ferramentas e módulos, como Redis, plug-in de cache e PageSpeed. Faz a configuração do servidor WordPress para a velocidade de uma brisa.

Phinx

Phinx é um módulo PHP para gerenciamento e migração de banco de dados. Ele vem com classes e linhas de comando que permitem que você execute praticamente qualquer operação de banco de dados, como escrita, download e upload. Phinx Docs é uma referência engenhosa para ajudar você a começar.

RichCSS

RichCSS é uma estrutura CSS que fornece uma estrutura sã. O framework organiza ordenadamente pastas, diretórios e classes de uma maneira pró-DRY que permite que seja reutilizável. Sobre os botões, listas e formulários, o RichCSS também vem com sua própria CLI que você pode usar para iniciar um novo projeto Rich como o Bower, Git e NPM.

Frend

Frend é uma coleção de componentes comuns da web. A coleção atualmente consiste em Accordion, Dialog Modal, Offcanvas, Tooltip, Tabs, com mais alguns para vir na próxima versão. Frend poderia ser uma boa alternativa para jQuery UI.

FLA

Esta é uma estrutura abrangente para criar um layout de grade responsivo com o Flexbox.

PHP o caminho certo

PHP é uma linguagem de programação que é fácil de aprender, mas você também pode facilmente errar com os códigos e isso pode comprometer a segurança e o desempenho do seu site.. PHP o caminho certo é uma referência extensa para aprender as melhores práticas em PHP.

Estabilidade

Estabilidade é uma biblioteca CSS para criar um sistema de classificação por estrelas com um feedback animado. A classificação por estrelas é construída tendo em mente a acessibilidade; você pode navegar e atribuir estrelas pelo teclado.

WaitAnimate

WaitAnimate é uma ferramenta da Web útil para calcular “pausa” tempo em uma única animação CSS @keyframe. o “pausa”, quando feito corretamente, poderia tornar a animação mais envolvente - aqui estão alguns exemplos.