Alguns meses atrás eu desenvolvi um chat em Backbone e node.js. Foi uma ótima experiência para aprender sobre aquelas tecnologias. Foi tão bom que eu resolvi expandir o projeto e englobar outras tecnologias. O repositório agora está disponível publicamente no Github e fiz o deply no Heroku.

Então fica ligado que nos próximos meses vou utilizar outras tecnologias e colocar aqui a experiência que eu tive com cada uma.

O primeiro framework que decidi experimentar foi o Angular. Atualmente ele é um dos frameworks frontend mais populares e é mantido pelo Google. A sua abordagem é diferente do Backbone, que tenta ser leve e tenta encapsular o DOM em views. O angular expande o html para criar views dinâmicas e utiliza two-way data binding: mudanças nos modelos são propagadas diretamente para o DOM e mundaças no DOM são propagadas para o model.

No chat, há um input de texto que é ligado com o campo username do controller.

<input id="user" class="form-control" maxlength="15" ng-model="chat.username">

Assim, quando o valor do input é modificado, a variável também é modificada.

Para obter as mensagens do servidor (comunicando-se com a mesma API REST usada na versão Backbone), eu utilizo o módulo $resource para trazer as informações e colocá-las no campo msgs do controller

    
var Message = $resource('/messages/:msgId');
chat.msgs = Message.query();

Que por sua vez está ligado ao html:

<div ng-repeat="msg in chat.msgs">
<span class="user">{{msg.username}}:</span> {{msg.message}}
</div>

Isso é o básico do básico do que o Angular é capaz. Confira a implementação completa.