Aplicacion Web con Asp.Net MVC y Visual Basic

Aplicacion Web con Asp.Net MVC y Visual Basic

Aplicacion Web con Asp.Net MVC y Visual Basic
5 (100%) 1 voto

Llega para ustedes la segunda parte del Tutorial para Realizar una Aplicacion Web con Asp.Net MVC y Visual Basic en el entorno de Visual Studio 2013, en la primera parte vimos un poco de la teoria de lo que vamos a hacer el dia de hoy asi que si no lo has leido te recomiendo que le des un vistazo ya que es un tema algo confuso y podras perderte a lo largo del Articulo. Hoy realizaremos nuestra primera aplicacion web con Asp.Net MVC y VB mostrando asi la practica de lo aprendido en el articulo anterior, asi que vamos ya a la info yum

Enlaces

Escenario

Ahora que ya hemos visto una pequeña introduccion a Asp.Net MVC en el Articulo anterior del Tema, ahora lo que haremos sera poner en practica lo aprendido y reforzar las bases de la estructura basica de una Aplicacion Web con Asp.Net MVC en VB. Porque en VB? Simplemente porque en Internet existen muchos recursos y documentacion de como crear una aplicacion web MVC utilizando C# y casi nula de como realizar una aplicacion web MVC mediante VB.

Visual Studio 2013

Es hora de abrir nuestro IDE de Visual Studio 2013, nos vamos a File -> New -> Project

 Aplicacion Web con Asp.Net MVC y Visual Basic 1

Seleccionamos Visual Basic -> Web -> Visual Studio 2012. En la parte derecha seleccionamos ASP.NET MVC 4 Web Application, nombramos nuestro proyecto y damos Ok.

Aplicacion Web con Asp.Net MVC y Visual Basic 2

Seleccionamos ahora un Template Vacio y nos aseguramos que el motor de vistas sea Razor ( mas adelante en otros Articulos hablaremos de Razor yum ) damos Ok de nuevo.

Ahora nos aparecera nuestro proyecto con una cierta estructura, hagamos un resumen de las carpetas que se nos han creado:

  • App_Data: Contendra datos de la Aplicacion como archivos SQL
  • App_Start: Contendra Archivos de Configuracion de la Aplicacion ( entre ellos el RouteConfig.* )
  • Content: Contendra Archivos Estaticos como CSS 
  • Controllers: Contendra los Controladores de nuestra Aplicacion
  • Filters: Contendra clases para el comportamiento After y Before de las Acciones de los Controladores
  • Images: Contentra Imagenes que utilizara nuestra Aplicacion. 
  • Models: Contendra los Modelos de nuestra Aplicacion.
  • Scripts:  Contendra Archivos de Script como javascript
  • Views: Contendra las Vistas de nuestra Aplicacion.

 

El Codigo ( VB )

Ahora, nos toca comenzar con el Codigo.. Para agregar un nuevo modelo simplemente damos click derecho sobre la carpeta Models -> Add -> Class  y escribimos el nombre de nuestro modelo y comenzamos a escribir codigo en el, para esta Aplicacion vamos a crear 3 modelos 4 modelos:

  • Persona
  • Informacion1
  • InfoAccion2
  • InfoAccion3

Persona

Informacion1

InfoAccion2

InfoAccion3

Debemos tener 2 Controladores, para agregar un nuevo controlador damos click derecho sobre la carpeta Controllers -> Add -> Controller ( como puedes ver se agrega “Controller” al final del nombre ), nosotros los llamamos:

  • HomeController ( default )
  • controlador2Controller

HomeController 

controlador2Controller

Aqui podemos decir que el controlador crea las instancias de los modelos y lo pasa a la vista correspondiente a la accion que reciba por parte del usuario.

Ahora agregamos las vistas, las vistas deben de estar dentro de la carpeta de su respectivo Controlador. Dentro del controlador home tenemos una accion llamada index, asi que tenemos que dar click derecho sobre Views -> Add -> New Folder y lo llamamos Home, dentro de esta carpeta Home crearemos una vista llamada como la accion dentro del Controlador Home en este caso Index.

Tambien agregaremos las otras vistas siguiendo el mismo proceso, el otro controlador que tenemos se llama controlador2 ( omite la palabra Controller que se agrega automaticamente ) asi que creamos dentro de Views la carpeta controlador2 y dentro de esta las 3 vistas que tiene en acciones dentro del controlador controlador2 ( mira el codigo de controlador2:  Index, Accion2 y Accion3 ) el codigo de estas vistas es:

Index.vbhtml ( Controlador Home )

Index.vbhtml ( Controlador controlador2 )

 Accion2

Accion3

Aqui en las Vistas solo decir que el texto @ModelType y @Model es sintaxis de Razor en VB ( poca documentacion para VB y mucha para C# confused ) y declaran el tipo de modelo con el que trabajaran y acceso al modelo respectivamente.

Resultado

 

Aplicacion Web con Asp.Net MVC y Visual Basic

Aplicacion Web con Asp.Net MVC y Visual Basic
5 (100%) 1 voto

Deja tu comentario

4 Comentarios ¿Qué opinas tú del tema?

  1. Mario G
  2. lorena rosso taboada
  3. Alfonso de León
  4. Norma

Dejar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Loading Facebook Comments ...