Artigo WebMobile 9 - Desenvolvendo um FotoBlog móvel com .NET

Artigo Originalmente publicado na WebMobile 9.

Esse artigo faz parte da revista WebMobile edição 09. Clique aqui para ler todos os artigos desta edição

Clique aqui para ler este artigo em PDF

Desenvolvendo um FotoBlog móvel com .NET

 

Não é de hoje que Blogs fazem parte de nossa vida. Todo mundo tem ou acompanha a rotina da vida de muitas pessoas através da internet. O FotoBlog em especial é o mais novo item nesses ‘diários’ digitais, onde as pessoas contam um pouco de sua história através de fotos tiradas de suas câmeras digitais.

Neste artigo, mostraremos como podemos simplificar um pouco a vida dessas pessoas. Criaremos uma aplicação para o Windows Mobile 5.0 que permitirá que pessoas tirem fotos com seus celulares e as enviem diretamente para um FotoBlog via um web service. Para isso, utilizaremos os novos recursos do Compact Framework 2.0 e do Visual Studio 2005.

Preparando o ambiente

Vamos iniciar o desenvolvimento de nosso sistema criando uma solution (conjunto de projetos no Visual Studio) que irá conter nossos projetos. Neste artigo, iremos criar três projetos diferentes: (1) uma aplicação para Smartphone que irá permitir que o usuário envie fotos diretamente de seu aparelho celular, (2) um Web Service para exibir os serviços de upload de fotos, e (3) um site para exibir o FotoBlog, conforme a Figura 1.

 

Figura 1. Aplicações que compõem o projeto do Fotoblog.

 

Para acompanhar o nosso desenvolvimento, você vai precisar instalar o Microsoft Visual Studio 2005 (http://www.microsoft.com/visualstudio) e o SQL Server Express Edition (http://msdn.microsoft.com/sql/express/) ou mesmo o SQL Server Standard.

Após termos estas tecnologias preparadas, o primeiro passo é a criação do web site que exibirá as fotos. Chamamos o projeto de ‘FotoBlogger’. Depois iremos criar mais dois projetos, um para o web service e outro para o Smartphone.

Para criação do web site, devemos abrir o Visual Studio e selecionar a opção File à New à Web Site para criar um projeto ASP.NET, conforme Figura 2.

 

Figura 2. Criando o projeto ASP.NET.

 

Em seguida vamos criar o banco de dados que usaremos na aplicação.

Criando o banco de dados

Antes de criar o site, o mais indicado é que definamos de antemão o esquema do banco de dados. Podemos fazer isso diretamente no Visual Studio. Para isso, devemos seguir esses passos:

(1)Primeiro crie um novo banco de dados através do Server Explorer, como na Figura 3. Caso o Server Explorer não esteja visível, clique na opção View à Server Explorer na barra de menus do Visual Studio 2005.

 

Figura 3. Conectando-se ao SQL Server.

 

(2)Selecionando ‘Create New SQL Server Database...’ a janela da Figura 4 será apresentada. Os campos da janela são bastante simples, e devemos preenchê-los como na figura. Note que o nome do servidor será o nome de sua máquina (nesse exemplo, VAIONOTE).

 

Figura 4. Criando o banco de dados.

 

(3)Vamos também criar as tabelas de forma visual. Para isso, ainda no Server Explorer crie um novo diagrama, conforme apresentado na Figura 5. Através deste diagrama poderemos criar as tabelas e os relacionamentos do nosso banco de dados de forma visual, sem usar comandos SQL.

 

Figura 5. Criando o diagrama das tabelas.

 

(4)Feito isso, iremos dividir o banco de dados em três tabelas: uma tabela (Blogs) para armazenar as informações sobre o FotoBlog, uma tabela (BlogEntry) que irá armazenar informações sobre as fotos enviadas ao FotoBlog e uma tabela (EntryComment) que irá conter os comentários feitos pelos usuários sobre uma foto.

 

Vamos começar pela tabela Blogs. Adicione uma tabela seguindo o esquema da Figura 6.

 

Figura 6. Estrutura da tabela ‘Blogs’.

 

Nesta tabela iremos armazenar o nome e a descrição de um FotoBlog e as informações do usuário que é o criador deste FotoBlog. Note que o campo chave ID deve ser especificado como Identity nas propriedades da tabela para que seu valor seja atribuído automaticamente pelo SQL Server.

Depois, crie a tabela que irá armazenar as fotos (BlogEntry) como na estrutura vista na Figura 7:

" [...] continue lendo...

Artigos relacionados