Recursos frescos para web designers e desenvolvedores (outubro de 2018)

Ao contrário de qualquer outra indústria, o desenvolvimento da web está mudando aos trancos e barrancos. Existem novas ferramentas, métodos e frameworks desenvolvidos quase todos os dias para atender novas tendências e avanços tecnológicos na indústria da web.

Então, aqui está uma lista das ferramentas e recursos mais recentes, incluindo uma estrutura PHP para executar facilmente Teste E2E para seu aplicativo PHP, uma ferramenta para gerar cores em conformidade com os padrões de acessibilidade do W3C e um punhado de extensões Vue.js. Vamos pular para ver a lista completa.

Keyframes App

Um aplicativo baseado na web fornecendo uma boa GUI para compor animação CSS e visualize a animação com uma linha do tempo. O aplicativo também permite que você baixe a saída CSS quando estiver satisfeito. Keyframes CSS não é a especificação mais fácil em CSS, então ter um aplicativo como este seria definitivamente uma economia de tempo.

Pantera Symfony

“Pantera Symfony” é uma incrível estrutura PHP do Symfony para executar o teste E2E (End-to-end). Vem com o seu servidor web embutido e poderia aproveitar o Chrome instalado em seu computador para realizar o teste E2E.

Além disso, suporta Execuções JavaScript, captura de captura de tela, driver personalizado Selenium, Cliente Chrome e Firefox. Sendo um framework independente, você pode incluir o Panther em qualquer projeto PHP como, por exemplo, WordPress, Joomla, etc.

TrendyPalettes

Uma coleção de belas paletas de cores. A coleção oferece milhares de paletas de cores escolhidas a dedo. Os usuários podem enviar uma nova paleta de cores, portanto, sempre haverá novas paletas adicionadas a cada dia. O TrendyPalettes também está disponível como uma extensão do Chrome.

Eagle.js

Eagle.js é uma estrutura para criar slides criados sobre o Vue.js, para que você possa reutilizar facilmente os componentes Vue.js personalizados nos slides. O slide também suporta navegação por teclado e mouse, estilo ou tema personalizado, widgets interativos e fornece um clichê para ajudar a configurar e apresentar o slide rapidamente. Pode ser um ótimo alternativa ao Reveal.js, especialmente se você já estiver familiarizado com o Vue.js.

Grape.js

O GrapeJS é um construtor da Web de código aberto que permite criar páginas da Web simplesmente arrastando e soltando componentes. Ele fornece alguns componentes comuns como Texto, Imagem, Vidoe, Colunas, Mapa, Citação, etc. Você pode exportá-lo para HTML e CSS e a saída é incrivelmente limpa, ao contrário de algumas ferramentas similares que eu tentei antes. Confira a demonstração.

Vapid

O Vapid é um novo CMS criado com o Node.js com uma abordagem interessante e exclusiva. A maioria dos CMS, supondo que você gostaria de incluir um novo tipo de dados, precisará primeiro definir a entrada personalizada na área do Painel / Admin.

Com o Vapid, é o oposto como você pode definir o modelo, e o Vapid irá gerar automaticamente a entrada na área Dashboard / Admin. Está disponível como um pacote NPM.

Notificação WP CLI

O nome diz tudo. É um pacote WP-CLI personalizado para exibir as notificações do sistema operacional quando o WP-CLI já estiver sendo executado. Muito chique.

CSSGr.id

Um aplicativo baseado na web para compor CSS Grid. Você pode configurar o número de itens, colunas, a lacuna entre cada item, bem como a extensão de cada item e, em seguida, gerar o código HTML e CSS. O CSS Grid é uma daquelas especificações de CSS que não é fácil de entender. Mas esta ferramenta torna muito mais fácil lidar com isso.

Dica de rolagem

ScrollHint é uma biblioteca JavaScript que permite criar um elemento por cima para mostrar que uma seção em sua página da Web é rolável. Isso é particularmente útil se você tiver um elemento de rolagem horizontal na sua página da Web, pois a maioria das pessoas não está rolando naturalmente da esquerda para a direita (ou vice-versa) ao consumir a Web..

PristineJS

Uma biblioteca JavaScript para adicionar validação a uma entrada. HTML5 vem com algum tipo de validação já com o “type = email”, e “type = number” por exemplo. Mas se você precisar de um validador personalizado que não está implementado em HTML5, esta biblioteca JavaScript será útil.

SelectionJS

A maioria das pessoas provavelmente já está familiarizada sobre como selecionar várias pastas ou arquivos em seus computadores; eles normalmente mantêm o clique do mouse e o arrastam pelos arquivos ou pastas que gostariam de selecionar. Se você quiser aplicar o mesmo UX em seu site, o SelectionJS será útil.

Webdash

Webdash é uma ferramenta que pode exibir seu projeto na interface GUI. Ele se conecta através do package.json arquivo no seu computador. Por isso, pode exibir a lista do Pacotes NPM, atualize o pacote, os scripts registrados, execute o script, e visualizando os arquivos README diretamente do Webdash. Muito impressionante!

CanJS

Um framework JavaScript para construir interface web. É semelhante ao React.js com alguns recursos adicionais e vem com o roteador, Utilitários DOM e função AJAX diretamente da caixa. Ele também tem um apoio comunitário bastante ativo fornece algumas extensões.

CheerioJS

Uma biblioteca JavaScript que implementa a especificação do jQuery Core para DOM (Document Object Model) e foi projetada para ser usada no lado do servidor. Se vocês são trabalhando com o Node.js enquanto também desfruta da sintaxe do jQuery gostar addClass (), attr (), e encontrar(), este é o JavaScript que você está procurando.

Caixa de Cores

O Colorbox é uma iniciativa do Lyft para gerar uma composição de cores que esteja em conformidade com o padrão Accessiblity. A ferramenta é alimentada por um algoritmo inteligente que permite que você simplesmente mova o botão, mude a configuração, e irá gerar as cores adequadas para você. É incrível.

Propriedades digitadas no PHP 7.4

PHP7.3 está ao virar da esquina, como mencionamos na edição anterior. Mas PHP7.4 já está no plano. Um dos planos é propriedade digitada. Isso significa que em breve você será capaz de escreva algo como int $ id público; na sua classe PHP. É uma grande mudança que poderia ajudar consideravelmente a reduzir seus erros de aplicativo PHP.

Estêncil

Um compilador JavaScript que facilita a criação de Web Components com o padrão mais recente. Além disso, o StencilJS também está adicionando algumas abordagens modernas de desenvolvimento web na mistura, incluindo Suporte a JSX, reatividade, roteador e gerenciamento de estado usando um plugin.

Vue Infinito Carregando

Uma extensão do Vue para criar uma página de rolagem infinita. É compatível com dispositivos móveis e compatível com qualquer elemento rolável. Ele também suporta duas direções de rolagem, e o melhor de tudo, economiza muito tempo.

V Prancheta

Uma extensão Vue.js personalizada que faz com que seja fácil criar um “cópia de” botão. Você pode simplesmente adicionar um v-clipboard atribuir a um botão e está tudo pronto. Esta extensão Vue.js funciona para todos os navegadores modernos, bem como para o IE11 e as mais recentes.

Vue Select

Um componente Vue.js que fornece funcionalidade semelhante a Select2. Ele é projetado para o Vue.js que permite ser Compatível com Vuex, Custom Templating, e um monte de outras coisas do Vue.js.