egermano.com

Fala Galera,

Estou desenvolvendo um sisteminha que vai ter um formulario de cadastro, um dos dados mais importantes desse formulario é o endereço do fulano. Fiz uma busca rápida na internet e não encontrei uma basa free descente de cidades e estados então resolvi fazer uma, juntei várias informações que achei de outros lugares e juntei tudo pra ficar redondinho… Depois de um tempo ficou pronto.

Coloquei la no meu repositorio do GitHub.

Existem dois tipos de arquivos lá, um só de cidades, outro só de estados e o outro que é o insert de todos, cidades e estados. Os inserts já cria as tabelas no banco.

Acessem o meu repositório: github.com/egermano/

Download

Faça download por aqui:

github.com/egermano/cidades-e-estados-brasileiros

Qualquer dúvida, comentário, solicitações ou até colaborações, falem comigo.

Make open, make free.
Abraços

Fala Galera,

Quer compartilhar uma grande descoberta que fiz nesse últimos dias…

Como alguns sabem, eu sai do banco e estou em uma agência digital. Creio que essa foi umas das maiores decisões que tomei nos últimos tempos, mas nada supera a minha decisão por me casar e formar uma família com a Luise. Com essa grande mudança de ambiente e de carreira eu já aprendi várias coisas com a galera aqui da agência e uma delas é o que vou compartilhar com vocês, LESS.

O LESS é uma linguagem que extende o css, ele cria comportamentos como variáveis, funções e até operações (adição, subtração, divisão, entre outras).

A linguagem foi idealizada e implementada por Alexis Sellier (a.k.a Cloudhead), o conceito era criar essa linguagem para substituir o CSS do seu site, mas como os browses só aceitam o CSS como arquivo para formatação de estilo de página ele criou um arquivo em JavaScript que funciona como um interpretador.

A implementação no site é muito simples, saca só:

<link rel=”stylesheet/less” type=”text/css” href=”styles.less”>

<script src=”less.js” type=”text/javascript”></script>

Basicamente você coloca o seu arquivo .less e depois usa o less.js como interpretador.

Analisando e testando um pouco essa linguagem eu achei que esse processo de interpretação que o less.js faz um pouco pesado  pode ser custoso já que isso vai rodar no cliente e depende muito da máquina que o cara tem. Lembrando que o Cloudhead disponibilizou no site do LESS um interpretador Server Side, ou seja, roda do lado do servidor e não no browse, no cliente. Mesmo assim achei o processo do Server Side complexo de se instalar e não muito prático, sem contar que é um processo a mais para rodar no Server mesmo assim.

Aí pesquisando na internet encontrei o LESS.app que é um compilador de LESS (se você não entende muito de programação a essa hora você já dev estar me xingando e falando que é tudo a mesma coisa), ou seja, você compila e transforma o seu arquivo .less em um arquivo .css em tempo de desenvolvimento e não de execução como os outros interpretadores. No site desse app tem um vídeo explicando como ele funciona. O app é gratuito e só funciona e MAC, sorry Wondows Loosers.

Com isso eu virei o mestre do  LESS, sai fazendo todos os CSS e com a produtividade lá no céu, mas eu ainda podia melhorar. Eu sempre usei o TextMate ara desenvolver qualquer coisa, HTML, CSS, JS, PHP, Python, Ruby on Rails e por aí vai e como a maioria dos editores e IDE que tem no mercado ele deixa as letras todas coloridas de acordo com o elemento, instrução, tipo e etc… Mas com o LESS ele não estava funcionando, ficava tudo preto no branco.

Mais uma vez… De volta ao Google.

Encontrei dessa vez um bundle, uma das grandes vantagens do TextMate é que você pode programar em vária linguagens em um

editor só e os bundles são os arquivos que fazem isso funcionar. Você configura as instruções e as formatações que cada parte do seu código deve ter. Dois caras muito firmezas fizeram tudo isso e disponibilizaram no GitHub , esses caras são o Scott Kyle e o Rasmus Andersson.

Nesse pacote além do bundle do TextMate, eles diponibilizam também um compilador para o TextMate, mas eu ainda prefiro o LESS.app.

Para concluir, o seu código fica mais ou menos assim como na imagem acima, com varias variáveis e funções e estruturas de dados e tudo isso que vocês podem ver.

Para aprenderem LESS:

• http://lesscss.org/#docs

Ferramentas que falei nesse artigo:

• TextMate
• LESS.app
• Bundle do LESS para TextMate

Usem LESS, criem seus CSS assim e torne o seu trabalho mais produtivo e organizado.

Comentem e compartilhem esse artigo, pois é isso que torna a internet e todas as redes sociais úteis.

Abraços,

Nesse artigo vou mostrar como manipular uma tabela com JavaScript usando as interfaces DOM (document object model).

Os ganhos de se criar e manipular uma tabela através do JS (JavaScript) é que toda a sua estrutura fica facilmente manipulada em DOM no formato de objeto. Você consegue manipular a tabela como um todo ou cada parte dela independente de outra.

Para criar a tabela você pode usar esses comandos, que são os mesmo para se criar qualquer outro elemento HTML no JS. Vou estruturar tudo em Orientação Objeto que é outro ganho na manipulação dos objetos e elementos da página. Vou usar também prototipação de objetos, que é outro artigo.

<script language=”javascript” type=”text/javascript”>
//Classe Tabela
function Tabela(linhas,colunas){
//Propriedades
this.linhas = linhas;
this.colunas = colunas;
//Nova estancia de um elemento HTML <TABLE></TABLE>
this.element = document.createElement(‘table’);
}
//Prototipacao da Classe Tabela
Tabela.prototype = {
//Metodo para montar a tabela
build:function(){
for(var l=0;l<this.linhas;l++){
//Nova linha <TR></TR>
var row = this.element.insertRow();
for(var c=0;c<this.colunas;c++){
//Nova Celula <TD></TD>
var cell = row.insertCell();
cell.appendChild(document.createTextNode(‘Linha : ‘ + parseInt(l+1) + ‘ Coluna: ‘ + parseInt(c+1)))
}
}
return this.element;
}
}
function Main(){
//instancio o Objeto
var tabela = new Tabela(5,5);
//contruo ele no div ‘content’
document.getElementById(‘content’).appendChild(tabela.build());
}
</script>

Essa é uma instanciação simples de uma tabela em JS.
Mais pro futuro vou colocar alguns métodos mostrando a manipulação de linhas e colunas de uma tabela com DOM.

Abraços,