Categorias

10 novas ferramentas de JavaScript para desenvolvedores web

Nem só de jQuery e suas frameworks concorrentes vive o desenvolvedor web. Um desenvolvedor realmente competente precisa ter uma caixa de ferramentas lotada de opções, cada uma adequada para uma determinada função.

Trazemos aqui 1o ferramentas tinindo de novas para turbinar seu JavaScript e criar sites modernos com todas as funcionalidades que os usuários pedem e merecem. Estas ferramentas oferecem um design limpo, uma interface simples e um código enxuto por trás de habilidades de cair o queixo.

1) Epoch

epoch

Se você precisa visualizar dados na Web de uma forma visualmente interessante e que não dá sono em que está vendo, certamente já conhece e usa o D3.js. Se não usa, pode pular e ir direto para o Epoch.

Seus criadores pegaram as bibliotecas básicas do concorrente e envenenaram o código para que sua solução rode mais suave, mais rápido e ainda em tempo real. Com o Epoch, é possível adicionar gráficos que se atualizam enquanto os usuários ainda estão vendo. Os novos dados aparecem na esquerda da tela e podem ser rolados a qualquer momento.

2) Deb.js

Errar é humano, debugar é divino. Ou infernal, depende de como você está fazendo. Com este pequenino arquivo .js de 1,5KB você pode limpar a janela do console, facilitando e muito o processo de debugar JavaScript. Deb.js  é o complemento perfeito para quem usa o FireBug ou as ferramentas nativas de debug do Chrome, Opera ou Safari.

3) Web Starter Kit

web-starter-kit

Montar um aplicativo web que funcione em todos os aplicativos não é tarefa fácil. Nem mesmo com nossas 7 Dicas para criar sites responsivos. Entra em cena o Google, trazendo seu Web Starter Kit, um projeto focado em facilitar a vida de desenvolvedores que precisam oferecer suporte a múltiplos dispositivos.

Esse framework sincroniza cliques, recarrega quando necessário e tenta manter o seu código o mais leve possível para que os resultados continuem em sincronia. Se um usuário está utilizando um iPad muito muito velho e outro está em um dispositivo Android ainda com cheirinho de fábrica, o código se adapta para oferecer a mesma experiência.

4) NodeBB

Quem já teve que administrar um fórum em phpBB sabe muito bem como combater os trolls e manter o controle da conversação é uma tarefa hercúlea. Na verdade, qualquer um que já administrou qualquer fórum já passou por isso, independente da tecnologia. Agora, com o NodeBB você pode se irritar da mesma forma, mas usando JavaScript.

Se o público não muda, pelo menos agora a implementação ficou mais fácil, sem abrir mão de funcionalidades essenciais para esse tipo de serviço. A solução é responsiva, customizável, oferece transmissão em tempo real de conversações, tem suporte a temas modernos e funciona bem em telas menores de smartphones e tablets.

5)  PlayCanvas

playcanvas

Se você sempre quis desenvolver jogos mas acabou parando em desenvolvimento web, agora chegou a sua vez de casar os dois lados de sua vida. PlayCanvas é um motor gráfico para jogos construído usando WebGL. Basicamente, é a Unreal Engine, o Unity do JavaScript.

A ferramenta combina física, iluminação, sombras, áudio e muito mais de forma coerente, permitindo a criação de mundos repletos de objetos interativos. Está vendo a imagem de cima? Criada com a ferramenta e é em 3D. Tudo isso de forma gratuita, com código aberto e multiplataforma (Windows, OS X, Android e iOS).

6) GulpJS

A palavra-chave aqui é automação. Para quem usa sintaxes com atalhos como CoffeeScript e gosta de montar seu CSS a partir de um conjunto de regras, quanto mais automação melhor. Gulp é o seu organizador: você escreve um pouco de JavaScript para especificar os caminhos e ele faz o resto. É como Ant ou Maven para Java, mas desta vez utilizamos JavaScript para descrever a tarefa ao invés de XML.

É uma solução elegante para reduzir e limpar seu código também.

7) AngularJS

O Google aparece na nossa lista pela segunda vez e por uma boa razão: AngularJS é um framework limpo e leve para exibir informações no navegador. Ele coleta dados do servidor e então combina com um modelo local para apresentação.

É essencialmente uma plataforma de Model-View-Controller construída de HTML, JavaScript e CSS para rodar direto no seu navegador. O código do lado do servidor manipula o armazenamento de dados e o Angular.JS cuida da apresentação.

8) Odyssey

odyssey

Adicionar mapas a um site é fácil (graças ao poder das APIs). Mas um mapa de viagem não conta uma história sozinho. O Odyssey faz isso por você. Essa ferramenta combina relatos em texto com mapas interativos e uma apresentação de encher os olhos. Considere essa ferramenta como um elo de ligação entre texto e mapas, indispensável para jornalistas, escritores, designer e outros criadores de conteúdo rico.

9) Reveal.js

Se o seu chefe vivia pedindo para colocar os PowerPoints da empresa na web, agora você pode atender seus pedidos de uma forma que não envergonhe seu portifólio. Com o Reveal você pode montar um sofisticado substituto daquelas apresentações manjadas, com transições suaves e botões de navegação com muito estilo.

Mesmo que o caso acima não seja o seu, você ainda pode utilizar o poder do Reveal para conduzir seus visitantes por uma história interativa que revela novas informações a cada clique. E, se a necessidade aparecer de mostrar sua presentação fora da web, seus slides já estarão prontos..

10) RxJS

Nos dias de hoje, o visitante quer agilidade na busca por informações. Não basta mais a página carregar rápido. Ela precisa carregar as informações enquanto ele ainda está pensando no que quer! O nome dessa tendência é design reativo e significa responder antes do usuário clicar. O exemplo mais comum são caixas de texto que se autocompletam com sugestões enquanto o usuário ainda digita. Mais o conceito pode ser estender para múltiplos usos.

Com o RxJS você tem em mãos um conjunto de bibliotecas que adiciona respostas reativas, assíncronas, ao fluxo de eventos gerados pelo mouse e pelo teclado do usuário aproveitando o poder do LINQ (Language Integrated Queries)