Como o Ajax funciona na prática

Muito se falou (e se fala) por aí sobre Ajax. Há uns anos atrás isso era a sensação do momento. Programadores que trabalhavam com Ajax eram mais valorizados não pelas vantagens no uso do Ajax, mas pelo fato de ser “mais bonito”.
Depois de algum tempo começaram a aparecer algumas bibliotecas em Javascript que implementam Ajax de uma forma simples.
O primeiro nome que ouvi foi o do Prototype, mas só fui realmente trabalhar com uma biblioteca dessas algum tempo depois quando entrei pra Linux Solutions.
Meu primeiro encontro foi com o jQuery e tanto ele quanto eu ainda estavamos engatinhando no mundo do desenvolvimento. Nessa época eu era basicamente o desenvolvedor frontend da empresa. Eu só gostava de CSS, tinha medo do Javascript e estava cansado de escrever Html, e queria programar em Php.
Precisávamos trabalhar com um sistema sem recarregamento de páginas pelo fato de o mesmo fazer muitas requisições ao banco de dados em várias partes da interface, então seria bastante chato fazer no braço tendo em vista de todos os tutoriais da época só mostravam como fazer, mas não tinham uma descrição decente de como funcionava. Infelizmente, pra muitas empresas esse é o mercado hoje. Os gerentes só dizem “Faça! Deixe pra aprender depois!” e hoje temos vários profissionais que se você tirar o atalho do Internet Explorer do Desktop ele vai parar de trabalhar dizendo que a internet caiu. Assuntos polêmicos à parte, mas isso é bastante chato pois quem sabe como algo funciona pode questionar e adaptar a ferramenta ao trabalho.

Como funciona uma requisição Ajax?

O nome “Ajax” já não rola mais hoje em dia. Continuamos chamando de Ajax, mas pelo significado da sigla (Asynchronous Javascript and XML ou Javascript e Xml Assíncronos), não tem mais sentido. De qualquer modo, uma requisição Ajax funciona do seguinte modo:

Sua página inteira já foi carregada e, ao clicar num link ou fazer qualquer requisição, um usuário vê a página toda carregar novamente para a home do site sumir e aparecer um formulário de contato onde antes havia o texto inicial do site. Utilizando Ajax, você pode mandar o navegador carregar apenas o formulário de contato no lugar do texto inicial.
-Putz! Mas eu vou ter mais trabalho pra fazer isso!

Teoricamente sim, mas se a página tem uma ou mais partes do conteúdo que se repetem você pode trabalhar com os includes ou imports da sua linguagem de programação preferida e no fim ter menos trabalho. Em compensação à codificação extra, ao invés de o usuário carregar novamente a página inteira apenas a parte relevante. Com isso você ganha velocidade de carregamento na sua página e diminuição de carga na sua banda.
Web sites com Ajax se tornam mais fluidos e tem a sensação suave de carregamento de páginas. Imagine você utilizando seu sistema operacional e a cada janela que abrir, a tela ficar preta e só aparecer tudo de volta quando a janela se abrir? Seria medonho.
Mais informações:
http://www.w3schools.com/ajax/default.asp
http://en.wikipedia.org/wiki/Ajax_(programming)

VI Jornada Acadêmica do IST – Paracambi

No dia no dia 30 de maio de 2011 começa a VI Jornada Acadêmica do Ist Paracambi. É uma ótima oportunidade para os estudantes das áreas de Tecnologia da Informação e Ciências Biológicas se atualizarem com as palestras e mini-cursos.

Eu irei apresentar 3 palestras consecutivas no sábado dia 04 junho fechando o evento:

09:00 às 10:00 – Desenvolvimento voltado à Plataforma
10:00 às 11:00 – Desenvolvimento rápido com CodeIgniter
11:00 às 12:00 –  Sobrevivendo como um Programador Solitário

Tentei montar um material sobre Python e Django, mas meu curso Welcome to the Django com o Henrique Bastos ainda não acabou, então achei melhor não falar sobre ainda o que não tenho tanto conhecimento, mas com certeza esses assuntos vão entrar na palestra “Sobrevivendo como um Programador Solitário”.
A programação completa (e provisória) pode ser encontrada nesse link.
Logo após às palestras, irei correndo pro III FSLDC pra conferir as palestras do meu querido amigo Tiago Peczenyj e do Rasmus Lerdorf, criador da linguagem PHP.

Nos vemos lá! =)

Comparando datas com Javascript

Tentando voltar com o jejum de bastante tempo aqui no blog. Tentarei potar mais vezes, mas quanto mais o tempo passa, menos tempo me resta rs.

Hoje estava com um problema para fazer um relatório de um ERP que estou fazendo para a loja de material elétrico do meu pai. O problema é simples. Será feito um relatório de lançamentos financeiros com data inicial e data final, porém a data inicial não poderia ser maior que a data final. Óbvio.

O formulário é basicamente o seguinte:

<label for="data_inicial">Data Inicial</label>
	<input type="text" name="data_inicial" value="" id="data_inicial" readonly="readonly" />
<label for="data_final">Data Final</label>
	<input type="text" name="data_final" value="" id="data_final" readonly="readonly" />
<label>Tipo</label>
	<input type="radio" name="tipo" value="todos" />Todos
	<input type="radio" name="tipo" value="credito" />Crédito
	<input type="radio" name="tipo" value="debito" />Débito
<label for="descricao">Descrição</label>
	<input type="text" name="descricao" value="" id="descricao" />
<button name="" type="button" id="consultar_btn" >Consultar</button>

O necessário agora é pegar as datas e fazer a verificação. O Javascript tem um objeto chamado “Date” que nos permite fazer operações com datas. Ele é simples de se trabalhar, mas é preciso escrever um pouco de código.
O meu código abaixo é utilizando o JQuery, mas você pode fazer com Javascript puro se quiser.

$('#consultar_btn').click(function(){
	var dia_inicial = $('#data_inicial').val().slice(0, 2);
	var mes_inicial = $('#data_inicial').val().slice(3, 5);
	var ano_inicial = $('#data_inicial').val().slice(6, 10);
	var data_inicial = new Date(ano_inicial,mes_inicial,dia_inicial);
	var dia_final = $('#data_final').val().slice(0, 2);
	var mes_final = $('#data_final').val().slice(3, 5);
	var ano_final = $('#data_final').val().slice(6, 10);
	var data_final = new Date(ano_final,mes_final,dia_final);
	if(data_inicial > data_final){
		alert('A data inicial não pode ser superior à data final.');
	}
	else{
		//Faça aqui o que quiser =)
	}
});

O que fiz foi basicamente pegar todas as partes da data inicial e data final separados (dia, mês e ano).  Após isso, eu criei dois objetos do tipo Date. Como construtor, o objeto Date pode receber os parâmetros ano, mes e dia nessa mesma ordem. À partir desse momento eu pude fazer a comparação entre a data inicial e a data final. Simples assim.
Explicando o método slice:
O método “slice” literalmente corta uma string. Ele recebe dois parâmetros. O primeiro é onde você vai começar a cortar a string (sempre iniciando com zero) e o segundo é até onde vai cortar. O método vai retornar o pedaço da string que foi cortado. Faça alguns testes e se divirta =)

É isso aí pessoal. Até a próxima.

Venda de Livros

Fala galera, estou vendendo alguns livros. Não gosto muito da ideia, mas infelizmente o espaço ocupado por eles é bem grande e ainda existem outros pra colocar na lista.
A lista pode ser encontrada em www.mayckxavier.com/vendese , mas vou colocar aqui também pra adiantar. O frete fica por conta do comprador, mas se você morar em Paracambi ou estudar no IST Paracambi, posso entregar em mãos.

Bom… É isso. Caso haja interesse, basta entrar em contato.
Inté.

Rapidinha CodeIgniter – Método para carregar views

Essa é uma rapidinha de código no framework em PHP, CodeIgniter. Não vou explicar como ele funciona e esse é apenas um modo que criei pra pegar as páginas que quero sem ter que ficar escrevendo muito.

Primeiramente eu criei um Model chamado Getter que, obviamente pega coisas. O código está abaixo:

function get_page($page,$dado = '',$logged = ''){
   if($logged == 'logged'){
      if($this->session->userdata('logged_in') != TRUE){
         //Redireciona pra um método para deslogar
      }
 else{
    //Pega a página
    $this->load->view('static/head_view');
    $this->load->view($page,$dado);
    $this->load->view('static/footer_view');
 }
 }
 else{
    $this->load->view('static/head_view');
    $this->load->view($page,$dado);
    $this->load->view('static/footer_view');
 }
 }

Como argumento obrigatório a função pede a página que vai mostrar em tela e como argumentos opcionais vão os dados a serem mostrados na página e se o usuário está logado. Isso é interessante caso você tenha páginas que podem ser visualizadas para usuários que não estão logados.

Achei interessante mostrar o modo que trato as páginas. O código não está otimizado e acredito que tenham linhas demais. Ainda não o revisei. Se houver algum outro modo interessante de se tratar isso, deixe um recado nos comentários. =)

Abraços

Como trabalhar sozinho (Ou como ser um programador solitário) Parte 1

Antes de tudo, isso não é um post de auto-ajuda ou um how-to de como se separar da equipe de desenvolvimento da sua empresa. Esse post fala apenas das dificuldades que tive, tenho e como tento contorna-las no dia a dia.
Dividirei esse post em dois por que o texto acabou ficando bem grande  e além de ser ruim escrever um só texto grande, também é ruim ler.

Desde quando comecei a estudar programação há 4 anos atrás houve sempre uma dificuldade de conseguir material bom, cursos com preço acessível e tirar dúvidas. Sem falar que quando se começa, você nunca sabe qual é o melhor livro ou treinamento, então começamos a “atirar” para todos os lados.

Listas de E-mail

Na minha opinião, tirar dúvidas em listas de e-mail não é tão legal por que quando você começa, você não sabe nada e os outros participantes sempre pedem mais informações pra tirar suas dúvidas. Bom… Se o cara não sabe nada, como ele vai dar informações do que ele não sabe? Eu sempre olho as listas de email, mas apenas isso. Já fiz umas duas perguntas até hoje e ao invés de me ajudar, só complicou. Já tentei tirar algumas dúvidas, mas outros participantes sempre faziam antes de mim, então hoje eu só olho. Uma outra coisa chata com as listas de e-mail é a sua tolerância à spam. Devido ao fato de as mensagens serem enviadas pelo seu próprio e-mail, geralmente as listas não toleram que você manda um e-mail pra todo mundo sobre um assunto qualquer. Eu já fui expulso de uma lista por que um serviço na qual me cadastrei na web pegava todos os meus contatos do Gmail e enviava convites para todos eles. Entendo essa política, mas acidentes acontecem.

Fóruns

Existem muitos fóruns para se tirar dúvidas de programação e mesmo tendo o mesmo propósito das listas de e-mail, me parece que os fóruns tem mais sucesso com isso. Acredito que isso se deva ao fato de os usuários parecerem menos “hostis” como os das listas de e-mail. Se você tem dúvidas sobre Java, Engenharia de Software, Ruby e Rails, eu recomendo o GUJ. Na verdade é o que eu recorro quando tenho algumas dúvidas. Como sempre, eu só olho. A maioria das minhas dúvidas já está respondida. =)

Livros

Hoje eu compro livros e não encontrei ainda melhor fonte de conhecimento. Claro que alguns livros que comprei não resolveram os meus problemas, na verdade alguns até mesmo me deixaram com vontade de desistir de aprender uma linguagem ou framework, mas acabei comprando outros do mesmo assunto, o que me fez enxergar problemas de um modo diferente. Dos livros que comprei e posso recomendar sem medo de de ser feliz são:

Desenvolvendo Websites com Php – Juliano Niederauer

Eu aprendi Php com esse livro e não imagino se outro livro pode ser mais didático. Ele trás uma abordagem muito simples e de quebra você ainda aprende um pouco de banco de dados pra já sair criando seus próprios sistemas. Como o livro é bem didático, não é possível se aprofundar muito nos assuntos, mas pra quem está começando, ele é ótimo. Infelizmente emprestei o meu pra um professor da faculdade que fez questão de não me entregar e ainda sair da faculdade. Bem.. É a vida.

Aprendendo Python – Mark Lutz

Dizem que esse é o livro definitivo de Python em português. Ele foi bem traduzido e tem muito, mas muito material. Por causa da falta de tempo, nunca aprendi o bastante pra desenvolver profissionalmente em Python, mas sempre que preciso e posso, faço meus scripts de automação em Python. É muito gostoso trabalhar com Python.

Use a Cabeça! Rails – David Griffiths

Esse livro está sendo muito importante na minha aprendizagem em Rails. Após comprar 2 livros que só confundiam, resolvi investir minha última ficha no Rails e acertei. A série Use a Cabeça! é muito interessante pelo modo que eles passam o conteúdo. Se você tiver algum tempo, pode devorar o livro de 400 páginas em dias.

Expressões Regulares – Aurélio Marinho Jargas

Eu só descobri a real importância das expressões regulares depois de ler esse livro do Aurélio. De fácil leitura e ilustrando tudo o que for possível, o conteúdo fica fácil de ser entendido. Além de tudo, o Aurélio é muito gente fina e se você tiver alguma dúvida, aposto que ele não vai se importar em tirar ela por e-mail =)
Além desse livro, ele também escreveu um livro de ShellScript que ainda não tive a oportunidade de ler, mas assim que tiver mais tempo, comprarei.

Google

Aprenda a usar o Google. Ele não é apenas um sistema de busca simples. Refina suas buscas com a busca avançada. Já vi sistemas inteiros de busca de arquivos na internet que só utilizava o poder do Google. Não consegue encontrar o que precisa? Tente a pesquisa avançada, ou quem sabe talvez o Code Search.

Network

É importante você manter uma boa rede de profissionais amigos. Às vezes recorro à alguns pra tirar alguma dúvida ou perguntar como foi feita determinada coisa em determinada situação. Geralmente são ex-colegas de trabalho/faculdade/treinamento ou qualquer outra pessoa que tenha conhecido. Mas cuidado, não saia ligando e pedindo um tutorial por telefone. Eu já liguei algumas vezes pra tirar pequenas dúvidas de 15 segundos, mas nem sempre é legal ficar ligando ou enviando e-mail pra uma só pessoa pra cada dúvida que tiver. Se você tiver uma dúvida urgente, melhor procurar num fórum do que enviar um e-mail. Eu conheço pessoas que tem agendas tão cheias que às vezes não conseguem dar conta do e-mail pessoal, então sua resposta pode demorar dias ou até semanas. Use seu network com sabedoria.

Treinamentos

Já fiz alguns treinamentos, dei outros e posso dizer que você só vai ter informação se estiver preparado e não adianta tentar da um passo maior que a perna. No início do ano eu ministrei alguns treinamentos de uma formação Java e 60% da turma não tinha conhecimento prévio de programação. Muitos não eram sequer hard-users. Inicialmente eles não tiveram culpa por que o departamento de vendas vendeu os cursos prometendo uma coisa e a formação era outra, mas à partir do momento em que eles não reclamaram os direitos e continuaram a cursar a formação eles tentaram forçar uma barra que era difícil de  ultrapassar. Eles deveriam ter uma noção básica de algoritmos e lógica de programação para não ficarem “boiando” nos treinamentos, mas foi o que aconteceu. Se algum dia for fazer um treinamento que você não saiba direito do que se trata, tente uma opinião de alguém que conheça um pouco do assunto ou trabalhe na área.

Bem… Pararei por aqui e continuarei no próximo post.

T+ galera…

Vestibular IST Paracambi

Estava vendo meu Google Reader e vi um post do Rafael Biriba sobre a abertura do vestibular do IST Rio (universidade onde ele estuda) e resolvi escrever sobre a minha também que é o IST Paracambi. As inscrições já estão abertas e pelo que me parece, vão fechar dia 25 de junho.

Para mais informações sobre o concurso para o Ist Paracambi e para outros cursos da rede da Faetec, segue o link http://200.150.155.210/faetec_2010.2/

O Ist Paracambi se situa no bairro da Fabrica, mais exatamente num polo educacional onde era uma antiga fábrica têxtil que se não me engano foi a primeira da América Latina. No polo educacional, além do  Ist Paracambi, estão a Escola de Música Villa-Lobos, o Cetep com cursos técnicos profissionalizantes, o Cederj com cursos (inclusive de extensão) à distância e o IFRJ com cursos para o Ensino Médio Técnico.

 
Fábrica Brasil Industrial

Mini curso de algoritmos com Javascript – Aula 5

Olá pessoal. Essa é a última aula do nosso mini curso de Algoritmos com Javascript. Em adição a isso, estou colocando o pdf de todas as aulas para download para quem tem preguiça de ler direto do site ou, como eu, prefere ter tudo impresso pra ler em qualquer lugar.

O link para download é o seguinte: www.mayckxavier.com/public/Algoritmos_javascript.pdf

Estruturas de Controle

As estruturas de controles servem para, como o nome diz, controlar a execução do programa. Imagine que no sistema de uma loja virtual apenas maiores de 18 anos de idade podem realizar compras. Para isso é necessário checar se a idade do comprador é maior ou igual a 18 anos. Utilizaremos a estrutura de controle IF (Se) que serve para executar determinado código caso uma expressão retorne true.
Exemplo:

Nesse exemplo será testado se a idade do usuário é igual ou maior que 18 anos. Se o teste entre parêntesis retornar true, será executado o código entre as chaves. Esse exemplo é bastante limitado levando em consideração que nada acontecerá se o usuário tiver idade menor de 18 anos. Sempre que houver a necessidade de que um bloco de código seja executado se a expressão retornar false, basta adicionar a o bloco do ELSE (SENÃO) após os parêntesis do IF.

Se houver a necessidade de fazer mais de um teste, basta utilizar o ELSE IF.

Você pode perceber que utilizamos o operador lógico && para dizer ao ELSE IF que o valor do produto deve ser maior que 10 e menor ou igual a 20. Você pode utilizar quantos ELSE IF forem necessários.

Switch

O Switch é utilizado quando você precisa de comparações simples como, por exemplo, comparar se a letra digitada é uma vogal ou consoante.

Estruturas de Repetição

As estruturas de Repetição são utilizadas quando você precisa repetir um código várias vezes enquanto uma determinada condição não for satisfeita. Em Javascript existem 3 estruturas de repetição.

While

O while irá executar um bloco de código até que sua condição seja satisfeita. Veja o exemplo:

Acima temos um problema. O valor de num nunca será igual ou maior que 20, então o programa entrará no que chamamos de loop infinito. Ele entrará nesse bloco de código e executará infinitamente, geralmente travando a o seu navegador. Para que isso não aconteça, é necessário que você faça com que a variável num receba um valor que não satisfaça a condição do while. Um exemplo simples seria incrementar a variável a cada loop.

Pronto. Agora o while executará o código um número limitado de vezes e sairá logo assim que a condição não mais o satisfizer.

For

O for funciona do mesmo modo que o while, mas utilizando ele fica mais fácil não esquecer declarar uma variável ou incrementá-la. O For apresenta uma sintaxe mais definida.

Podemos ver que o for recebe 3 parâmetros. O primeiro é a variável com o seu valor inicial. O segundo é a condição que deve ser satisfeita e no terceiro parâmetro você pode incrementar a variável como eu fiz ou atualizar o valor dela.

Do/While

O Do/While é mais parecido com o while, porém ao invés de ele fazer o teste antes da execução do bloco, seu teste é feito apenas depois.

A grande diferença entre o While e o Do/While é que no do/while o código no bloco será executado pelo menos uma vez, mesmo se a condição não for satisfeita.

É isso aí pessoALL. Algumas pessoas pareceram interessadas quando eu disse que queria colocar algumas dicas de jQuery. Estou pensando também em falar um pouco mais sobre Code Igniter. O que acham?

Abraços

Mini curso de algoritmos com Javascript – Aula 4

Continuando com nosso mini curso de algoritmos com Javascript, veremos hoje Incremento e Decremento, e funcções.

Incremento e Decremento

Para incrementar em 1 uma variável, basta utilizar duas vezes o sinal “+” após a variável. Para decrementar em um, faça o mesmo, porém utilizando o sinal de “-”.
Exemplo:

Comentários

Comentários são utilizados quando você precisa descrever parte de um código ou apenas para sinalizar algo importante como um lembrete. Em Javascript existem comentários de linha e de bloco. É importante sempre fazer comentários quando for necessário.

O interpretador do Javascript irá ignorar tudo o que estiver comentado. No comentário de linha, tudo o que estiver após as barras será ignorado. Já no comentário de bloco, tudo o que estiver entre o “/*” e o “*/” será ignorado.

Funções

Algumas vezes será necessário que você execute uma mesma rotina várias vezes. Para que você não precise reescrever o mesmo código várias vezes, existem as funções. Uma função permite que você passe parâmetros para ela. A função irá realizar o bloco de código definido dentro das chaves com ou sem os parâmetros passados.
Exemplo:

No exemplo anterior nós temos a função “soma” que recebe dois números. Ela soma esses dois números e retorna o resultado da soma.
O comando return utilizado no final da função retorna a soma das duas variáveis que pode ser utilizado do lado de fora da função como mostra o exemplo baixo.

É isso aí pessoal. Na próxima aula veremos Estruturas de Controle e Estruturas de Repetição, que são fundamentais para o desenvolvimento de uma aplicação.
Abraços

Mini curso de algoritmos com Javascript – Aula 3

Continuando com o mini curso, hoje veremos como pegar dados dos usuários e operadores relacionais.

Pegando dados externos

Como já falamos anteriormente, para um programa funcionar ele deve ter uma entrada de dados para que eles sejam processados e serem enviados para uma saída. Utilizando o comando “window.prompt” do seguinte modo:

Ao executar o código acima, serão exibidas duas janelas no navegador, uma para cada comando “window.prompt” e o que for digitado será inserido na variável correspondente.

A opção “Impedir que esta página crie caixas de diálogo adicionais” foi adicionada pelo próprio navegador.
Agora que podemos pegar dados dos usuários, podemos utilizar esses dados para que nossos programas comecem a ter vida.

Exercício:
1 – Utilize as caixas de prompt (window.prompt) e faça um pequeno programa que peça alguns dados para o usuário e os imprima em tela, um por linha.

Operadores

Operador de Atribuição

Como já vimos anteriormente, para atribuir um valor a uma variável, é utilizado o sinal de “=”. Você pode atribuir valores numéricos, Strings e booleanos às suas variáveis.

Operadores Aritméticos

Operadores Aritméticos servem para calcular números e valores em variáveis. Em Javascript nós temos os seguintes Operadores Aritméticos:

Utilizaremos o sinal de % quando precisarmos ter o resto de uma divisão, diferente de / que retorna o resultado de um número dividido pelo outro.

Exemplo:

Operadores Relacionais

Os operadores relacionais são utilizados quando você precisa descobrir a relação entre um valor e outro. Os Operadores Relacionais são:

Os Operadores Relacionais retornam sempre um valor booleano, ou seja, true (verdadeiro) ou false (false). Podemos testar os operadores do seguinte modo:

Operadores Lógicos

Os operadores lógicos servem para se utilizar várias operações relacionais em uma mesma linha.

Os Operadores Lógicos “&&” e “||” seguem a lógica da tabela verdade, descrita abaixo:

Obrigado pelos comentários pessoal e até a próxima.