Svelte comparado com React e Vue
Svelte é o novo prodígio entre frameworks front-end! Leia mais e saiba o que é o Svelte, sua sintaxe, como começar a usar e muito mais.
js-cookie para cookies com JavaScript
js-cookie é uma biblioteca JavaScript para trabalhar com cookies de maneira simples e eficiente. Saiba mais sobre esta poderosa lib para controlar cookies.
Glider.js: slider JavaScript puro, responsivo e fácil de usar
Conheça Glider.js, slider JavaScript puro, responsivo, eficiente, leve e muito fácil de usar!
Os benefícios de performance de animações CSS
Fazer animações Web usando JavaScript ou CSS? Veja conceitos, testes e gráficos que mostram os benefícios de performance de animações CSS.
every(), some(), find() e includes() em JavaScript
Saiba mais sobre every(), some(), find() e includes() e como usar estas importantes funções de programação funcional em JavaScript.
dpw expo #40 – ApexCharts.js, Sal.js, Moveable, Cropper.js, FilePound
dpw expo 40 é especial, comemorando o fim da 1ª temporada, e apresenta 5 recursos para você explorar um mundo de interatividade e possibilidades!
dpw expo #39 – International Telephone Input, Focus Overlay, JustGage
International Telephone Input, para campos de tel internacionais; Focus Overlay, para ênfase ao foco em elementos; JustGage, que gera gráficos gauge.
dpw expo #38 – Jurassic Ninja, typical, gameController.js
Jurassic Ninja, para ter site WordPress com apenas 1 clique; typical, para efeito de digitar e; gameController.js, para usar gamepad e controles no browser.
dpw expo #37 – roughViz.js, free-for.dev, Swiper
roughViz.js, lib JS para gráficos “à mão”; free-for.dev, lista de recursos free tier e; Swiper, moderno touch slider para mobile.
dpw expo #36 – React Bolt, Butter Cake, Browserhacks
React Bolt, boilerplate para projetos React; Butter Cake, framework CSS moderno com Flexbox; Browserhacks, com listas de hacks CSS para diferentes browsers.
dpw expo #35 – react-spinners-css, SimpleBar, CopyPalette
react-spinners-css, spinner para React; SimpleBar, barras de rolagem personalizadas e; CopyPallete, para criar paletas de cores SVG para Sketch e Figma.
dpw expo #34 – Can I email, clipboard.js, Flawwwless ui
Can I email, para checar features em e-mails; clipboard.js, para copiar texto para a área de transferência e; Flawwwless ui, lib de componentes React.
dpw expo #33 – filesize.js, Radial Menu, UI Interactions
filesize.js, para humanos lerem tamanhos de arquivos; Radial Menu, um menu radial fácil de usar e; UI Interactions, interações de user interface diversas.
dpw expo #32 – Image Map Generator, Divjoy, SVG Artista
Image Map Generator, para mapas de imagem; Divjoy, codebase React (com builder) e; SVG Artista, para animações de fill e stroke com SVGs.
dpw expo #30 – collectorium, perfundo, npkill
collectorium, para fazer abas com CSS puro; perfundo, para criar lightboxes com CSS puro e; npkill, para deletar diretórios node_modules inúteis.
dpw expo #29 – TypeLighter.js, Codeimg.io, Vuestic Admin
TypeLighter.js, para efeito typewrite; Codeimg.io, para compartilhar snippets de códigos e; Vuestic Admin, solução Vue.js para painéis admin.
dpw expo #27 – Gradient Magic, Text stripes, git-pending
Gradient Magic, galeria de gradientes CSS únicos; Text stripes, ferramenta para criar stripes e; git-pending, plugin para git para relembrar seus TODO.
dpw expo #26 – Tabulator, react-image-magnifiers, SuperTinyIcons
Tabulator, para tabelas interativas; react-image-magnifiers, componentes React para image magnifying e; SuperTinyIcons, versões SVG minúsculas de ícones.
dpw expo #25 – List.js, 26 recursos VS Code 2019, Color Thief
List.js, adiciona busca, filtro e ordenação em listas e tabelas; 26 recursos JS para VSCode em 2019; Color Thief, gera paleta de cores a partir de imagem.
dpw expo #24 – Animista, Static Site Boilerplate, Humanize Duration
Animista, para animações CSS; Static Site Boilerplate, workflow completo para sites estáticos e; Humanize Duration, JS que converte para milissegundos.
dpw expo #23 – Frappe Charts, Darkmode.js, Eva Design System
Frappe Charts, para gráficos modernos SVG; Darkmode.js, para adicionar dark mode no seu site/app; Eva Design System, gerador de cores que usa deep learning.
dpw expo #22 – Shape.so, MoveTo.js, uiGradients
Shape.so, ferramenta que disponbiliza ícones personalizáveis; MoveTo.js, lib para scroll animado JavaScript e; uiGradients, galeria de degradês com opções.
dpw expo #21 – freezeframe.js, Spotlight.js, Microjs
freezeframe.js, que controla gifs animados; Spotlight.js, um novo modal/galeria que está chegando nas webs e; Microjs, buscador de recursos JavaScript.
dpw expo #20 – Transfonter, Specificity Calculator, ms
Transfonter, conversor de fonte para @font-face; Specificity Calculator, para cálculo de especificidade CSS e; ms, que converte tempo para milissegundos.
dpw expo #19 – Scene.js, Pressure.js, pixelmatch
Scene.js, lib de animações JS; Pressure.js, para controlar interações com clicks e touchs e; pixelmatch, para comparação da similaridade entre imagens.
SVG inline… Com cache!
Todos sabemos que não é possível cachear ícones SVG inline… Ou será que é? Veja neste artigo como usar ícones SVG inline com cache!
10+ melhores extensões Visual Studio Code para JavaScript em 2019
Conheça as 10+ melhores extensões Visual Studio Code para JavaScript em 2019 e veja quais plugins JS você deve usar para melhorar sua experiência no VSCode.
Dominando o “this” em JavaScript
A palavra-chave “this” em JavaScript confunde desenvolvedores novos e experientes. Leia este artigo e domine o “this” em JavaScript!
6 truques de ECMAScript 6
Confira 6 truques de ECMAScript 6 que podem ser bastante úteis em projetos front-end.
map(), filter() e reduce() em JavaScript
Saiba mais sobre map(), filter() e reduce() e como usar estas importantes funções de programação funcional em JavaScript.
Delegação de Evento (Event Delegation) em JavaScript puro
Delegação de Eventos (Events Delegation) em JavaScript puro: mais informações e exemplos de como usar corretamente.
JavaScript Module Pattern (Padrão de Módulo)
Conheça JavaScript Module Pattern (Padrão de Módulo) e aprenda casos de uso e técnicas básicas e avançadas que permitirão a evolução de seu código!
Prevenindo “layout thrashing” com FastDom
Saiba o que é “layout thrashing”, suas consequências e como é possível evitar usando a biblioteca FastDom.
JavaScript IIFE como contêiner de códigos
Entenda sobre IIFE (Expressão de Função Imediatamente Invocada ou Immediately-Invoked Function Expression) em JavaScript e porque você deve usar já!
Gulp
Conheça o Gulp, melhor automatizador de tarefas de front-end da atualidade, num artigo repleto de informações, dicas e exemplos.
Eventos JavaScript
Introdução a eventos JavaScript: saiba mais sobre eventos, event handlers, tipos de eventos, eventos JavaSript comuns e mais.
Conhecimentos essenciais de JavaScript para quem já usa jQuery
JavaScript puro e suas funções, métodos e maneiras de trabalhar estão ficando cada vez mais simples e eficientes. Veja uma série de comparações de funções e métodos em JavaScript nativo comparados com jQuery.
UIkit: framework front-end modular responsivo
UIkit é um framework responsivo modular de front-end projetado para ser leve e simples de se usar. Veja mais informações e conheça seus componentes.
Equivalentes nativos de JavaScript para funções jQuery
Conheça equivalentes nativos de JavaScript para funções jQuery e saiba como aumentar o desempenho de seus projetos web.
Como loading de JavaScript funciona: DOMContentLoaded e OnLoad
Aprenda como o loading de JavaScript funciona e saiba mais sobre os eventos DOMContentLoaded e OnLoad e como posicionar e usar apropriadamente seus códigos JS.
Grunt: build tool para projetos front-end
Conheça o Grunt, um dos melhores executadores de tarefas (task runner), e veja exemplos de uso para que o processo de automatização de tarefas no front-end em seus projetos seja uma realidade!
Webshims Lib: Polyfills de recursos de HTML5 e CSS3
Conheça a Webshims Lib e saiba como ter polyfills de recursos de HTML5 e CSS3 carregados sob demanda!
Usando Modernizr para detectar features de HTML5 e CSS3
Conheça e aprenda a usar Modernizr, biblioteca JavaScript que permite detectar features de HTML5 e CSS3 do navegador e prover soluções, caso necessário.
Como usar .ready() antes de incluir a jQuery
Aprenda como usar o .ready() da jQuery até mesmo antes de incluir a própria jQuery, que permite executar códigos inline que dependem da bilbioteca mesmo antes de ela ser incluída! Saiba mais!
Como otimizar códigos jQuery e aumentar a performance do front-end
Dicas simples de como otimizar códigos jQuery e aumentar a performance do front-end
JSON: JavaScript Object Notation
JSON – JavaScript Object Notation – é uma das principais notações para intercâmbio de dados entre aplicativos. Saiba mais e veja exemplos e ferramentas.
Melhorando a interação em formulários de busca
Aprenda a melhorar a interação em formulários de busca com poucas linhas de código e aumente a usabilidade de seu form de busca
Melhores editores WYSIWYG
Conheça os melhores editores WYSIWYG para seu projeto ir para o próximo nível: uma lista de editores WYSIWYG para todos os gostos e necessidades!
Diferenças entre IDs e Classes
Aprenda a diferença entre IDs e classes, usados em XHTML, CSS e javascript. Saber a diferença entre classes e IDs evita erros básicos e permite desenvolver sites melhores