Desenvolvimento com tecnologia Microsoft e Interoperabilidade
Twitter: @vbs_br
Facebook: vbatistadesouza
LinkedIn: viniciusbatista

Comércio eletrônico com o WebMatrix

O WebMatrix evoluiu e agora traz ainda mais facilidades para você desenvolver suas aplicações. Você pode fazer o download aqui e descobrir tudo o que a ferramenta pode te oferecer.

O WebMatrix é a nova ferramenta de desenvolvimento web da Microsoft focada em interoperabilidade e simplicidade. Com o WebMatrix, é possível desenvolver utilizando PHP ou Asp.Net e ainda utilizar web aplicações open source como o WordPress, por exemplo, utilizando o Web App Gallery direto na interface da ferramenta.

O WordPress é, sem dúvida, um dos projetos open source mais conhecidos e utilizados atualmente para o desenvolvimento de sites. Mas e se eu quiser desenvolver um e-commerce?

No App gallery do WebMatrix, temos a categoria e-commerce com 11 opções de projetos open source, até o momento da edição deste artigo. Falarei nestse artigo especificamente de uma dessas opções, o nopCommerce.

O NopCommerce é um e-commerce desenvolvido em ASP.NET 4.0 e SQL Server 2005. É dividido em duas aplicações: o frontend (catálogo de produtos) e o backend (administrativo). O frontend será o ponto de contato com os usuários – é a vitrine de sua loja virtual; e o backend oferece funcionalidades para administração de produtos, campanhas promocionais, usuário e etc.

Agora que dei um pequeno insight sobre o NopCommerce vamos começar a pôr a mão na massa. Abra o WebMatrix. Se você ainda não tem o WebMatrix, faça o download aqui. Abrindo o WebMatrix, abra o App Gallery.

Escolha a categoria eCommerce e selecione o nopCommerce. Defina um nome para a sua loja e clique em next.

Aceite o termo de uso para realizar o download do nopCommerce.

Assim como o WordPress, o nopCommerce possui duas etapas de instalação. A primeira instalando fisicamente os arquivos e o script do banco de dados, e a segunda realizada no navegador. A primeira parte acabamos de realizar: baixamos o projeto da internet e fizemos a instalação sem sair da ferramenta. Clique sobre a url apresentada.

Ao clicarmos sobre o link, no meu exemplo http://localhost:11360, seu navegador padrão será aberto para completar o processo de instalação.

O processo de instalação é simples, mas requer atenção na escolha do banco de dados utilizado. Existem duas opções: SQL Server (or SQL Express) ou ainda o SQL Server Compact, que é instalado juntamente com o WebMatrix.

Primeiro definiremos o usuário-administrador da nossa loja virtual. Inclua seu e-mail e senha e clique no check box “create sample data”, para que tenhamos uns produtos de exemplo cadastrados no banco de dados.

Se você possuir o SQL Server Express instalado, considere utilizá-lo, principalmente se estiver pensando em fazer algo já para publicar. Mas, se estiver utilizando apenas para fins de teste e conhecimento, pode utilizar o SQL Server Compact.

Seguindo com o SQL Server Express, você terá de informar o nome do servidor e o nome do banco de dados. Se você seguiu a instalação padrão, a instância se chama SQLEXPRESS, então no campo “SQL server name”, informe SQLEXPRESS ou o nome da sua instância. No campo “Database name”, informaremos o nome do banco de dados que será criado em nosso servidor. Para este exemplo, utilizarei DB_NOPCOMMERCE. (obs: certifique-se de selecionar a opção “Create database if it doesn’t exists” para que o banco seja criado, caso não exista).

O segundo conjunto de campos é para definirmos o tipo de autenticação utilizada, SQL Server Account ou Integrated Windows Authentication. É preferível que seja utilizada a autenticação com uma conta do  SQL  Server, mas para fazer isso é necessário que seja alterada uma configuração no servidor para permitir a conexão. Após a instalação do SQL Server Express, o único modo habilitado é o integrated Windows authentication.

Utilizarei a conta SA (system administrator) do banco de dados, mas essa não é uma prática aconselhável, pois, além dos problemas de segurança envolvidos, dificilmente você vai utilizar a conta do SA nos banco de dados do serviço de hospedagem.

Após definir todos os parâmetros, clique em install e espere até que o processo seja concluído.

Ao término do processo, você será redirecionado para a homepage do nopCommerce, a porta de entrada da sua loja virtual. O layout é simples, mas funcional, e você pode alterá-lo ou ainda utilizar algum tema disponível neste link.

Já temos uma loja virtual funcionando sem ao menos digitar uma linha de código e, ainda, recheada de funcionalidades!

Conhecendo a estrutura da aplicação

O nopCommerce utiliza o MVC 3 com razor view engine, o código fonte da aplicação está disponível no Codeplex. Aconselho fazer o download e dar uma olhada, o código está muito bem estruturado e utiliza vários padrões de desenvolvimento.

Antes de começar a alterar o código do projeto, recomendo estudar o framework MVC e seguir as sugestões do time de desenvolvedores do projeto.

O nopCommerce está em contínuo desenvolvimento. A versão atual (até a data deste artigo) é 2.30 – alterar qualquer código do núcleo do projeto vai gerar sérios problemas durante o upgrade de uma nova versão. Pensando nisso, o time de desenvolvedores abusou de Interfaces, injeção de dependência e Partial classes.

O método preferível de estender o nopCommerce é utilizar a arquitetura de plugins mas, às vezes, a arquitetura de plugin pode não ser suficiente. Veja alguns cenários e como proceder para evitar problemas futuros.

Alterar o design de uma view

É recomendável a criação de uma nova pasta na pasta de temas, que seja duplicado toda a estrutura das views que deseja modificar e que seja modificada a cópia. Depois de reinicializar o website, a nova view será utilizada.

Adicionar uma nova ação, visão ou modelo

Crie um novo controle, faça tudo o que puder para evitar alterar as classes desenvolvidas pelo nopCommerce team. Rotas podem ser manipuladas facilmente, mas realizar “merging” das alterações em uma classe grande é um processo chato e penoso. Não adicione um novo Controller para cada nova ação, qualquer Controller desenvolvido por nós pode ser alterado quantas vezes se faça necessário. Agrupe as ações de acordo com o seu contexto. Por exemplo, não inclua uma ação de produto em uma classe de consumidor.

Adicionando informações adicionais a um view model

Utilize o primeiro cenário. Se não conseguir incluir a nova funcionalidade em questão, em um novo Controller, Action e novo modelo então será necessário alterar o modelo de visão diretamente. Nesse caso, inevitavelmente, você terá que realizar alterações no framework nopCommerce que não poderão ser feitas em um novo arquivo.

Evite mudanças sempre que possível, mas, se realmente for necessário, evite a criação de um padrão não natural apenas para evitar essa alteração.

Alterando a implementação de um serviço

Se não gostar como um determinado serviço realiza certo cenário, você pode criar uma nova classe para o serviço estendendo a interface utilizada pelo serviço. Implemente cada método definido na interface como desejar e atualize o registro de dependência para utilizar a classe nova.

Adicionando uma nova propriedade a um modelo de dados

Crie uma classe parcial (Partial class) para a entidade existente. Adicione os métodos, as propriedades e os campos na nova classe parcial. A classe de mapeamento deverá ser atualizada para mapear as novas propriedades para suas respectivas colunas na tabela do banco de dados.

O WebMatrix tem muito a oferecer! Conheça a ferramenta e saiba como tirar vantagem dela.

Faça o download agora mesmo, clicando aqui, e conheça estas e outras novidades do WebMatrix 2.0 Beta!

Veja também o centro de treinamento do WebMatrix.

 

Até mais!

2 comments

  1. Romildo /

    Mensagem sinalizada Quinta-feira, 16 de Agosto de 2012 22:15

    Olá, Vinicius, muito clara as suas explicações sobre o WebMatrix.

    Pena que tenho muita dificuldade p/ entender os menus do programa em Inglês… Vc sabe se já existe o WebMatrix em Português?

    Agradeço a sua atenção.

    Abraço.

    Romildo

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>