Sobre henriquevreis

Formado em Analise em desenvolvimento de Sistemas na PUC-PR em Londrina, PR. Atualmente como CFO e Especialista em desenvolvimento de Sistemas Web na empresa Leanwork Tecnologia em Londrina, PR.

Obtendo o index pela iteração do “foreach” (C#)

Sabemos que a iteração do “foreach” na linguagem do C# não conseguimos diretamente obter seu o index, algumas vezes temos que utilizar iterações com “for” para conseguirmos realizar tal êxito, e sua consequência é fazer indexação das propriedades dos objeto, Ex: Collection[i].PropertyName;

Neste post iremos elaborar uma Extension para conseguirmos o index dos objetos na iteração “foreach”.

Segue o código de exemplo:

1:  class Program  
2:  {  
3:    static void Main(string[] args)  
4:    {  
5:      var pessoas = new List<Pessoa>();  
6:    
7:      pessoas.Add(new Pessoa { Nome = "Fulano" });  
8:    
9:      pessoas.Add(new Pessoa { Nome = "Cicrano" });        
10:    
11:      pessoas.Each((pessoa, index) => {  
12:    
13:        Console.WriteLine("Index: {0} - Nome: {1}\n", index, pessoa.Nome);  
14:    
15:      });        
16:    }  
17:  }  
18:    
19:  class Pessoa  
20:  {  
21:    public string Nome { get; set; }  
22:  }    
23:    
24:  static class EachExtensions  
25:  {      
26:    public static void Each<T>(this IEnumerable<T> collection, Action<T, int> action)  
27:    {  
28:      int index = 0;  
29:      foreach (var obj in collection)  
30:      {  
31:        action(obj, index++);  
32:      }  
33:    }  
34:  }  

Como podemos observar o código acima, é criado uma lista de objetos do tipo Pessoa, e logo em seguida iteramos a listagem.
Analisando a classe estática “EachExtensions” nela tem o método “Each” e é através desse método que é feito a manipulação da criação dos índices nos objetos. Nesse método (Each) recebe uma “Action”, dentro desse método iteramos a collection e logo em seguida criamos suas ações, onde a ação é à indexação de cada objeto iterado.

Bom pessoal espero ter ajudado até o próximo post, abraços.

Anúncios

ASP .NET MVC Scaffolding (CodePlex) com Nuget

Nesse post irei apresentar a parte de uma série sobre o pacote NuGet do MvcScaffolding.

O que é o MvcScaffolding?

Não é nenhum tipo de padrão de projeto, na verdade é um projeto CRUD pronto com suas funcionalidades já implementadas, estando disponível no codeplex.
O exemplo que iremos apresentar é um projeto bem simples, a implementação será de uma classe onde chamaremos de Cliente e é através dela que iremos fazer a parte do CRUD utilizando o package do Nuget pelo VS2012. A versão é beta então algumas das funcionalidades podem ainda ter problemas, no final desse post irei deixar a referência da implementação e o blog do criador desse pacote, mas isso não deixa de ser um bom exemplo para podermos praticar.

Passo-a-Passo:
1- Iremos criar um novo projeto ASP .NET MVC 3 ou 4 Web Application;

CreateProject_mvc_scaffolding
2- Selecionar o template do projeto como Empty ou InternetApplication com a ViewEngine do Razor;

Select_Template_Project3- Install o MvcScaffolding package.

Install_package

4- Criaremos nossa classe para podermos aplicar o Scaffold;

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MvcScaffoldingSample.Models
{
    public class Cliente
    {
        public int Id { get; set; }

        public string Nome { get; set; }

        public int Idade { get; set; }
    }
}

5- Próximo passo é criar o Scaffold Controller da Classe Cliente

Scafoold_Controller_Cliente6- Rodamos o projeto 
Na url colocamos http://locahost:../clientes, pronto podemos já adicionar, editar, excluir e ver os detalhes de nossa implementação;

create delete details list
7- Caso você não tenha o SQL Server instalado
Execute o comando no package source novamente com o comando

PM> Install-Package EFCodeFirst.SqlServerCompact

8- Podemos também forçar a criação do repositório da entidade “Cliente”

Force_Repository

public interface IClienteRepository : IDisposable
{
    IQueryable<Cliente> All { get; }
    IQueryable<Cliente> AllIncluding(params Expression<Func<Cliente, object>>[] includeProperties);
    Cliente Find(int id);
    void InsertOrUpdate(Cliente cliente);
    void Delete(int id);
    void Save();
}

Bom pessoal é isso, como podemos observar praticamente não fizemos quase nenhuma codificação e com a ajuda do Package Scaffold temos uma noção básica de como podemos dar criação aos nossos projetos web. Se quiserem podem acessar o link que está de referência logo abaixo, nesse link tem mais detalhes sobre o assunto.

Referências:

Abraços, até mais.

Model Binding (ASP .NET MVC) – Parte 1

Olá pessoal!

Neste post, iremos dar início a uma série sobre o mecanismo do ASP.NET MVC conhecido por Model Binding, iremos apresentar seus recursos e principais características.

Nesta primeira parte iremos entender o que é o model binding, suas funcionalidades no MVC, a facilidade de se utilizar e como nos ajuda em nossos projetos.

O QUE É MODEL BINDING?

É o processo de criar objetos a partir de dados enviados pelo browser. Mesmo sem saber, utilizamos Model Binding a todo momento. Isso acontece quando implementamos actions que recebem parâmetros com valores primitivos ou até mesmo objetos complexos.
Nesse caso o framework .NET MVC precisa tratar as requisições de forma que possa passar valores apropriados nos parâmetros.

Nesse primeiro exemplo iremos implementar uma action bem simples, que irá ser responsável por recuperar no seu parâmetro valor do tipo inteiro.

1- Vamos ao exemplo:
Primeiro: Iremos criar um novo projeto do tipo ASP .NET MVC 3 ou 4 Web Application, pode ser do tipo Empty.

Segundo: Adicionaremos um Controlador chamando-o de HomeController com duas actions: Index e ExemploBinder. Na action de ExemploBinder irá ter uma variável como parâmetro do tipo inteiro com o nome de valor.

public class HomeController : Controller
{        
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult ExemploBinder(int valor)
    {
        return RedirectToAction("Index");            
    }
}

Terceiro: Adicionaremos uma View chamando-a de Index e criaremos um formulário com dois inputs: <input type=”text” name=”valor” /> e <input type=”submit” value=”Enviar” />.

1:  <h2>Model Binding (ASP .NET MVC) - Parte 1</h2>  
2:  <form action="@Url.Action("ExemploBinder")" method="post">    
3:    <table>  
4:      <tr>  
5:        <td>Valor:</td>  
6:        <td>  
7:          <input type="text" name="valor" />  
8:        </td>  
9:      </tr>      
10:      <tr>  
11:        <td colspan="2" style="text-align: right">  
12:          <input type="submit" value="Enviar" />  
13:        </td>  
14:      </tr>  
15:    </table>  
16:  </form>   

2- Envio dos valores:

Após termos implementado e configurado actions, controller e formulário, vamos ao envio dos valores. Digite qualquer valor do tipo inteiro campo e clique em enviar.

action

Como podemos observar na imagem acima, colocamos  um break point na action para podermos visualizar o valor que está sendo enviado. Nesse caso o valor foi 43 e no envio para a action por de trás o MVC fez o binder para a variável no momento que foi invocado a action.

3- Alguns conceitos:

Todo model binder implementa a interface de IModelBinder, o framework MVC já possui seu próprio model binder default (DefaultModelBinder). O mesmo é utilizado para recuperar os valores que são enviados nas requisições e bindar aos objetos ou tipos de valores que são enviados, e claro também faz a sua implementação do IModelBinder. O DefaultModelBinder segue uma sequência para bindar os valores que são enviados, a sequência segue abaixo:

1- Request.Form
2- RouteData.Values
3- Resquest.QueryString
4- Request.Files

Pela sequência podemos ter uma noção clara e objetiva de como o MVC faz seu mecanismo, quando o envio é realizado o DefaultModelBinder irá bindar a um objeto que atenda com as seguintes assinaturas, conforme apresentado abaixo:

1- Request.Form[“valor”],
2- RouteData.Values[“valor”],
3- Request.QueryString[“valor”],
4- Request.Files[“valor”].

No exemplo que implementamos o binder foi feito apartir do Request.Form, nesse caso foi o primeiro que atendeu as necessidades do framework. A imagem abaixo segue de como ficou o enviou:

request_form

Como podemos notar o tipo de valor que está sendo enviado é do tipo “string”, mas na action que apresentamos, ficou responsável por recuperar valor do tipo inteiro e a responsabilidade é do framework de invocar o seu método BindeModel, isso é feito para recuperar os valores que necessitamos (nesse caso valor do tipo inteiro).

Bom pessoal, por enquanto ficamos por aqui. É um exemplo simples, mas o conceito que é empregado por trás dessa plataforma é incrível. Em breve iremos dar continuidade a mais recursos que são empregados, criaremos mais exemplos e também implementaremos nosso próprio IModelBinder customizado.

Abraços, até o próximo post.

Básico de JavaScript com jQuery

Para um desenvolvedor web é essencial que se tenha uma noção básica sobre a linguagem JavaScript. O JavaScript é uma linguagem de script baseada em ECMAScript padronizada pela Ecma international sendo atualmente a principal linguagem para programação client-side em navegadores web. O jQuery é uma biblioteca JavaScript cross-browser desenvolvida para simplificar os scripts client-side que interagem com o HTML, sendo também uma biblioteca essencial para seletores dos elementos.
Nesse tutorial iremos fazer um simples exemplo da utilização da linguagem JavaScript e sua biblioteca de extensão o jQuery.

1- Vamos ao exemplo:
Exemplo JavaScript com jQuery
Como podemos observar a imagem acima o exemplo é bem simples. O usuário escolhe o tipo de operação(somar, dividir, multiplicar ou subtrair), insere dois valores(valor1 e valor2) e faz o cálculo dos dois valores com o tipo de operação que foi escolhido. Simples né!?

2- Implementação HTML

1:  <h2>Exemplo - JavaScript com jQuery</h2>  
2:  <table border="1" cellpadding="10" cellspacing="0">    
3:    <tr>  
4:      <td>Operação: </td>      
5:      <td>        
6:        <input type="radio" name="operacao" value="somar" checked="checked"/> Somar   
7:        <input type="radio" name="operacao" value="dividir" /> Dividir   
8:        <input type="radio" name="operacao" value="multiplicar" /> Multiplicar   
9:        <input type="radio" name="operacao" value="subtrair" /> Subtrair   
10:      </td>      
11:    </tr>  
12:    <tr>  
13:      <td>Valor 1:</td>  
14:      <td>        
15:        <input type="text" name="valor1" value="0" />        
16:      </td>      
17:    </tr>  
18:    <tr>  
19:      <td>Valor 2:</td>  
20:      <td>        
21:        <input type="text" name="valor2" value="0" />        
22:        <input type="button" name="calcular" value="Calcular" />  
23:      </td>      
24:    </tr>    
25:    <tr>  
26:      <td>Resultado:</td>  
27:      <td>  
28:        <div class="resultado"></div>  
29:      </td>  
30:    </tr>    
31:  </table>  

3- Implementação Javascript e jQuery

1:  <script src="http://code.jquery.com/jquery-1.9.0.min.js" type="text/javascript"></script>    
2:  <script type="text/javascript">  
3:     (function () {  
4:        // utilizaremos jQuery para facilitar nos seletores dos elementos  
5:        jQuery(function () {  
6:           $('input[name="calcular"]').click(function () {            
7:    
8:              // convertemos o valor1, valor2 para float  
9:              var n1 = parseFloat($('input[name="valor1"]').val()),       
10:                 n2 = parseFloat($('input[name="valor2"]').val());  
11:                   
12:              // obtemos o tipo da operação selecionado pelo usuário             
13:              var operacao = $('input[name="operacao"]:checked').val();  
14:    
15:              // chamamos o método calc, passando os valores de n1, n2 e o tipo de operação  
16:              // eval() é utilizado para que o valor do tipo 'string' seja reconhecido como um tipo de comando  
17:              var resultado = calc(n1, n2, eval(operacao));  
18:    
19:              // escrevemos o resultado na <div class="resultado"> com algumas estilizações  
20:              $('.resultado')  
21:                 .css({ 'font-weight': 'bold', 'font-size': '18pt' })  
22:                 .html(resultado);  
23:           });  
24:        });  
25:          
26:        function calc(n1, n2, method) {  
27:           return method(n1, n2);  
28:        }  
29:    
30:        function somar(n1, n2) {  
31:           return n1 + n2;  
32:        }  
33:    
34:        function subtrair(n1, n2) {  
35:           return n1 - n2;  
36:        }  
37:    
38:        function multiplicar(n1, n2) {  
39:           return n1 * n2;  
40:        }  
41:    
42:        function dividir(n1, n2) {  
43:           if (n2 === 0) {  
44:              return "Divisão não pode ser por Zero.";  
45:           }  
46:           return n1 / n2;  
47:        }   
48:     })();  
49:  </script>  

A implementação é bem simples:
Linha 1: Referência para o plugin da biblioteca jQuery.
Linha 5: Faz o uso da biblioteca do jQuery.
Linha 6: Com a ajuda do jQuery implementamos o evento de clique para o botão calcular.
Linha 9 e 10: Obtemos os valores 1 e 2 e convertemos para float.
Linha 13: Obtemos o tipo da operação selecionado pelo usuário.
Linha 17: Chamamos o método calc, passando os valores de n1, n2 e o tipo de operação e também eval() é utilizado para o valor do tipo 'string'(no caso a operação selecionada) seja executada como um tipo de comando, isso é nativo da linguagem.
Linha 20: Imprime o resultado, com algumas estilizações.
Linha 26 até 47: Implementação das operações de Somar, Dividir, Multiplicar, Subtrair.

Como podemos observar na codificação utilizamos o próprio valor do <input name="operacao"> para passar como parâmetro na function de calc(n1, n2, eval(operacao)){ ... } para retornar o resultado. É isso mesmo, passamos como parâmetro o tipo da função que será executada, com isso, evitamos de fazer condições (if) para conseguirmos o retorno. A definição para à função eval() é que conseguimos executar em tempo de execução comandos da linguagem que estejam escritos em uma string.

Bom pessoal, espero que com esse exemplo para quem está iniciando possa ter uma noção básica dos imensos recursos que essa linguagem (JavaScript) nos proporciona e claro também com a ajuda do jQuery.

HTML5 Estrutura Semântica

Nesse tutorial, iremos ver a “nova” estrutura semântica do HTML5. Irei colocar algumas referências no final desse post e passar um pouco mais sobre essas novidades (não tão novas), mas que já está sendo bastante utilizada.

Para começarmos a entender irei apresentar um breve detalhe de cada tópico que será de suma importância, para podermos entender e consequentemente termos uma visão do que será empregado nesse novo conceito.

Qual propósito da Estrutura?
Uma estrutura de informação, como documentos escritos em HTML, deve conter apenas marcações com devido significado.

O que é Semântica?
Semântica refere-se ao estudo do significado. Quando utilizamos cada marcação para o que ele realmente foi criada, estamos construindo um “Código Semântico”, é uma abordagem de criar “Marcação com Significado”.

Semântica com atributos

Figura 1: Semântica via atributos

Semântica HTML5

Figura 2: Semântica HTML5

Como podemos observar, a semântica que está representada na Figura 1: Semântica via atributos é feita por via de atributos, já com a semântica do HTML5 apresentado na Figura 2: Semântica HTML5 podemos notar uma grande diferença, onde o uso não é mais feito via por via de atributos já estando definido com o próprio elemento, exemplo é o bloco header. Sendo assim, podemos informar diretamente os elementos e não se preocuparmos mais em criar divs e definindo-os pelos atributos. Lembrando sempre como já citado nesse post: “Semântica refere-se ao estudo do significado.”.
Com a “nova” semântica você e sua equipe irão ter facilidade de lidar com seus blocos ou contextos ou como queriam ser chamados. Se você ainda não usa HTML5 nos seus projetos, comece agora mesmo! E comece pela semântica.

Alguns dos novos Elementos

Alguns dos novos elementos para identificação melhor dos conteúdos como <header> e <footer> para cabeçalho e rodapé, <section> para sessões de uma página ou <article> para identificar um artigo ou um post.

DOCTYPE html5
O Doctype já é bem mais simples e possível de decorar, do que do xhtml que estamos acostumados.
Ex: <!DOCTYPE html>

<header>
Para definir onde será o cabeçalho da página, na semântica do HTML5 podemos ter vários <header> no mesmo documento.

<footer>
Para definir onde será o rodapé da página ou da sessão.

<aside>
Informações relativas ao conteúdo principal, como um menu ou campo de busca.

<dialog>
Será usada para descrever dialogos, usando tags de termos de definição.

<figure>
Para inserção de imagens com legenda.

 <figure>  
  <img src="imagem.jpg" alt="descrição">  
  <legend>Legenda da Imagem</legend>  
 </figure>  

<audio>
Exibe qualquer elemento de streaming de áudio, com atributos para exibição de controles ou execução automática.

<video>
Exibe vídeos na página, com exibição de controles e de uma imagem enquanto o vídeo é carregado.

<nav>
Sessão de navegação, para links ‘lado a lado.’

 <nav>  
  <a href="#">Home</a>  
  <a href="#">Próxima</a>  
  <a href="#">Anterior</a>  
 </nav>  

<menu>
Serve para gerar um menu, com auxílio da marcação <li>

 <menu>  
   <li><input type="checkbox" />Vermelho</li>  
   <li><input type="checkbox" />Azul</li>  
 </menu>  

Bom pessoal é isso, espero que possa ter ajudado. Irei colocar mais post sobre essa linguagem extraordinária que nos tem surpreendido a cada dia. Abraços.

Referências:
A Semântica do HTML5
Semântica HTML5: comece agora a usá-la!
Vídeos: HTML5 Semantic Structure

Entendo yield com C#

A expressão yield é utilizado como um iterador de bloco fornecendo um valor para o objeto enumerador ou para sinalizar o final da iteração, também para realização de uma iteração sobre uma coleção personalizada. Para mais informações sobre o conteúdo acesse o link http://msdn.microsoft.com/en-us/library/vstudio/9k7k7cf0.aspx.

Nesse tutorial iremos elaborar uma implementação básica, onde o retorno será composta por uma coleção de valores do tipo int. Para implementação irei utilizar o VS2012, criando assim um novo projeto do tipo ConsoleApplication, somente para fins didáticos.

Veja a implementação abaixo:

using System;
using System.Collections.Generic;

namespace SampleReturnYield
{
    class Program
    {
        static void Main(string[] args)
        {
            var numeros = ObterNumeros();

            foreach (var n in numeros)
            {
                Console.WriteLine("Sequência: {0}", n);
            }
        }

        static IEnumerable<int> ObterNumeros()
        {
            for (int i = 0; i < 10; i++)
            {
                yield return i;
            }
        }
    }    
}

Como podemos observar a implementação é bem simples, foi criado um método chamado de ObterNumeros() e tem como retorno uma coleção de IEnumerable<int>. Como já citamos acima, o retorno para yield é utilizado para um bloco do tipo IEnumerable<T>(considere o T como qualquer tipo de objeto), você também tem a liberdade de fazer iterações em cima de objetos que venha a ser criado em seus projetos.
Apesar de não mais precisarmos de uma classe auxiliar para criar o enumerador, quando utilizamos a keyword yield, automaticamente o compilador gera a classe que implementa a Interface IEnumerator, implementando todos os métodos necessários para a iteração entre os elementos da coleção. A keyword yield que determina a criação do enumerador, ainda permite uma outra forma de passar os itens para o mesmo, mantendo o mesmo resultado final.

Bom pessoal espero ter ajudado, obrigado…

Removendo Acentos utilizando Métodos de extensão com C#

Métodos de extensão permitem que você “adicione” métodos para tipos existentes sem criar um novo tipo derivado, recompilar, ou modificar o tipo original. Os métodos de extensão são um tipo especial de método estático, mas eles são chamados como se fossem métodos de instância no tipo estendido. Para o código de cliente escrito em C # ou Visual Basic, não há diferença aparente entre chamar um método de extensão e os métodos que são realmente definidos em um tipo.
Mais informações acesse http://msdn.microsoft.com/en-us/library/vstudio/bb383977.aspx

Nesse tutorial iremos implementar um novo método de extensão, onde nesse método de extensão irá remover os acentos de uma determinada variável do tipo “string”. Como exemplo irei criar um novo projeto no VS2012 do tipo “Console Application”, logo abaixo segue a implementação.

Implementação e Codificação

public class Program
{
    static void Main(string[] args)
    {
        string palavra = "áéíóú";

        Console.WriteLine(palavra.RemoverAcentos());    
    }        
}

public static class StringExtensions
{
    public static string RemoverAcentos(this string valor)
    {
        byte[] bytes = Encoding.GetEncoding("Cyrillic").GetBytes(valor);

        return Encoding.ASCII.GetString(bytes);
    }
}

Como podemos observar a implementação é bem simples, criamos uma nova classe chamada StringExtensions e nela adicionamos o método de extensão chamado de RemoverAcentos(this string valor).
Com ajuda do .NET Framework, utilizaremos a classe abstract de Encoding chamando o método GetEnconding passando como parâmetro o valor Cyrillic do tipo string. Mais sobre a classe Encoding e o valor Cyrillic acesse o link http://msdn.microsoft.com/en-us/library/system.text.encoding.aspx

Conclusão

Com implementações de métodos extensão conseguimos ganhar produtividade e organização nas funções que viram a ser implementadas.

Referências:

Bom pessoal é isso e até a próxima…