Desarrollo Web en Entorno Servidor

2º DAW

User Tools

Site Tools

Trace:
apuntes:introduccion

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
apuntes:introduccion [2017/09/21 01:16] – [Lenguajes y tecnologías para programación web en entorno servidor] Santiago Faciapuntes:introduccion [2019/02/13 17:16] (current) – [Herramientas para el desarrollo web en entorno servidor] Santiago Faci
Line 96: Line 96:
 {{ lamp.jpg }} {{ lamp.jpg }}
 <caption>Arquitectura habitual LAMP</caption></figure> <caption>Arquitectura habitual LAMP</caption></figure>
 +
 +El lenguaje //PHP// fue diseñado por //Rasmus Lerdorf// y ahora se mantiene por una comunidad de desarrolladores, y además es open source.
  
 A continuación, un fragmento de una página web dinámica escrita con PHP donde se puede apreciar cómo se incrusta el código junto con el HTML de la página: A continuación, un fragmento de una página web dinámica escrita con PHP donde se puede apreciar cómo se incrusta el código junto con el HTML de la página:
Line 103: Line 105:
 . . . . . .
 <div id="listado"> <div id="listado">
-    <table class="cebra"> +  <table class="cebra"> 
-    <thead class="cabecera"> +  <thead class="cabecera"> 
-    <tr class="cabecera"> +  <tr class="cabecera"> 
-    <td>#</td> +  <td>#</td> 
-    <td>Nombre</td> +  <td>Nombre</td> 
-    <td>Descripción</td> +  <td>Descripción</td> 
-    <td>Stock</td> +  <td>Stock</td> 
-    <td>Precio venta</td> +  <td>Precio venta</td> 
-    <td>Imagen</td> +  <td>Imagen</td> 
-    <td></td> +  <td></td> 
-    <td></td> +  <td></td> 
-    <td></td> +  <td></td> 
-    </tr> +  </tr> 
-    </thead> +  </thead> 
-    <tbody class="scroll">+  <tbody class="scroll">
 <?php <?php
   
- $resultado = $bbdd->ejecuta_consulta("SELECT id, nombre, descripcion, stock, precio_venta, imagen1, miniatura FROM articulos " . +  $resultado = $bbdd->ejecuta_consulta("SELECT id, nombre, descripcion, stock, precio_venta, imagen1, miniatura FROM articulos " . 
- "WHERE nombre LIKE '%" . $busqueda_rapida . "%' OR descripcion LIKE '%" . $busqueda_rapida . "%' LIMIT " . $inicio . ", " . $tamano);+ "WHERE nombre LIKE '%" . $busqueda_rapida . "%' OR descripcion LIKE '%" . $busqueda_rapida . "%' LIMIT " . $inicio . ", " . $tamano);
   
- if ($resultado->num_rows == 0) { +  if ($resultado->num_rows == 0) { 
-     echo "<td colspan='7' style='text-align:center'><span class='titulocelda'>## Sin Datos ##</span></td>\n"; +    echo "<td colspan='7' style='text-align:center'><span class='titulocelda'>## Sin Datos ##</span></td>\n"; 
- } +  } 
- else {+  else {
            
-     while ($fila = $resultado->fetch_array()) {+    while ($fila = $resultado->fetch_array()) {
   
-         echo "<tr id='registro-" . $fila["id"] . "'>\n"; +      echo "<tr id='registro-" . $fila["id"] . "'>\n"; 
-         echo "<td>" . $fila["id"] . "</td>\n"; +      echo "<td>" . $fila["id"] . "</td>\n"; 
-         echo "<td>" . $fila["nombre"] . "</td>\n"; +      echo "<td>" . $fila["nombre"] . "</td>\n"; 
-         echo "<td>" . $fila["descripcion"] . "</td>\n"; +      echo "<td>" . $fila["descripcion"] . "</td>\n"; 
-         if ($fila["stock"] <= 0) +      if ($fila["stock"] <= 0) 
-         echo "<td><span class='error'>" . $fila["stock"] . "</span></td>\n"; +       echo "<td><span class='error'>" . $fila["stock"] . "</span></td>\n"; 
-         else +      else 
-         echo "<td>" . $fila["stock"] . "</td>\n"; +       echo "<td>" . $fila["stock"] . "</td>\n"; 
-         echo "<td>" . money_format("%i", $fila["precio_venta"]) . "</td>\n"; +      echo "<td>" . money_format("%i", $fila["precio_venta"]) . "</td>\n"; 
-         echo "<td><a href='articulos/" . $fila["id"] . "/" . $fila["imagen1"] . "' title='Ampliar'><img src='articulos/" . $fila["id"] . "/" . $fila["miniatura"] . "'/></a></td>\n"; +      echo "<td><a href='articulos/" . $fila["id"] . "/" . $fila["imagen1"] . "' title='Ampliar'><img src='articulos/" . $fila["id"] . "/" . $fila["miniatura"] . "'/></a></td>\n"; 
-         echo "<td><a href='run/_generar_barcode.php?id=" . $fila["id"] . "' title='Generar Código'><img src='icons/barcode16.png' alt='Generar Código'/></a></td>\n"; +      echo "<td><a href='run/_generar_barcode.php?id=" . $fila["id"] . "' title='Generar Código'><img src='icons/barcode16.png' alt='Generar Código'/></a></td>\n"; 
-         echo "<td><a href='?id=nuevo_articulo&modificar=" . $fila["id"] . "' title='Modificar Artículo'><img src='icons/editar16.png' alt='Modificar Artículo'/></a></td>\n"; +      echo "<td><a href='?id=nuevo_articulo&modificar=" . $fila["id"] . "' title='Modificar Artículo'><img src='icons/editar16.png' alt='Modificar Artículo'/></a></td>\n"; 
-         echo "<td><a class='eliminar' href='?eliminar=" . $fila["id"] . "' title='Eliminar Artículo'><img src='icons/cerrar16.png' alt='Eliminar Artículo'/></a></td>\n"; +      echo "<td><a class='eliminar' href='?eliminar=" . $fila["id"] . "' title='Eliminar Artículo'><img src='icons/cerrar16.png' alt='Eliminar Artículo'/></a></td>\n"; 
-         echo "</tr>\n"; +      echo "</tr>\n"; 
-     }+   }
   
-     $resultado->close(); +  $resultado->close(); 
- }+}
 ?> ?>
 . . . . . .
Line 158: Line 160:
  
 Por otra parte, [[http://www.oracle.com/technetwork/java/index-jsp-135475.html|Java Servlets]] es una tecnología que también se puede utilizar para crear contenido web dinámico pero que además extiende su funcionalidad a la posibilidad de conectar esas webs dinámicas con otro contenido accesible a través de Internet. En ocasiones se utiliza junto con JSP para crear aplicaciones web más complejas. Por otra parte, [[http://www.oracle.com/technetwork/java/index-jsp-135475.html|Java Servlets]] es una tecnología que también se puede utilizar para crear contenido web dinámico pero que además extiende su funcionalidad a la posibilidad de conectar esas webs dinámicas con otro contenido accesible a través de Internet. En ocasiones se utiliza junto con JSP para crear aplicaciones web más complejas.
 +
 +Ambas son tecnologías desarrolladas por //Sun Microsystems// y propiedad ahora de //Oracle//, tras adquirir esta última a la primera hace ya algunos años.
  
 <figure> <figure>
Line 240: Line 244:
  
 ((http://www.python.org)) ((http://www.python.org))
 +
 +El lenguaje //Python// fue diseñado por //Guido van Rossum// y ahora se mantiene gracias a una comunidad de desarrolladores, y es open source.
  
 <figure> <figure>
 {{ django_apache.png }} {{ django_apache.png }}
 <caption>Arquitectura habitual JSP/Servlets</caption></figure> <caption>Arquitectura habitual JSP/Servlets</caption></figure>
 +
 +Ejemplo de código escrito con Python. En este caso utilizando el framework //Django// para el desarrollo de aplicaciones web:
 +
 +En este caso, al tratarse de un framework MVC, tendremos la vista:
 +
 +<code python>
 +<h1>Mis películas</h1> <a href="#">+</a>
 +{% if lista_peliculas %}
 +   <ul>
 +       {% for pelicula in lista_peliculas %}
 +           <li><a href="{% url 'pelicula' pelicula.id %}">{{ pelicula.titulo }}</a></li>
 +       {% endfor %}
 +    </ul>
 +{% else %}
 +   <p>No hay películas disponibles</p>
 +{% endif %}
 +</code>
 +
 +Separada del controlador:
 +
 +<code python>
 +from django.shortcuts import render
 + 
 +. . .
 + 
 +def index(request):
 +    lista_peliculas = Pelicula.objects.all()
 +    context = {'lista_peliculas': lista_peliculas}
 +    return render(request, 'mispeliculas/index.html', context)
 +</code>
  
 === ASP.NET === === ASP.NET ===
  
-((https://www.asp.net))+[[https://www.asp.net|ASP.NET]] es una tecnología, creada por Microsoft, para el desarrollo de sitio web dinámicos, aplicaciones y servicios web. Es la tecnología sucesora de lo que antes se conocía como //ASP//, la antigua tecnología de Microsoft para la creación de páginas web dinámicas. 
 + 
 +Al funcionar sobre la plataforma //.NET// de Microsoft, permite que se pueda desarrollar en cualquier de los lenguajes de programación de dicha plataforma, //Visual Basic .NET// o //C#//. 
 + 
 +Lo más habitual es verlo funcionar junto con el servidor web de Microsoft, IIS (Internet Information Server).
  
 <figure> <figure>
 {{ asp_iis.png }} {{ asp_iis.png }}
 <caption>Arquitectura habitual JSP/Servlets</caption></figure> <caption>Arquitectura habitual JSP/Servlets</caption></figure>
-==== Herramientas para el desarrollo web en entorno servidor ==== 
  
-----+A continuación, un ejemplo de página web dinámica con ASP.NET (desarrollada en lenguaje C#) programando la acción que ocurre al pulsar un botón (aparece el texto de un formulario en la parte final de la web):
  
-===== Ejercicios =====+<code csharp> 
 +protected void Button1_Click(object sender, EventArgs e) 
 +{ 
 +   string buf = TextBox1.Text; 
 +   changed_text.InnerHtml = buf.ToUpper(); 
 +} 
 +</code>
  
-----+<code html> 
 +<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs"  
 +   Inherits="firstexample._Default" %>
  
-===== Proyectos de Ejemplo =====+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  
-----+<html xmlns="http://www.w3.org/1999/xhtml" >
  
-===== Prácticas =====+   <head runat="server"> 
 +      <title> 
 +         Untitled Page 
 +      </title> 
 +   </head> 
 +    
 +   <body> 
 +    
 +      <form id="form1" runat="server"> 
 +         <div> 
 +          
 +            <asp:TextBox ID="TextBox1" runat="server" style="width:224px"> 
 +            </asp:TextBox> 
 +             
 +            <br /> 
 +            <br /> 
 +             
 +            <asp:Button ID="Button1" runat="server" Text="Enter..." style="width:85px" onclick="Button1_Click" /> 
 +            <hr /> 
 +             
 +            <h3> Results: </h3> 
 +            <span runat="server" id="changed_text" /> 
 +      
 +         </div> 
 +      </form> 
 +   </body> 
 +</html> 
 +</code>
  
 ---- ----
  
-(c) 2017 Santiago Faci+(c) 2017-2019 Santiago Faci
apuntes/introduccion.1505956610.txt.gz · Last modified: 2019/01/04 13:22 (external edit)