Sáb, 06 de Novembro de 2010 01:46
"Padronização - Conjunto de modelos ou normas aprovados para a elaboração de um produto. Padronizar, uniformizar, submeter a ou estabelecer um padrão."
Quando se começa a programar, o que mais se pensa é em propor soluções inovadoras e basicamente resolver problemas.
Porém, quanto mais se estuda, compartilha conhecimento, discute, pesquisa, testa, refina... mais complexo e prazeroso fica a arte de desenvolver softwares.
Soluções que seguem um padrão de desenvolvimento têm por vantagem ser mais fáceis de entender e dar manutenção, mas por outro lado, são um pouco mais trabalhosas de se planejar e implementar.
MVC nada mais é do que um padrão para desenvolvimento de projetos, sejam eles Web, Desktop ou Mobile.
O MVC é dividido em três níveis:
Model - Toda interação com banco de dados e manipulação de informações são feitas nesta camada;
View - É a camada de visualização, ou seja, tudo que o usuário vê é gerado por esta camada;
Controller - Onde são feitas todas as validações e controle do fluxo da aplicação;
Existem inúmeras discussões pela web, vários livros que tratam disso (Estou lendo e recomendo o livro Padrões de Projeto, de Erich Gamma), e vários conceitos formados em torno de qual é a melhor forma de usar o padrão MVC, e caso deseje, poderá ver neste link, e neste também mais sobre Padronização MVC.
O ciclo percorrido pelo nosso sistema trabalhará da seguinte forma:
Haverá um formulário onde o usuário deverá digitar seu login e sua senha.
Ao clicar no botão para enviar os dados, será feito inicialmente uma validação com javascript dos campos do formulário no lado cliente, e em seguida, através do conceito Ajax, enviaremos os dados fornecidos para um arquivo PHP, que fará a validação de consistência dos dados no lado servidor (Classe Controller), e chamará um método responsável por verificar se o usuário existe no banco de dados (Classe Model).
Em seguida, a Controller receberá da Model um objeto onde, baseado em seu estado, retornará para a classe responsável por exibir a mensagem que informa se o usuário existe ou não (Classe View).
A grande sacada de usar Ajax em nosso sistema é para que haja uma comunicação entre cliente e servidor sem que a página seja recarregada completamente.
Basicamente, este é o conceito de Ajax: Atualizar parte da página sem que o site seja totalmente recarregado (Fazendo ou não uma interação entre Cliente e Servidor). Simplesmente isso.
Para implementarmos o conceito de Ajax em nosso sistema, usaremos a melhor biblioteca javascript do mundo (na minha opnião), a jQuery.
Há também muito conteúdo na web sobre esta biblioteca, sua documentação é riquíssima, e aconselho a quem nunca a usou a pesquisar um pouco sobre ela.
Por quê usaremos jQuery?
Simples! O que se faz com umas trinta linhas de código javascript puro pode-se fazer em três usando jQuery.
A linguagem de programação que usaremos para trabalhar do lado servidor em nosso sistema é a PHP.
Estou trabalhando há um bom tempo com PHP, que tem uma sintaxe bem semelhante à Java (primeira linguagem de programação que tive contato), e gosto muito de trabalhar com ela. É uma linguagem fácil de implementar, tem bastante recursos e ótimo suporte a Programação Orientada a Objetos.
Não abordaremos aqui muita teoria sobre Programação Orientada a Objetos (Ou simplesmente POO). Mas vou citar um exemplo básico da diferença entre uma programação estruturada e uma POO.
Imagine o seguinte caso:
Em um certo sistema, tem-se dez telas que devem exibir uma listagem de determinados dados que se encontram em um banco de dados, por exemplo.
A codificação necessária para gerar tal listagem é de sessenta linhas.
Se tal sistema está sendo feito de forma estruturada, deverá se repetir para cada tela essas sessenta linhas de código para gerar a listagem.
Porém, se o sistema está sendo codificado com POO, poderá ser criado um Método (function no PHP) que gere tal listagem, e simplesmente chamá-lo em cada tela de listagem.
O resultado final será o mesmo em qualquer uma das duas soluções, exceto que:
- Na programação estruturada (também conhecida como Programação Orientada a Eventos), haverá dez blocos de sessenta linhas.
- Na POO, existirá apenas um bloco com sessenta linhas de código que poderá ser chamado quantas vezes for necessário, sem ter que escrevê-lo novamente.
E o mais importante na POO é que, neste caso, se for necessário modificar algo na listagem, será necessário apenas alterar o método, e assim todas as telas que usam esse bloco de código serão atualizadas dinamicamente.
Já na Programação Estruturada, seria necessário adaptar cada bloco de código, em cada arquivo que foi implementado.
Sacou a diferença?!...
Bem, já falamos um pouco sobre MVC, Ajax, jQuery, PHP e POO. Agora, vamos à prática.
A primeira coisa a se fazer é armazenar todos os arquivos de forma coerente em seus devidos diretórios.
Para isso, estruturaremos nosso projeto da seguinte forma:
Descrição dos diretórios e arquivos:
css - Todos os arquivos de formatação de conteúdo (.css) deverão ser armazenados neste diretório.
js - Arquivos javascript (.js) serão colocados aqui.
js > lib - Todas as bibliotecas usadas em nosso sistema deverão ficar neste diretório.
includes - Nome bastante conhecido entre os programadores web. Aqui colocaremos todos os arquivos que contêm programação PHP.
includes > controller - Arquivos da camada Controller do MVC, onde serão feitas as validações e o controle do fluxo do sistema baseado no que for recebido pela Model.
includes > model > bean - A classe-mãe, que contém todos os atributos trabalhados no sistema, Getters e Setters, é colocada neste diretório.
includes > model > dao - Interação com o Banco de Dados são implementadas nesta camada.
includes > view - o que é retornado em tela para o usuário (recebido pela camada Controller), vai aqui.
Obs.: Faz parte também da camada View o XHTML, CSS e Javascript, que estão separados em seus devidos diretórios. Porém, criamos a camada view à parte para tratar exclusivamente das respostas recebidas pela camada Controller.
Bem, estou disponibilizando aqui para vocês uma cópia exata da estrutura proposta acima, onde no arquivo index.php foram feitas todas as ligações entre o arquivo de formatação de conteúdo (layout.css), a biblioteca jQuery (jquery-1.4.2.js) e o arquivo javascript (functions.js) responsável pela validação dos dados no lado cliente e a interação com os arquivos no servidor via Ajax.
Também criei um formulário de login básico, com os campos Login e Senha, e um botão para enviar os dados.
Sinta-se à vontade para customizá-lo da forma que melhor lhe agrade.
Na próxima parte deste artigo, criaremos toda a estrutura MVC do nosso projeto.
Esta parte estará voltada exclusivamente para Programação Orientada a Objetos com PHP.
Até breve!
Para baixar o projeto estruturado até esta parte, clique aqui »
Login dinâmico em AJAX - PHP | Padrão MVC | jQuery
Receba em seu e-mail artigos, notícias e dicas sobre Desenvolvimento, Soluções e Negócios Web e Desktop.
Cadastre-se já »
Interaja com seus clientes tendo em seu site Joomla um Mural de Recados com Foto...
Saiba mais sobre o MyMural »
Técnico em Sistemas de Informação, Web Developer e cursando Faculdade de Tecnologia em Banco de Dados, atuo no Desenvolvimento de Sites, Sistemas Web e Desktop desde 2008.
Dentre as tecnologias que trabalho, estão PHP, Java, jQuery, Ajax, Joomla, MySQL, PostgreSQL, Design Patterns, Adobe CS3, Corel, XHTML, CSS e Padrões Web.
Para mais informações sobre desenvolvimentos web e desktop, leia meus artigos, conheça as soluções que ofereço ou entre em contato.
Comentários
E a View é uma camada 'template'.. pois, cada function contida nela gera uma tela diferente...
Isso pra muitos seria considerado como um arquivo do tipo template (.tpl)...
Conheço diversos programadores que usam diferentes IDE's pra desenvolvimento PHP...
Depende muito do SO (Windows ou Linux)...
Mas no geral... Netbeans 6.8 e Dreamweaver CS3 são os mais usados atualmente.
Eu particularmente uso o Dreamweaver.. não só pelo fato do PHP.. mas comparado ao NetBeans ele tem mais suporte ao HTML e CSS.. o que uso muito atualmente..
Também tem plugin para a jQuery, que ajuda muito nos "Ctrl + Barra de espaço"... na hora de sugestões de códigos, funções, etc.
Mass... aí vai de você..
Teste pelo menos esses dois, e veja qual fica melhor..
Se for ficar só com PHP, acho que o NetBeans é melhor, viu...
Mas vai de cada um..
Falou
Qual é a melhor IDE para desenvolver em PHP com essas demais tecnologias.
Meus parabéns pelo artigo.
Abraços
Foi uma ótima observação sua..
Na verdade, no último artigo da séria vou dedicar, não só para a conclusão do projeto em si.. mas para sanar algumas dúvidas e dar algumas dicas sobre o desenvolvimento MVC...
Mas em resumo.. é o seguinte.
Você já deve ter lido por aí que a validação dos dados deve ser feita tanto do lado Cliente quanto no lado Servidor..
Sendo assim..
No lado Cliente, roda o Javascript... que fará as validações iniciais, (e também será responsável pelo envio dos dados informados via AJAX)
e no lado Servidor, roda o nosso PHP...
Se você ler a segunda parte desses artigos, verá que o arquivo UsuarioControll er.php, além de validação dos dados, é responsável por 'coletar as informações enviadas pelo formulário'... e 'resolver' pra onde mandará tais informações, e o que fará com os resultados recebidos...
É isso aí..
no próximo e último artigo da série, darei mais detalhes do mesmo.
Falou
Conforme você descreveu (já lí em vários artigos também) sobre a camada "view", ela é responsável por apenas apresentar informações ao usuário. Já a camada "controller" está encarregada de todo o fluxo da aplicação e as validações necessárias.
Dúvida: Em uma observação no artigo, você disse que o Javascript que faz as validações do formulário fazem parte da camada "view". O Javascript não deveria compor a camada "controller"?
Abraços.
Para Joomla, existe um componente que funciona como um Chat em tempo real...
Instelei-o no site de uma empresa que precisava de algo parecido, e é bem simples de usá-lo..
O nome do componete é: jPFChat ..
Agora... pra fazer na unha essa funcionalidade aí... terá de usar basicamente o mesmo esquema de qualquer sistema que usa ajax: No servidor existe a programação que recebe o que foi enviado e cadastra em um banco de dados... e no lado cliente existe uma Thread que fica 'perguntando' pro servidor se existe registro novo...
Esperando pelos demais...
Parabéns!!
Obrigado e Parabéns!!
RSS feed for comments to this post.