Ver el código de «Usuario:ManuelRomero/JavaScript/algoritmica/programacionWeb»

{{Usuario:ManuelRomero/JavaScript/algoritmica/nav}}
__NOTOC__
__NOEDITSECTION__
{|cellpadding="5" cellspacing="6" style="width:100%;background:#DFFFFF; border-style:solid; border-width:2px; border-color:#0066FF;" 
| width="100%" valign="top" style="padding: 0; margin:0px;" |
{|cellpadding="5" cellspacing="6" style="width:100%;background:#DFFFFF; border-style:solid; border-width:1px; border-color:#0066FF;" 
| width="100%" valign="top" style="padding: 0; margin:0px;" |
<span style="background:#FFFF99">
</span> 
[[Imagen:appWeb.png|center]]
|}



<br>
{{#widget:Slides}}
<div class="slides layout-regular template-default">


<!--2------------------------------------------------------>
<div class="slide">
===CONCEPTOS SOBRE DESARROLLO WEB===
</div>


<!--3------------------------------------------------------>
<div class="slide">
===Qué es un desarrollo web===
*Un desarrollo web consiste en hacer una aplicación que el usuario la va a ejecutar en un entorno web
*A la hora de desarrolla aplicaciones web, son diferentes las tecnologías que intervienen
;Html
;CSS
;Lenguaje en el cliente
;Lenguaje en el servidor
;Servidores web o servidores de aplicaciones 
;La red
;Otros elementos o plugins a incorporar



<!--5--------------------------------------------------->
<div class="slide">
===Desarrollar una aplicación===
<hr/>
{{Conocimiento previo|Qué es '''''Desarrollar una aplicación'''''}}
*Son muchas las posibles respuestas, pero al menos deberíamos saber dar una de forma correcta


</div>

<div class="slide">
<!--6--------------------------------------------------->
{{Actividad|Vamos a dar una definición entre todos. Aportar ideas}}
</div>



<!--7--------------------------------------------------->
<div class="slide">
;Posible definición
{{Definicion|
*Dado un problema de naturaleza lógica, 
*desarrollar una aplicación consiste en
*'''''implementar''''' o construir un programa usando un determinado lenguaje de programación,
*Dicho programa consiste en '''''un conjunto de instrucciones''''' que ejecutadas en un entorno computacional '''''solucionan''''' de forma automatizada '''''el problema planteado'''''.}}
</div>



<!--8--------------------------------------------------->
<div class="slide">
[[Imagen:DesarrollarAplicacion.png|center|700px]]
</div>
<!---8--->

<!--7--------------------------------------------------->
<div class="slide">
;Desarrolar una aplicación
*Cuando decimos '''''implementar''''' nos referimos a :
#'''''Analizar''''' el problema.
#'''''Diseñar''''' una solución algorítmica válida.
#'''''Escribir el código'''''  de dicha solución utilizando uno o varios  lenguajes de programación concreto, interpretables o complilables.
</div>


<!--8--------------------------------------------------->
<div class="slide">
;Desarrollar una aplicación
{{Pregunta|'''''¿Compilación o interpretación?'''''}}
*Las instrucciones escritas, de alguna manera han de pasar a código máquina para que se puedan ejecutar en un entorno computacional. 
*Para ello dichas instrucciones pueden '''''Compilarse o Interpretarse'''''
</div>


<!--9--------------------------------------------------->
<div class="slide">
{{Conocimiento previo|Diferencias entre '''''Compilacion Vs Interpretación'''''}}
{{Actividad|Proponer lenguajes que conozcamos y ver si son compilados o interpretados}}
;Es una forma de acercarnos a la programación en general y en particular a la programación web
;Por curiosidad hay un lenguaje de programación especial llamado Java 
{{Pregunta|Qué es Java? ¿Es java interpretado o compilado?  }}
</div>


<!--9--------------------------------------------------->
<div class="slide">
{{Pregunta|En un entorno de ejecución web, qué tipo de modelo se debe de usar y por qué}}
</div>

<!--10----------------------------------------------------->
<div class="slide">
===Una Aplicación Web===
<br/>
{{Conocimiento previo|Qué es una '''''Aplicación Web'''''}}
*Normalmente en un ordenador vemos un programa o aplicación ejecutándose, con el cual podemos estar interactuando.
*No todos los programas o aplicaciones son del mismo tipo, tenemos diferentes tipos de software
</div>

<!--11----------------------------------------------------->
<div class="slide">
;Tipos de aplicaciones

#Aplicaciones de escritorio.
#Aplicaciones de ingeniería.
#Aplicación de Tiempo real.
#Software de Inteligencia artificial.
#Software de predicciones metereológicas, cálculo científico.
#Aplicaciones de juegos.
#Aplicaciones web.
#...
</div>

<!--12----------------------------------------------------->
<div class="slide">
;Tipos de sorftware
*Los diferentes '''''[http://www.tiobe.com/index.php/content/paperinfo/tpci/index.html lenguajes de programación'''''] son todos de propósito general, esto es,  pueden implementar cualquier algoritmo correcto.
*No obstante presentan diferentes características que los hacen más idóneos para  implementar código en determinados tipo de software, de modo que dependiendo el tipo de software que vamos a desarrollar deberíamos de ver que tipos de lenguajes tenemos disponibles.
</div>

<!--14----------------------------------------------------->
<div class="slide">
;framework
*También van apareciendo '''''framework''''' donde con un lenguaje de programación se toma una metodología de trabajo y  se adapta un determinado lenguaje (Por ejemplo creando dentro del framework determinados objetos) para facilitar el trabajo al desarrollador.

{{Recursos de la Web|
*[http://www.bestwebframeworks.com/ framework] para el desarrollo web}}
</div>

<!--16----------------------------------------------------->
<div class="slide">
{{Pregunta|Qué carácterísticas tiene una apliación web}}
[[Imagen:AplicacioneWeb1.png]]
</div>

<!--17----------------------------------------------------->
<div class="slide">

*En la imagen vemos una serie de elementos
#Un entorno de  cliente.
#Un entorno  de servidor.
#Una parte de comunicaciones y protocolo.
</div>

<!--18---------------------------------------------------->
<div class="slide">
;Entornos en una aplicación web
*En realidad cada un de estas partes es importante estudiarlas para poder realizar un desarrollo web.
#La parte de '''cliente''' es la que vamos a cubrir o estais ya cubriendo en este curso
#La parte de '''comunicaciones y protocolo''' y algo de aplicaciones del servidor  la vais a ver un poco con Nacho en la siguiente unidad formativa.
#La parte del '''entorno servidor''' Veremos un poco al final de esta unidad formativa con la intención de que tengáis una visión global del desarrollo web.
</div>

<!--19---------------------------------------------------->
<div class="slide">
*Lógicamente una aplicación web a de tener cada una de esas partes
[[Imagen:ServidorWebVsCliente.jpg]]
</div>

<!--12---------------------------------------------------->
<div class="slide">
==El cliente en el proceso de ejecución de una aplicación web==
*Es el usuario final  el que empieza el proceso.
*También se conoce como agente.
*En el cliente necesitamos tener  una serie de elementos
</div>

<!--13---------------------------------------------------->
<div class="slide">
*Un programa (navegador) dónde el usuario escribe la solicitud (Lá página a la que quiero acceder, la máquina en la que se encuentra, y dentro de la página su ubicación).
*Necesitamos encontrar la ip de la máquina a partir de su nombre (DNS)
*Interpretar y visualizar la información que el servidor nos facilite en formato html (El navegador).
*Ejecutar los script que aporte la respuesta del servidor por ejemplo código en java Script (Todos los navegadores modernos interpretan el código JavaScript  y lo ejecutan.
</div>

<!--13---------------------------------------------------->
<div class="slide">

===Especificadno el recurso===
*El cliente hace una petición de una página web
*Para ello escribe la URI en el navegador indicando máquina dónde  está.
*También nombre de la página que solicita, protocolo usado y puerto por el que realiza la solicitud.
*(En la mayoría de las ocasiones se toma el puerto por defecto para ese protocolo
*http 80, https   443
</div>

<!--13---------------------------------------------------->
<div class="slide">

*También se puede incluir  lo que se llama solicitud y fragmento.
*'''''La solicitud''''' son parejas variabla=valor que se pasan en la solicitud
*'''''El fragmenta''''' representa una parte concreta de la página que se solicita, 
*Para el fragmento se utiliza el método GET dentro del protocolo http.
</div>
<!--7-->
<div class="slide">
*ejemplo de direcciones

#Usando fragmento

 '''protcolo://maquina/ruta/recurso/fragmento'''
 '''''http://www.unizar.es/deiss/notas.html#primerCurso'''''
#Usando solicitud
 '''protcolo://maquina/ruta/recurso/solicitud'''
 '''''http://www.unizar.es/deiss/notas.htmll?nombre="Manuel"&modulo="DWES"'''''
#Usando el puerto
 '''protcolo://maquina:puerto/ruta/recurso/'''
'''''http://www.unizar.es:80/'''''
*Si se elude alguna parte se toma el valor por defecto o lo que establezca el servidor web
</div>

<!--13---------------------------------------------------->
<div class="slide">

==Los medios en el proceso de ejecución de una aplicación web==
*Aparte de la comunicación física necesitamos unos protocolos
*Protocolos de la familia tcp/ip. 
*Protocolos utilizados Http, tpc/udp, piv4 ipv6 icmp, y otros muchos que se pueden usar a nivel de aplicación.
</div>

<!--13---------------------------------------------------->
<div class="slide">

==El servidor en el proceso de ejecución de una aplicación web==
*Servidor Web
*Recibe e interpreta la solicitud del cliente
*Accede a bases de datos según necesidades
*Ejecuta código en el servidor, generando  como resultado una página html que es lo que da al cliente 
*(El cliente no ve el código del servidor).
</div>

<!--13---------------------------------------------------->
<div class="slide">
{{Pregunta|
¿Podemos visualizar  una página web sin que intervenga un servidor web?
}}
</div>

<!--13---------------------------------------------------->
<div class="slide">
<!--MRM Tarea 1-->
{{Actividad|
*Realiza en un documento usando diagramas y detallando el proceso de carga de una página web
*Contempla la posibilidad de tener que ejecutar script tanto en cliente como en servidor
*Identifica en un bloque cada uno de los elementos (CLIENTE, SERVIDOR o MEDIOS) o programas necesarios (programa navegador, protocolo http en cliente, servidor dns, interprete de javaScript, ...)
}}
</div>

<!--13---------------------------------------------------->
<div class="slide">
 
|}