Desenvolvendo para web: por onde começar afinal ?

Salve!

Se você é programador a mais de 2 anos, provavelmente não começou programando como todos essas coisas que ouvimos nas conferências ou que temos lido durante esses últimos tempos.

Alguns, talvez muitos dos programadores web são na verdade web developers, ou seja, uma mistura de programador com designer e como um bom developer você deve saber que se não manter-se atualizado, você está fora da tecnologia, afinal, somos provedores de tecnologia de uma forma ou de outra =)

Hoje muitos desenvolvem nos moldes de meados de 1999/2003, ou seja tem as características:

  • Programação procedural
  • HTML sem muita "frescura" para que fechar a tag body se ela não faz diferença mesmo ?
  • Estrutura do site em tabelas
  • Site for I.E only (Apenas para Internet Explorer)

Mas é claro que você dá valor aos clientes, e também pretende continuar no ramo, então, você decide se atualizar, mas antes de fazer qualquer coisa logo vem a pergunta à mente: "Por onde começar ?"

Como diria nossa "ministra", relaxa e ... continua lendo!
Não é nada fácil querer abraçar o mundo de um dia para o outro, então você precisa ir aos poucos! Vamos lá...

1. Programação O.O
Trocando em miúdos: Programação Orientada à objetos. Essa técnica consiste em desenvolver uma aplicação mas visando o lado que tudo (ou quase tudo) é um objeto. Até para um programador que sabe o que é e usa todo dia se você perguntar o que é programação Orientada à objetos ele vai parar, pensar e talvez até indagar: "O que é mesmo Orientação a Objetos ?". Então, não se assuste com isso e também não precisa treinar a resposta para essa pergunta no espelho para ficar preparado quando te perguntarem :)

Bom, chega de papo... usando o "PHP procedural" como você faria para:

      Acender uma lampada
      verificar seu status
      Apaga-la
      Verificar novamente seu status ?

Com a programação procedural, poderia ser assim:

PHP:
  1. <?php
  2.  
  3. $status = "Desligada";
  4.  
  5. if($status == "Desligada") {
  6.     $status = "Ligada";
  7.     print "Acendendo a luz: Acendeu a lampada!<br>";
  8.     print "Estado atual da lampada: " . $status . "<br />";
  9. }
  10.  
  11. if($status == "Ligada") {
  12.     $status = "Desligada";
  13.     print "Apagando a luz: Apagou a lampada!<br />";
  14.     print "Estado atual da lampada: " . $status;
  15. }
  16. ?>

Agora, com a programação O.O:

PHP:
  1. <?php
  2.  
  3. class Tomada {
  4.  
  5.     public $TOMADA;
  6.  
  7.     public function acende() {
  8.         $this->TOMADA = "Ligada";
  9.         return "Acendeu a lampada!";
  10.     }
  11.    
  12.     public function apaga() {
  13.         $this->TOMADA = "Desligada";
  14.         return "Apagou a lampada!";
  15.     }
  16.    
  17.     public function estadoAtual() {
  18.         return $this->TOMADA;
  19.     }
  20. }
  21.  
  22. // Instanciando o objeto
  23. // Esse objeto não precisa ser instanciado nesse arquivo, aqui é apenas um exemplo
  24. $tm = new Tomada();
  25.  
  26. print "Acendendo a luz: " . $tm->acende() . "<br />";
  27. print "Estado atual da lampada: " . $tm->estadoAtual() . "<br />";
  28. print "Apagando a luz: " . $tm->apaga() . "<br />";
  29. print "Estado atual da lampada: " . $tm->TOMADA;
  30. ?>

A saída de ambos no browser é a exibida abaixo:

[img] resultado

Com O.O.P a mesma rotina ficou mais clara, mais organizada, e o principal: reutilizável! Apenas instâncio a Tomada() onde eu precisar e consigo acender/apagar as lâmpadas! :D

NOTA: Destaque para a linha 27 e 29. Vejam que em ambas eu acho o status da lâmpada, porém, de formas diferentes. Tentem descobrir o por quê!

Infelizmente não posso ficar falando apenas de O.O.P, vamos partir para o próximo assunto!

2. Organize seus dados com XML
Já ouviu falar de XML antes ? Acredito que sim.
O XML (eXtendend Markup Language) tem toda uma história e tragetória por trás, porém, não é o foco aqui entrar nesses detalhes nem no histórico do XML. O importante é entender o que é, para que serve e como funciona. Tendo esses principios, você já poderá começar a definitivamente brincar com XML.

  • XML é uma linguagem de marcação que armazena todo tipo de informação que você precisar.
  • Como já dissemos, ele serve para armazenar dados de qualquer tipo

Um exemplo de uma informação no XML seria:

XML:
  1. <?xml version="1.0" encoding="ISO-8859-1" ?>
  2. <faqs>
  3.     <faq>
  4.         <categoria>Duvidas gerais</categoria>
  5.         <pergunta>O que é XML ?</pergunta>
  6.         <resposta>É exatamente isso que você vê!</resposta>
  7.     </faq>
  8.  
  9.     <faq>
  10.         <categoria>Duvidas gerais</categoria>
  11.         <pergunta>O que é XML ?</pergunta>
  12.         <resposta>É exatamente isso que você vê!</resposta>
  13.     </faq>
  14.  
  15.     <faq>
  16.         <categoria>Duvidas gerais</categoria>
  17.         <pergunta>O que é XML ?</pergunta>
  18.         <resposta>É exatamente isso que você vê!</resposta>
  19.     </faq>
  20.  
  21.     <faq>
  22.         <categoria>Duvidas gerais</categoria>
  23.         <pergunta>O que é XML ?</pergunta>
  24.         <resposta>É exatamente isso que você vê!</resposta>
  25.     </faq>
  26.  
  27.     <faq>
  28.         <categoria>Duvidas gerais</categoria>
  29.         <pergunta>O que é XML ?</pergunta>
  30.         <resposta>É exatamente isso que você vê!</resposta>
  31.     </faq>
  32. </faqs>

A saída dele no browser seria algo como isso:

[img] modelo xml

Claro que para ficar interessante precisaria jogar um estilo nessa informação para ser exibida adequadamente e tudo mais. É para isso que existe o XSL (Outra coisa para pesquisar ;) )

3. xHTML. HTML mais extensível e mais dentro dos padrões
xHTML não difere muito do HTML que conhecemos há tempos. Ele tem algumas regras que sendo seguidas garatem que nosso documento estará sendo exibido adequadamente aos nossos visitantes/clientes.
Alguns pontos interessantes:

  • Definir um doctype
  • Escrever tags atributos e elementos em minusculo. < p > < /P > é errado!
  • Fechar todas as tags! < p >< /p > e < br / >
  • Usar o atributo alt para imagens. Afinal não são todos que acessam a net com browsers que renderizam imagens!
  • Tag's em ordem: < strong >< em >< /strong >< /em > é errado!

Como ele não muda visualmente do HTML, não tem muito o que mostrar. É testar e acostumar-se com a prática.

4. Tableless
O Tableless é uma metodologia de desenvolvimento, e não uma tecnologia ou ferramenta de trabalho como alguns ainda pensam. Há um bocado de motivos para usar o tableless nas suas aplicações, não vou focar nisso aqui, pois existem artigos que explicam muito bem isso! São exemplos:

5. E muito mais...
Acha que acabou ? Pois bem, vamos citar mais algumas coisas:

  • Frameworks de desenvolvimento
  • Javascript / DOM e Ajax
  • MVC
  • Design Patterns
  • CSS, XSL
  • Site Multiplataforma. Para este, vale a dica seguir as especificações W3C de desenvolvimento.

Ufa! Que tal concluir o post ?
Ok! Ficou cansado com o tour ? Ficou preocupado ? Não se espante! Siga a ordem que apresentei aqui, ou qualquer outra ordem que prefira, só não queira aprender tudo de uma vez da noite para o dia, porque neste caso, você não vai conseguir entender como as coisas funcionam!

Bom estudo ! ;)

Fork me on GitHub
147457885827fdf2d384532e822735e1delicious


7 comentários para “Desenvolvendo para web: por onde começar afinal ?”

  1. Pra quem vai trabalhar com pginas dinmicas no lado do cliente, eu aconselho tb o jquery[1].
    Tenho usado muito esse carinha tanto pessoal como profissionalmente, alm do que, achei ele muito mais leve que o MochiKit e o Dojo.

    Muito bom post!

    [1] – http://www.jquery.com

  2. hlegius says:

    Gabriel falco, no conhecia essa framework, mas pelo pouco que li, parece ser muito bom. Atualmente eu tenho usado Dojo, porm como voc mesmo disse, ele meio pesado, principalmente nos “efeitos visuais”.

    Obrigado pela sua dica ;)

  3. Sryche says:

    Muito bom o post. Esclareceu um monte de coisas sobre Programao para Web.

  4. Fábio Fonseca says:

    Poderia complementar o tópico com algumas dicas de livros, mais informações para quem esta começando agora e não sabe nada de programação, talvez até um novo tópico para quem esta começando a programar agora em php e quer chegar à certificação, é só uma dica. Eu mesmo gostaria de umas dicas de livros para programação orientada a objetos em php tanto em português (de preferência atores brasileiros para não tem problemas com a tradução) como em inglês. Obrigado

  5. Olá amigos, adorei o tópico muito bom!

    Como vejo vcs são programadores muito mais experientes que eu, pensei que vcs poderiam me dar uma ajuda.
    Sou estagiário em programação e me formo Técnico em Programação no fim deste ano, e para tal mérito preciso desenvolver um projeto e o mesmo é um site com programação em PHP que acende e apaga uma lâmpada, Ano passando fiz um com programação em C++ o.o onde acendia lâmpadas através da Porta Paralela, enfim se alguem tiver alguma dica de como se acender uma lâmpada com PHP ficarei grato, obrigado!
    Roger Altieles

Comente !