Um projeto com uma estrutura organizada poupa mais de 80% do seu tempo e trabalho. Veremos nesta 10º aula do curso de web como tirar aproveito desse ambiente e como usá-lo na prático em um projeto web.

Muitas pessoas, principalmente quem está começando a estudar neste curso de web, não utiliza um padrão na estrutura de seu trabalho e isso como foi dito, dificulta muito a criação e a modificação no projeto.

Para começar, tenhamos em mente que o objetivo principal da organização de dados é separar os tipos de arquivos. Falando tecnicamente, nosso projeto deverá ter uma pasta para o css, outra para o javascript, uma para as classes php e outras ainda para as imagens. Utilizamos este tipo de organização para qualquer tipo de arquivo.

Quando você usa um framework, provavelmente segue um padrão. Falando dos frameworks mais conhecidos, todos utilizam o padrão MVC, mas isso falaremos em outro post referente ao Curso de Web. :)

Vejamos como ficará nossa estrutura na prática.

Iremos precisar obviamente de uma pasta para guardar as imagens do projeto, portanto vamos criar agora uma pasta para a imagem que irá se chamar ‘img’. Simples não?

… [Diretório]
img/
index.php

Pasta IMG
Nesta pasta poderemos criar subpastas como por exemplo: usuários, layout, noticias, paginas, banners e etc.

Vou descrever como seria cada pasta citada acima.

  • usuarios: Nesta pasta ficará armazenado as imagens dos usuários que fazem upload em seus perfis.
  • layout: Nesta pasta terá somente imagens usadas no layout do site como: logo, menu, rodapé e etc.
  • noticias: Aqui iremos colocar imagens de notícias.
  • paginas: Esta página irá receber imagens específicas de cada pagina (home, contato, quem somos), na mesma poderá ter subpastas para sua melhor organização.
  • banners: Aqui colocaremos os banners do site.

Agora precisamos guardar nossas folhas de estilo CSS. Crie uma pasta chamada ‘css’.
… [Diretório]
img/
css/
index.php

Na pasta CSS terá as nossas folhas de estilo, podemos agora ir para o próximo passo. ;)

Vamos criar agora uma pasta para guardar nossos arquivos Java Script. Crie uma pasta chamada ‘js’.

… [Diretório]
img/
css/
js/
index.php

Está ficando bom! Agora para você que trabalha com php ou outra linguagem de servidor(asp, jsp), crie uma pasta chamada de ‘class’.

… [Diretório]
img/
css/
js/
class/
index.php

Na pasta ‘class’ iremos colocar somente classes dinâmicas que nosso site utiliza.

Para quem trabalha com linguagem dinâmica(php, asp, jsp), crie uma pasta chamada ‘view’.

… [Diretório]
img/
css/
js/
class/
view/
index.php

Na pasta view iremos colocar as paginas interna do site, ou seja, a index que incluirá(include) as páginas pertencentes a view. A pasta view provavelmente terá subpastas.

Se você utilizar outros arquivos como videos, documentos, musicas. Basta criar as pastas com o nome correspondente.

Simples não é? Depois de um tempo isso se tornará um habito, muito produtivo por sinal.

OBS: Para quem não trabalha com páginas dinâmica, usa-se as seguintes pastas:

… [Diretório]
img/
css/
js/
index.php

Chegamos ao fim de mais uma aula do Curso de Web.