Iniciando o MongoDB em background no Mac OS X

Publicado em Publicado por gserrano

Hoje passei alguns sufocos configurando minhas ferramentas de trabalho no Mac OS X (10.8.2), que começou nas configurações do Apache (um pouco diferentes do que eu estava acostumado no Ubuntu) e seguiram os problemas na configuração dos drivers do MongoDB.

No Ubuntu, meu MongoDB era iniciado automaticamente junto com Apache e MySQL, no Mac OS eu percebi que tenho que iniciar o processo (mongod) pelo terminal para poder rodar as aplicações.

Como rodar o MongoDB em backgorund?

mongodb

O Mongo tem uma opção para lançamento em background, que é a –fork. 

Então para que você não precise ficar com o terminal aberto somente porque está rodando o Mongo, é só digitar no terminal:

mongod –fork

E se quiser definir um local específico para os logs do Mongo pode adicionar o parâmetro –logpath, por exemplo:

mongo –fork –logpath /usr/local/var/log/mongodb/mongo.log

 

Li em alguns lugares que para iniciar o Mongo em background o parâmetro logpath era obrigatório, mas aqui funcionou corretamente sem o parâmetro.

Espero ter ajudado, em breve mais algumas dicas sobre a configuração do Apache no Mac para que você não perca tanto tempo como eu perdi! 🙂 

Em breve um tutorial para melhorar as configurações do Mac OS X, que por padrão não tem sites-enabled e sites-available, horrível para gerenciar diversos virtual hosts!

 

mongod –fork –logpath /usr/local/var/log/mongodb/mongo.l

Uso de Web Workers para highlight de palavras

Publicado em Publicado por gserrano

Por uma necessidade no trabalho (como na imensa maioria das vezes), comecei a pesquisar o uso de Web Workers. A necessidade? Criar um highlight de palavras em textos no html, via javascript.

Fiz um teste sem o uso de web workers, onde pegava o texto de uma div e iterando em uma lista de palavras-chaves, usando RegExp trocava a palavra-chave por . A performance foi lastimável, com 60 palavras-chaves em um texto longo (5 parágrafos gerados pelo CupCake Lipsum) a média era de 600 milisegundos.

Alterei para usar Web Workers, e criei um task.js

onmessage = function(e) {
    var html = e.data[0];
    for(var i=0; i         var reg = new RegExp(e.data[1][i], 'gi');
        html = html.replace(reg, "" + e.data[1][i] + "");
    }
    postMessage(html);
}

O funcionamento é simples: onmessage recebe e (é um event), que possui e.data
Esse é um array (na chamada da função onmessage ficará mais claro) que possui na primeira posição o texto a ser analisado e na segunda, a lista de palavras-chaves.
A partir daí, só é necessário iterar na lista de palavras-chaves e com RegExp, trocar as ocorrências da mesma por um span com a palavra-chave no meio. No caso, coloquei uma class para poder estilizar.

O html é simples. Declaro a lista de palavras-chaves (chamei de wikis), instancio um novo Worker (que está no task.js). Com worker.postMessage(data), posso passar dados para o worker. Ali, está o array ao qual me referi.
O callback do onmessage recebe event, que também possui um data. No caso, é o texto com os spans inseridos "em volta" das palavras-chaves.

javascript

window.onload = function() {
    var div = document.getElementById("text");
    var wikis = [
        "brownie",
        "lemon",
        "chocolate",
        "sesame",
        "lollipop",
        "oat",
        "cake",
        "gingerbread",
        "sweet",
        "applicake",
        "apple",
        "chups"
    ];

    var worker = new Worker('task.js');
    
    worker.onmessage = function (event) {
        var d = event.data;
        div.innerHTML = d;
    }
    worker.postMessage([div.innerHTML, wikis]);

}

CSS

span.wiki {
   border-bottom:1px dotted #FF0000;
}

No html, crie uma div de id="text" com o texto que será verificado.

Para testar, crie o task.js com o primeiro trecho e um .html com o javascript  e css no head e a marcação html adequada.
Demo: http://www.chrisb.com.br/labs/webworker/words.html

Git – enviando uma branch local para o repositório

Publicado em Publicado por gserrano

Você está implementando uma feature nova no sistema e para não prejudicar nenhum deploy da branch master criou uma nova branch na sua máquina, vamos supor que o nome desta branch é nova-feature.

Acontece que chegou um ponto que seu colega também precisa acessar sua branch para fazer novas implementações, então você precisa enviar a nova-feature do seu repositório local para o repositório remoto, onde qualquer pessoa que trabalhe no projeto possa acessar. 

Dando push da branch para o repositório remoto

git push origin nova-feature

Agora sua branch estará disponível no repositório remoto, e para seu colega baixar ela é simples:

git checkout –track origin/nova-feature

Agora você e seus colegas podem trabalhar em uma branch separada para aquele nova feature sem prejudicar a menutenção do código master! 🙂

BrainJS – Rede Neural com Javascript

Publicado em Publicado por gserrano

Recentemente conheci o BrainJS, uma biblioteca de Rede Neural Artificial toda desenvolvida em Javascript disponível para instalação com npm no NodeJS (veja como instalar o NodeJS + npm).

 

Como funciona uma rede neural?

A resposta curta é: com magia negra.

Esta é uma rede neural não artificial: um cérebro de chipanzé.

A reposta um pouco mais longa, é que a rede neural recebe uma série de dados (inputs) e a resposta esperada para cada caso de conjunto de inputs. 

Depois de coletar alguns inputs com respostas que você já saiba você pode executar o "treinamento" desta rede neural, e o resultado deste treinamento será um algoritmo. Este algoritmo calculará uma  probabilidade de resposta para os próximos inputs que você colocar neste rede neural.

A rede neural é utilizada para sistemas de inteligência artificial, com o constante treinamento da rede (e input de informações) suas respostas ficam mais acertadas com o tempo.

Leia mais sobre redes neurais artificiais na Wikipedia.

 

BrainJS

Agora que você já tem uma idéia de como uma rede neural artificial funciona, pode fazer como eu e ficar impressionado por isso funcionar em javascript (server-side com NodeJS) ou client side, utilizando a artimanha do browserify. 

Eu fiz uma série de experimentos com o BrainJS, quase todos relacionados a seletores de cores – sabem como é difícil a vida de um daltônico? Pensei em uma ferramenta para me auxiliar na identificação de cores e está dando certo…

Treinando uma rede neural com BrainJS

// instanciamos nossa rede neural, spongebob
var spongebob = new NeuralNetwork();
 

Agora vamos inputar dados de altura (h) e largura (w) e os resultados esperados: se o objeto é vertical ou horizontal.

spongebob.train([
  {input: {w:200,h:100}, output: {horizontal: 1}},
  {input: {w:500,h:400}, output: {horizontal: 1}},
  {input: {w:100,h:110}, output: {vertical: 1}},
  {input: {w:5,h:7}, output: {vertical: 1}},
]);

O resultado do treinamento da rede é um objeto que traz informações do sucesso (ou não) do treinamento e do número de iterações feitas para treinar sua rede neural. O treinamento pode levar um tempo pois é aqui que o algoritmo da sua rede neural é calculado.

 

Fazendo a rede neural trabalhar

Agora vamos fazer a rede neural trabalhar! Depois de inputar informações que você sabia a resposta você pode colocar dados que você não saiba a resposta e deixar a rede fazer o trabalho dela.

var resultado = spongebob.run({w:50,h:400});

Cada run vai resulta um objeto com as prováveis respostas, no exemplo acima:

horizontal: 0.45137855383391234
vertical: 0.5486215106258696

 

É ou não magia negra?

Veja um demo do  BrainJS

Exemplo de uso da API Page Visibility

Publicado em Publicado por gserrano

O Guilherme fez um post alguns meses atrás sobre a API Page Visibility, que permite, entre outras coisas, ao programador front-end definir comportamentos da página quando ela não está visível (por exemplo, quando o usuário muda de tab dentro do browser).

Para um projeto, precisei desse comportamento para verificar se um usuário ficaria ao carregar a página ficar com ela aberta por um certo tempo, afim de criar algumas estatísticas.

Como a API ainda está bem no começo, em draft, as engines dos browsers usam os seus prefixos para tratar os eventos associados a esse comportamento, então para me ajudar usei o plugin Page Visibility for jQuery. O uso é muito simples: associe aos eventos show e hide do $(document) funções. Do exemplo do próprio autor:

$(document).on({
  'show': function() {
    console.log('The page gained visibility; the `show` event was triggered.');
  },
  'hide': function() {
    console.log('The page lost visibility; the `hide` event was triggered.');
  }
});

Então, para usar um contador, você pode fazer assim:

var d = document.getElementById("container_visibility");
var count_timer = null;
var counter = 0;
var f = function() {
count_timer = setTimeout(function() {
    d.innerHTML += counter + "<br />";
    f();
    counter++;
}, 1000)
}
f();
$(document).on({
'show': function() {
    counter = 0;
    d.innerHTML += "contador resetado<br />";
    f();
},
'hide': function() {
    clearTimeout(count_timer);
}
});

O que eu fiz, foi simples: criei uma função f() que chama setTimeout com intervalo de 1 segundo e escreve numa div de id="container" o valor de counter; então, quando a página perde visibilidade, apago o setTimeout com clearTimeout e quando a página ganha visibilidade, reseto o counter e chamo novamente f().

Em http://jsfiddle.net/chrisbenseler/7NH3z/ publiquei um exemplo com essa implementação, ao lado de um counter que não é resetado quando a página perde visibilidade.