Compartilhar via


Explicação Passo-a-passo: Criando um novo site da Web ASP.NET

Este exame Através fornece uma introdução aos recursos de desenvolvimento na Web de Microsoft Visual Web Developer Express Edition e Microsoft .Ele orienta você durante a criação de uma página simples.Além disso, essa explicação passo-a-passo lhe apresenta o designer visual WYSIWYG.

Tarefas ilustradas nesta explicação passo a passo incluem o seguinte:

Pré-requisitos

Para concluir a explicação passo a passo, você precisará do seguinte:

Criando um Site e Página da da Web

Na primeira parte da explicação passo-a-passo, você criará um site ASP.NET que tenha uma página padrão.Esse site será um Site do sistema de arquivos que não exija Microsoft Internet Information Serviços (IIS).Isso permite que você crie e execute a página a partir do sistema de arquivos local do seu computador.

Um site de sistema de arquivos é tal que armazena páginas e outros arquivos em uma pasta que você seleciona em algum lugar no computador local.Outro Site-opções incluem um Site da Web de IIS localque armazena os arquivos em uma subpasta da raiz IIS local (normalmente, \Inetpub\wwwroot\).Um Site FTP armazena arquivos em um servidor remoto que você Acessar usando (FTP).A Site Remoto armazena arquivos Na Horizontal um servidor rNa Horizontaloto que você pode acessar uma Cruz uma rede local.Para obter mais informações, consulte Demonstra Passo a passo: Edição de sites com FTP no Visual Web Developer.

Observação:

Você também pode criar sites da Web usando projetos de aplicativos Web.Para obter mais informações, consulte Visão geral de Projetos de Aplicativos Web.

Para criar um site do sistema de arquivos

  1. Abrir Visual Web Developer.

  2. Na File Menu, clique em Novo Site da Web.

    O Novo Site da Web caixa de diálogo é exibida, como mostrado na ilustração a seguir.

  3. Em Modelos Visual Studio instaladoClique em Web Site ASP.NET.

  4. Na Local caixa, selecione o Sistema de arquivos caixa e em seguida, digite o nome da pasta w aqui você deseja manter as páginas do site da Web.

    Por exemplo, digite o nome da pasta C:\Tarefas.

  5. Na Linguagem lista, clique em Visual Basic ou Visual C# Para selecionar o que você usará em todo o projeto da Web linguagem de programação

    Observação:

    Nessa explicação passo-a-passo, você não irá escrever nenhum código de programa.

  6. Clique em OK.

    Visual Web Developer Cria a pasta e um Nova Página chamado Default.aspx.Por padrão, quando uma nova página for Criado, Visual Web Developer Exibe a página em Origem Exibir, onde você pode ver elementos de página do MTML.A ilustração a seguir mostra um padrão página da Web em Origem Exiba.

Um Tour do Visual Web Developer

Antes de continuar, é útil para se familiarizar com o Visual Web Developer ambiente de desenvolvimento.A ilustração a seguir mostra parte o Windows e ferramentas no Visual Web Developer.

Diagrama do ambiente Visual Web Developer

Examine a ilustração anterior e corresponda o texto para a lista a seguir, que descreve as janelas e ferramentas mais comumente usadas.(Nem todas as janelas e ferramentas que você vê são listadas aqui, somente aquelas marcadas na ilustração anterior.)

  • Barras de ferramentas.Fornecem comandos de formatação de texto, localização de texto, e assim por diante.Algumas barras de ferramentas estão disponíveis somente quando você estiver trabalhando em Design Exiba.

  • Explorer solução.Exibe os arquivos e pastas no Web site.

  • Janela de Documento.Exibem os documentos com os quais você está trabalhando em janelas com guias.Você pode alternar entre documentos clicando nas guias.

  • Guias de Exibição.Mostra diferentes modos de exibição do mesmo documento.Design o modo de exibição é um perto de - WYSIWYG edição superfície.Origem modo de exibição é o editor para a página que exibe a marcação.Split Exibe ambas Design modo de exibição e Origem Exibir o documento.Você trabalhará com Design modo de exibição e Origem modo de exibição posteriormente nessa explicação passo a passo.Se você preferir Abrir Web páginas em Design Exibir, na Ferramentas Menu, clique em OpçõesSelecionar o Designer de HTML Nó, e Alterar o Iniciar Páginas em Opção.

  • Propriedades a janela.Permite que você altere as configurações da página, dos elementos HTML, dos controles e de outros objetos.

  • Propriedades folhas de estilo em cascata a janela.Exibe o atual Estilos da CSS quando Design modo de exibição está ativo.

  • Gerenciar estilos e Aplicar estilos Windows.Ajudam você a controlar os estilos CSS do site.

  • Toolbox.Fornece controles e elementos HTML que você pode arrastar para uma página.Toolbox Elementos são agrupados por função Comum.

  • Banco de Dados Do Explorer.Exibe conexões de banco de dados.Se você não vir o Banco de Dados Do Explorer Janela Visual Web DeveloperNa View Menu, clique em Outro Do Windowse em seguida, clique em Banco de Dados Do Explorer.

    Observação:

    O Banco de Dados Do Explorer Janela Visual Web Developer é denominado Server Explorer Na Completo versão Visual Studio.

Você pode reorganizar, redimensionar e encaixar as janelas para atender suas preferências.O View Menu permite que você exibir janelas adicionais.

Para fazer um tour pelo ambiente de desenvolvimento

  1. Sobre o View Menu, clique em Barras de ferramentas.

    Um submenu das barras de ferramentas disponíveis é exibido.Barras de ferramentas que estiverem selecionadas no momento aparecem com uma caixa de seleção próxima à seleção da barra de ferramentas.

  2. Role para a parte inferior da lista de barras de ferramentas e clique em Personalizar.

    O Personalizar caixa de diálogo é exibida.

  3. Revise as barras de ferramentas disponíveis.Quando você terminar, clique em Fechar.

  4. Na View Menu, clique em Explorer solução.

    O Explorer solução a janela é exibida.Por padrão, essa janela é encaixada no lado um do Visual Web Developer Ambiente.

  5. Clique com o botão direito do mouse o item superior no site no lista no Explorer solução.

    Um menu de atalho de operações comuns do Web site é exibido.

  6. Pressione ESC para fechar o menu de atalho.

  7. Em Explorer soluçãoClique com o botão direito do mouse no arquivo web.config e em seguida, clique em Abrir Para abrir o arquivo na janela do documento.

  8. Clique duas vezes na página Default.aspx para abrir a página na janela do documento.Duplo - Clicando em um arquivo é uma alternativa ao uso de Abrir Comando da Atalho menu.

    Observe que o nome de cada página aberta é exibido em uma guia na parte superior da janela do documento.

  9. Na parte inferior do janela do documento, clique em Split Para exibir Origem modo de exibição e Design Exibir ao mesmo tempo.

  10. Na View Menu, clique em Janela Properties.

    O Propriedadesa janela é exibida.

    Quando você seleciona um objeto no janela do documento, o Propriedades janela exibe as propriedades do objeto selecionado.

  11. Na Origem painel de exibição, selecione o Formulário Elemento, em seguida, na Propriedades janela, examine as propriedades disponíveis.

  12. Na View Menu, clique em Toolbox.

    O Toolbox a janela é exibida.

  13. Em Design modo de exibição, a partir de Padrão Guia das ToolboxArraste um Button Controlarar para o documento e solte-o na DIV Elemento.

    Observe que Origem modo de exibição é atualizado com a marcação apropriada.

  14. Sobre o View Menu, clique em Banco de Dados Do Explorer.

    O Banco de Dados Do Explorer a janela é exibida.

    Observação:

    O Banco de Dados Do Explorer Janela Visual Web Developer é denominado Server Explorer Na Completo versão Visual Studio.

  15. Clique com o botão direito do mouse Conexões de dados Para ver as opções de banco de dados disponíveis.

Criando uma página Web do ASP.NET

Quando você criar um novo site, Visual Web Developer Adiciona um ASP.NET página da Web (Web Formulários página) chamado Default.aspx.Você pode usar a página default.aspx como o home page para o site da Web.Entretanto, para esta explicação passo a passo, você irá criar e trabalhar com uma nova página.

Para adicionar uma página ao site Web

  1. No janela do documento, clique com o botão direito do mouse na guia para a página default.aspx e em seguida, clique em Fechar.

  2. Se você estiver perguntado para salvar as alterações, clique em Não.

  3. Em Explorer soluçãoClique com botão direito do mouse no site da Web (por exemplo, C:\Tasks) e em seguida, clique em Adicionar novo item.

    O Adicionar novo item caixa de diálogo é exibida.

  4. Em Modelos Visual Studio instaladoClique em Web Form.

  5. Na Name (Nome) caixa, digite Home.aspx.

  6. Na Linguagem lista, selecione o que você prefere trabalhar com (linguagem de programação Visual Basic ou C#).

  7. Limpar o Coloque o código no arquivo separado caixa de seleção.

    A ilustração a seguir mostra a Adicionar novo item caixa de diálogo.

  8. Clique em Adicionar.

    Visual Web Developer Cria a nova página.Por padrão, a página é exibida em Origem Exiba.

Adicionando HTML à página

Nesta parte da explicação passo a passo, você irá adicionar algum texto estático para a página.

Para adicionar texto à página

  1. Na parte inferior do janela do documento, clique na Design Guia para Switch para Design Exiba.

  2. Na página, digite lista de tarefas.

Executando a página

Antes de continuar, você pode testar a página.Para executar uma página, é necessário um servidor Web.Em um Web site de produção, você usa o IIS como o servidor Web.Entretanto, para testar uma página, você pode usar o Servidor de Desenvolvimento do ASP.NET, que é executado localmente e não requer o IIS.Para sistema de arquivos Web sites, o padrão servidor Web em Visual Web Developer é a Servidor de Desenvolvimento do ASP.NET.

Para executar a página

  1. Pressione CTRL+F5 para executar a página.

    Visual Web Developer Inicia a Servidor de Desenvolvimento do ASP.NET.Um ícone aparece na Windows barra de ferramentas para indicar que o Visual Web Developer Servidor Web está sendo executado, como mostrado na ilustração a seguir:

    A página é exibida no navegador.Embora a página que você criou tenha uma extensão .aspx, ela atualmente executa como qualquer página HTML.

    Observação:

    Se o navegador exibir um erro 502 ou um erro que indique que a página não pode ser exibida, talvez seja necessário configurar o seu navegador para ignorar servidores proxy para solicitações locais.Para obter detalhes, consulte Como: Ignorar um servidor proxy para solicitações da Web locais.

  2. Feche o navegador.

Próximas etapas

Essa explicação passo a passo tem ilustrado dos recursos Basics da Visual Web Developer.

Para Controle aprimorado de arquivos, considere armazenando arquivos Site em um sistema-controle de origem como Visual SourceSafe.Para obter mais informações, consulte Introdução ao controle de origem.

Consulte também

Conceitos

Explicações passo a passo selecionadas do ASP.NET