none
Como integrar VisualStudio com o Expression Web??? RRS feed

  • Pergunta

  • Olá, senhores.

    Baixei o ExpressionWeb e já fiz o lay-out de meu site usando templates fornecidos no pacote. Fiquei muito contente com o resultado visual e achei muito fácil trabalhar com a parte básica.

    Mas, agora, quero colocar programação nele. Principalmente acesso a bancos de dados, para deixar algumas páginas dinâmicas, colocar controle de login, etc.

    Procurei materiais sobre isso e os que achei, ainda, não me ajudaram muito. Eu já havia feito um outro pequeno site diretamente no VS2005. Com a programação que eu preciso, porém, com péssimo resultado visual. Os componentes que colocamos usando apenas o VS nunca ficam formatados corretamente, os frames ficam fora de posição e as dimensões nunca são respeitadas... Então, parece que o lógico é fazer justo isso: lay-out no Expression e programação no VS.
    C O M O ???

     

    Agradecido.

    sexta-feira, 27 de abril de 2007 13:41

Respostas

  • Oi !

     

    Não sou designer, mas instalei o expression web aqui para dar uma analisada e exatamente poder dar algumas dicas a mais sobre esta integração.

     

    Quando você abre o expression web (pelo menos pela 1a vez) ele já abre um arquivo .HTM e na toolbox exibe vários controles HTM. A primeira impressão seria que vamos editar HTML puro.

     

    Porém se observarmos a toolbox, um pouco mais para baixo, encontramos controles ASP.NET de servidor. Podemos fazer conexão a banco, inserir controles de segurança, enfim, recursos bem avançados do ASP.NET podem ser feitos através do Expression web.

     

    Uma curiosidade : A página continua sendo .HTM. Apenas na hora de salvar, ao perceber a presença dos webControls, o expression web troca a extensão para .ASPX e faz a criação de um site. Neste ponto temos que estar atentos a uma questão : Se inserirmos um datasource antes do expression web ter feito a criação do site, ele não consegue salvar a string de conexão no arquivo de configuração (web.config), o que irá nos causar problemas.

     

    Assim sendo, devemos ter o cuidado de salvar primeiro a página, deixando ele criar o webSite e só então inserir datasources, por exemplo.

     

    O Expression Web em momento algum permite a criação de code-behind, ele trabalha apenas com o arquivo .ASPX. Mas o conceito de website do Expression Web e do Visual Studio é identico, então o mesmo diretório que o Expression Web utiliza como website pode ser aberto como website pelo visual studio e vice-versa.

     

    A recomendação então fica sendo de que novas páginas sejam criadas pelo visual studio e só depois seu design editado pelo expression web, isso porque o Visual Studio já poderá criar a página com code-behind, enquanto que o expression web pode editar as páginas .aspx que possuem code-behind sem problema, alterando apenas seu layout, sem manipular seu código.

     

    A ferramenta para criar mapas de site do expression web é quase inexistente, um simples editor de XML. Precisamos de algo mais moderno para editar mapas de sites.

     

    O Expression Web cria master pages sem problemas, de forma semelhante ao visual studio. Mas além das master pages ele possui também um nome chamativo, os Dynamic Web Templates - DWTs.

     

    Isso é um recurso que definitivamente nunca deve ser utilizado. Os DWTs equivalem aos velhos templates do DreamWeaver, onde montava-se uma página template e o conteúdo da página template era copiado para as páginas derivadas do template. O visual studio obviamente não vai dar a mínima para o conteúdo dos DWTs, é código copiado e espalhado por todo o site, exatamente o que não se deseja para fins de manutenção.

     

    As master pages são uma evolução dos DWTs e devem ser utilizadas no expression web, esquecendo-se da existência dos DWTs.

     

    Outro ponto positivo é que o Expresion web está pronto para trabalhar com web user controls (.ascx), conceito novo com o qual os designers precisarão se acostumar.

     

    Também é um ponto muito positivo para os designers o fato de que na criação de páginas do expression web ele oferece várias opções de layout de página já em  formato table-less, com as áreas da página devidamente separadas em DIVs, no mais moderno conceito de design.

     

    Duas coisas que me impressionaram foi primeiramente a opção de Attach de master page. Consegue-se fazer visualmente, por menu, algo que no VS é complicado, vincular uma masterpage a uma página já existente. Outra questão foi a janela datasources, que no VS só existe para aplicações windows, está presente no Expression Web (claro que não tem os mesmos recursos).

     

    Porém existe um ponto muito falho que achei difícil de perdoar : O Expression Web não trabalha com Themes. Os Themes do ASP.NET são uma escala evolutiva no uso de CSSs, porém o Expression Web ignora por completo a sua existência, afastando os designers deste recurso tão importante para o desenvolvimento gráfico dos sites.

     

    Curiosidade : Conforme citei, é preferível que as páginas sejam criadas pelo Visual Studio e depois editadas pelo Expression web. Mas se o caminho contrário for feito é possível adicionar uma pagina.aspx.vb e adicionar na página.aspx uma tag @page, como a seguinte :

     

    <%@ page language="VB" codefile="pagina.aspx.vb" inherits="pagina" %>

     

    []'s

     

     

     

    terça-feira, 1 de maio de 2007 06:59

Todas as Respostas

  • Oi !

     

    Quando você abre o VS, utiliza a opção Open WebSite e aponta para o diretório onde está seu site do expression web, qual resutlado você tem ?

     

    Isso gera algum tipo de problema quando começa a desenvolver ?

     

    []'s

     

    sexta-feira, 27 de abril de 2007 14:11
  • Olá, Dennes.

    1. O VS não respeita a master-page do Expression. Simplesmente posso clicar em uma área definida pelo arquivo .dwt e reescrever.
    2. A edição de qualquer coisa no Design é muito difícil. Não ficam disponíveis os estilos e/ou qualquer outro facilitador.
    3. Muitas marcações que no Expression estão perfeitamente formatadas ficam confusas, então você não consegue ver onde você deve colocar seus códigos de interação.
    4. Os eventos das páginas não ficam visíveis... Cade eles? O que é preciso colocar para haver integração?

    Note que, com excessão do arquivo "master.dwt" tudo é HTML padrão. Nenhuma página ASP foi gerada com o template que usei. O que é necessário para a adaptação?

     

    Até mais...

     

    sexta-feira, 27 de abril de 2007 15:05
  • Oi !

     

    DWT é um template, não é ?

     

    O visual studio não trabalha com isso, dai que o item 1 é perfeitamente natural. O Visual Studio trabalha com o conceito de master pages. Vou dar uma examinada nestas questões depois, mas verifique se no Expression designer não tem uma opção para, ao invés de criar um template .dwt, criar uma master page, .master.

     

    []'s

     

    sexta-feira, 27 de abril de 2007 15:23
  • Senhores...

    Com as páginas geradas no Expression eu quero colocar componentes ASP e programação com o Visual Studio.

    Como eu faço isso?

    segunda-feira, 30 de abril de 2007 13:48
  • Oi !

     

    Não sou designer, mas instalei o expression web aqui para dar uma analisada e exatamente poder dar algumas dicas a mais sobre esta integração.

     

    Quando você abre o expression web (pelo menos pela 1a vez) ele já abre um arquivo .HTM e na toolbox exibe vários controles HTM. A primeira impressão seria que vamos editar HTML puro.

     

    Porém se observarmos a toolbox, um pouco mais para baixo, encontramos controles ASP.NET de servidor. Podemos fazer conexão a banco, inserir controles de segurança, enfim, recursos bem avançados do ASP.NET podem ser feitos através do Expression web.

     

    Uma curiosidade : A página continua sendo .HTM. Apenas na hora de salvar, ao perceber a presença dos webControls, o expression web troca a extensão para .ASPX e faz a criação de um site. Neste ponto temos que estar atentos a uma questão : Se inserirmos um datasource antes do expression web ter feito a criação do site, ele não consegue salvar a string de conexão no arquivo de configuração (web.config), o que irá nos causar problemas.

     

    Assim sendo, devemos ter o cuidado de salvar primeiro a página, deixando ele criar o webSite e só então inserir datasources, por exemplo.

     

    O Expression Web em momento algum permite a criação de code-behind, ele trabalha apenas com o arquivo .ASPX. Mas o conceito de website do Expression Web e do Visual Studio é identico, então o mesmo diretório que o Expression Web utiliza como website pode ser aberto como website pelo visual studio e vice-versa.

     

    A recomendação então fica sendo de que novas páginas sejam criadas pelo visual studio e só depois seu design editado pelo expression web, isso porque o Visual Studio já poderá criar a página com code-behind, enquanto que o expression web pode editar as páginas .aspx que possuem code-behind sem problema, alterando apenas seu layout, sem manipular seu código.

     

    A ferramenta para criar mapas de site do expression web é quase inexistente, um simples editor de XML. Precisamos de algo mais moderno para editar mapas de sites.

     

    O Expression Web cria master pages sem problemas, de forma semelhante ao visual studio. Mas além das master pages ele possui também um nome chamativo, os Dynamic Web Templates - DWTs.

     

    Isso é um recurso que definitivamente nunca deve ser utilizado. Os DWTs equivalem aos velhos templates do DreamWeaver, onde montava-se uma página template e o conteúdo da página template era copiado para as páginas derivadas do template. O visual studio obviamente não vai dar a mínima para o conteúdo dos DWTs, é código copiado e espalhado por todo o site, exatamente o que não se deseja para fins de manutenção.

     

    As master pages são uma evolução dos DWTs e devem ser utilizadas no expression web, esquecendo-se da existência dos DWTs.

     

    Outro ponto positivo é que o Expresion web está pronto para trabalhar com web user controls (.ascx), conceito novo com o qual os designers precisarão se acostumar.

     

    Também é um ponto muito positivo para os designers o fato de que na criação de páginas do expression web ele oferece várias opções de layout de página já em  formato table-less, com as áreas da página devidamente separadas em DIVs, no mais moderno conceito de design.

     

    Duas coisas que me impressionaram foi primeiramente a opção de Attach de master page. Consegue-se fazer visualmente, por menu, algo que no VS é complicado, vincular uma masterpage a uma página já existente. Outra questão foi a janela datasources, que no VS só existe para aplicações windows, está presente no Expression Web (claro que não tem os mesmos recursos).

     

    Porém existe um ponto muito falho que achei difícil de perdoar : O Expression Web não trabalha com Themes. Os Themes do ASP.NET são uma escala evolutiva no uso de CSSs, porém o Expression Web ignora por completo a sua existência, afastando os designers deste recurso tão importante para o desenvolvimento gráfico dos sites.

     

    Curiosidade : Conforme citei, é preferível que as páginas sejam criadas pelo Visual Studio e depois editadas pelo Expression web. Mas se o caminho contrário for feito é possível adicionar uma pagina.aspx.vb e adicionar na página.aspx uma tag @page, como a seguinte :

     

    <%@ page language="VB" codefile="pagina.aspx.vb" inherits="pagina" %>

     

    []'s

     

     

     

    terça-feira, 1 de maio de 2007 06:59
  • Muito bom, Dennes.

    Você foi claro e suas dicas são muito úteis.

     

    Se for possível, verifique www.ildefonso.com.br .

    Ali usei um template e em poucas horas já estava esta parte no ar. Mas usei a bendita .dwt

    O que você sugere para fazer a mudança?

    Devo iniciar um site em branco no VS e copiar o código da master.dwt dentro da master page e, então, recriar todas as outras páginas?

     

    Muito, muito agradecido.

    quarta-feira, 2 de maio de 2007 13:23
  • Oi !

     

    Verifique se existe uma opção no expression de desvincular as páginas do dwt apagando o conteúdo do dwt das páginas, se tiver, use.

     

    Crie uma master page pelo expression

     

    Copie para a master page o conteúdo do dwt

     

    Utilize o recurso que citei do expression para aplicar a master page nas páginas.

     

    []'s

     

     

    quarta-feira, 2 de maio de 2007 13:50