SlideShare una empresa de Scribd logo
1 de 18
PROGRAMACIÓN WEB
Scripting en el lado del Cliente
M.T.E. Arturo Ocampo López
ARQUITECTURA DE RED
DE 3 CAPAS
Desarrollo web y móvil:
Interfaz gráfica del lado
del cliente
Servidores Web: Apache, IIS, y otros.
Servidor de Aplicaciones Web:
Tomcat, Jboss, IBM WebSphere y
derivados, IIS, y otros
Manejador de Base de Datos:
MySQL, PostgreSQL,
MariaDB, Oracle, SQL Server,
y otras
PÁGINAS DINÁMICAS DEL
LADO DE CLIENTE
• Son aquellas en las que la propia página contiene código
para implementar dicha interactividad. Se implementan con
lenguajes de Script y aplicaciones de ejecución local como:
JavaScript o VBScript
PÁGINAS DINÁMICAS DEL
LADO DEL SERVIDOR
• Son aquellas generadas por una aplicación web, tal que la
información contenida en ellas puede haber sido
personalizada por el usuario. Se implementa con diversas
tecnologías: CGI, ASP,JSP, PHP, ASP.NET
INVESTIGACIÓN
• Integrar parejas o tríadas (25 minutos)
• Investigar en “fuentes válidas” sobre “Lenguajes Script del
lado del cliente” considerar los siguientes aspectos:
• Ejemplos de lenguajes
• Características
• Ventajas
• Desventajas
• Contexto: Considerando la arquitectura de 3 capas y la ejecución
del lado del cliente o del servidor, ¿cuáles serían los aspectos más
importantes a considerar si deseo hacer un sitio web para
compartir información del lado del cliente?
APLICACIONES DE
EJECUCIÓN LOCAL
• HTML Lenguaje de hipermarcado de texto
• CSS hojas de estilos en cascada para el diseño
que acompaña a la información.
• DOM: Document Object Model para mostrar e
interactuar dinámicamente con la información
presentada.
• XMLHttpRequest para intercambiar datos de
forma asíncrona con el servidor web.
• XML para la transferencia de datos solicitados al
servidor.
APLICACIONES DE
EJECUCIÓN LOCAL
• Java Applets: Suele ser una aplicación gráfica desarrollada en Java
que se queda embebida en una página web. Para su ejecución es
necesario que el cliente tenga instalada la Máquina Virtual de Java.
• Active X Controls: Aplicación realizada en Visual Basic o en C++,
está basada en tecnologías Microsoft embebidas en el HTML. Solo
es válido para Internet Explorer.
• Animaciones Flash: Son objetos realizados en Macromedia Flash y
embebidos en la página web, es necesario que el navegador tenga
instalado el reproductor de Flash.
SCRIPT LADO DEL CLIENTE
• VBScript: Es una versión para navegadores de Visual Basic,
fue un fuerte competidor de Java Script, pero debido a que
solo era válido para navegadores de Microsoft ha caído en
deshuso.
• JavaScript: Es un lenguaje derivado del LiveScript de
Netscape, se basa en la familia de lenguajes C. Tiene
elementos similares a Java, pero no es Java.
MODELO DE OBJETOS
CON LENGUAJE SCRIPT.
• Un script en el lado del cliente es un programa que puede
acompañar a un documento HTML o que puede estar incluido en
él.
• El programa se ejecuta en la máquina del cliente cuando se carga
el documento, o en algún otro instante, como por ejemplo cuando
se activa un vínculo.
MODELO DE OBJETOS
CON LENGUAJE SCRIPT.
• El soporte de scripts de HTML es independiente del lenguaje de
scripts.
• Hay dos tipos de scripts que los autores pueden asociar a un
documento HTML:
Aquellos que se
ejecutan una sola vez
cuando el agente de
usuario carga el
documento.
Aquellos que son
ejecutados cada vez
que ocurre un
determinado evento.
USO DE SCRIPTING
• Modificar los contenidos del documento dinámicamente.
• Procesar los datos que se introducen en un formulario.
• Rellenar dinámicamente partes de un formulario según los valores
de los otros campos.
• Asegurarse que los datos introducidos concuerden con rangos de
valores.
• Pueden ser llamados por eventos que afecten al documento.
• Pueden ser vinculados a controles de formulario para producir
elementos gráficos.
VENTAJAS
• Aplicaciones de muy diversos tipo, desde generadores de HTML,
comprobadores de formularios, etc.
• Desarrollar aplicaciones web que permitan crear páginas como si
fueran ventanas.
• Da la sensación de estar trabajando con una aplicación con interfaz
de ventanas.
VENTAJAS
• Páginas dinámicas (DHTML)
• Comprobación de datos (Formularios)
• Uso de los elementos de la página web
• Intercambiar información entre
páginas web en distintas ventanas
• Manipulación de gráficos, texto, etc.
• Comunicación con plug-ins: Flash,
Java, Shockwave, etc.
VENTAJAS
• Es seguro y fiable hay que
interpretarlo, por lo que puede ser
filtrado.
• Se ejecuta en el cliente por lo que el
servidor no es solicitado más de lo
debido.
DESVENTAJAS
• Dependiente del sistema
donde se están ejecutando
NUEVAS CAPACIDADES
• DHTML, los scripts en el lado del cliente cambian el HTML del
documento, lo cual afecta la apariencia y las funciones de los
objetos.
• AJAX es en donde se utiliza el objeto XMLHttpRequest para
intercambiar datos asincrónicamente con el servidor web.
INTEGRACIÓN
• Conformar equipos de 4 participantes (45 minutos)
• Integrar en un archivo de Word la siguiente información:
• Portada
• Introducción
• Ejemplos de Lenguajes Script del cliente
• Ventajas
• Desventajas
• Conclusiones
• Bibliografía (en formato APA)
• Enviar el archivo en Blakboard
MUCHAS GRACIAS

Más contenido relacionado

La actualidad más candente

Ventajas y desventajas de moprosoft
Ventajas y desventajas de moprosoftVentajas y desventajas de moprosoft
Ventajas y desventajas de moprosoft
Chuyito Alvarado
 
Validación de Requerimientos
Validación de RequerimientosValidación de Requerimientos
Validación de Requerimientos
UTPL UTPL
 
Requirement change management
Requirement change managementRequirement change management
Requirement change management
Abdul Basit
 

La actualidad más candente (20)

Modelo TSP
Modelo TSPModelo TSP
Modelo TSP
 
Ventajas y desventajas de moprosoft
Ventajas y desventajas de moprosoftVentajas y desventajas de moprosoft
Ventajas y desventajas de moprosoft
 
Arquitectura fisica y logica
Arquitectura fisica y logicaArquitectura fisica y logica
Arquitectura fisica y logica
 
Lecture 3 software process model
Lecture 3   software process modelLecture 3   software process model
Lecture 3 software process model
 
Traductor y su estructura
Traductor y su estructuraTraductor y su estructura
Traductor y su estructura
 
Aseguramiento de la calidad en software III
Aseguramiento de la calidad en software IIIAseguramiento de la calidad en software III
Aseguramiento de la calidad en software III
 
modelo vista controlador
modelo vista controladormodelo vista controlador
modelo vista controlador
 
GESTION DEL RIESGO
GESTION DEL RIESGOGESTION DEL RIESGO
GESTION DEL RIESGO
 
Validación de Requerimientos
Validación de RequerimientosValidación de Requerimientos
Validación de Requerimientos
 
LINEAS DE PRODUCTOS DE SOFTWARE Y MÉTODO WATCH
LINEAS DE PRODUCTOS DE SOFTWARE Y MÉTODO WATCHLINEAS DE PRODUCTOS DE SOFTWARE Y MÉTODO WATCH
LINEAS DE PRODUCTOS DE SOFTWARE Y MÉTODO WATCH
 
Software Quality Assurance
Software Quality Assurance Software Quality Assurance
Software Quality Assurance
 
Procedimientos almacenados en MySQL
Procedimientos almacenados en MySQLProcedimientos almacenados en MySQL
Procedimientos almacenados en MySQL
 
Arquitectura sql
Arquitectura sqlArquitectura sql
Arquitectura sql
 
¿Cómo realizar entrevistas eficaces para obtener requisitos de software?
¿Cómo realizar entrevistas eficaces para obtener requisitos de software?¿Cómo realizar entrevistas eficaces para obtener requisitos de software?
¿Cómo realizar entrevistas eficaces para obtener requisitos de software?
 
Modelamiento software
Modelamiento softwareModelamiento software
Modelamiento software
 
Modelos de software ventajas y desventajas
Modelos de software ventajas y desventajasModelos de software ventajas y desventajas
Modelos de software ventajas y desventajas
 
Software process and project metrics
Software process and project metricsSoftware process and project metrics
Software process and project metrics
 
Rmi
RmiRmi
Rmi
 
Software Verification & Validation
Software Verification & ValidationSoftware Verification & Validation
Software Verification & Validation
 
Requirement change management
Requirement change managementRequirement change management
Requirement change management
 

Similar a Scripting cliente

Arquitectura- Programacion WEB
Arquitectura- Programacion WEBArquitectura- Programacion WEB
Arquitectura- Programacion WEB
Yael_21
 
introduccionallaprogramacionweb-230123213144-47a8fc90.ppt
introduccionallaprogramacionweb-230123213144-47a8fc90.pptintroduccionallaprogramacionweb-230123213144-47a8fc90.ppt
introduccionallaprogramacionweb-230123213144-47a8fc90.ppt
ssuser948499
 

Similar a Scripting cliente (20)

Lenguaje script
Lenguaje scriptLenguaje script
Lenguaje script
 
Programacion web al lado del servidor.pdf
Programacion web al lado del servidor.pdfProgramacion web al lado del servidor.pdf
Programacion web al lado del servidor.pdf
 
Charla internet
Charla internetCharla internet
Charla internet
 
Programación web
Programación webProgramación web
Programación web
 
Arquitectura- Programacion WEB
Arquitectura- Programacion WEBArquitectura- Programacion WEB
Arquitectura- Programacion WEB
 
Sistemas Operativos
Sistemas OperativosSistemas Operativos
Sistemas Operativos
 
Desarrollo de aplicaciones web
Desarrollo de aplicaciones webDesarrollo de aplicaciones web
Desarrollo de aplicaciones web
 
Aplicaciones distribuidas
Aplicaciones distribuidasAplicaciones distribuidas
Aplicaciones distribuidas
 
Apuntes materia entorno cliente servidor
Apuntes materia entorno cliente servidorApuntes materia entorno cliente servidor
Apuntes materia entorno cliente servidor
 
Consideraciones al escoger apps híbridas vs nativas
Consideraciones al escoger apps híbridas vs nativasConsideraciones al escoger apps híbridas vs nativas
Consideraciones al escoger apps híbridas vs nativas
 
Desarrollo de paginas web dinamicas
Desarrollo de paginas web dinamicasDesarrollo de paginas web dinamicas
Desarrollo de paginas web dinamicas
 
Plataformas cliente servidor
Plataformas cliente servidorPlataformas cliente servidor
Plataformas cliente servidor
 
Unidad 1
Unidad 1Unidad 1
Unidad 1
 
introduccionallaprogramacionweb-230123213144-47a8fc90.ppt
introduccionallaprogramacionweb-230123213144-47a8fc90.pptintroduccionallaprogramacionweb-230123213144-47a8fc90.ppt
introduccionallaprogramacionweb-230123213144-47a8fc90.ppt
 
INTRODUCCION AL LA PROGRAMACION WEB.ppt
INTRODUCCION AL LA PROGRAMACION WEB.pptINTRODUCCION AL LA PROGRAMACION WEB.ppt
INTRODUCCION AL LA PROGRAMACION WEB.ppt
 
Herramientas SI para Aplicaciones Web - Gianni Rodriguez
Herramientas SI para Aplicaciones Web - Gianni RodriguezHerramientas SI para Aplicaciones Web - Gianni Rodriguez
Herramientas SI para Aplicaciones Web - Gianni Rodriguez
 
0. Antecedentes Asp
0. Antecedentes Asp0. Antecedentes Asp
0. Antecedentes Asp
 
15-Unidad 4: Introducción a las Arquitecturas Web 4.1 DAO 4.2 MVC
15-Unidad 4: Introducción a las Arquitecturas Web 4.1 DAO 4.2 MVC15-Unidad 4: Introducción a las Arquitecturas Web 4.1 DAO 4.2 MVC
15-Unidad 4: Introducción a las Arquitecturas Web 4.1 DAO 4.2 MVC
 
Cliente servidor
Cliente servidorCliente servidor
Cliente servidor
 
Herramientas y Tecnologías para la Web
Herramientas y Tecnologías para la WebHerramientas y Tecnologías para la Web
Herramientas y Tecnologías para la Web
 

Último

Evaluación del riesgo tecnologías informáticas.pdf
Evaluación del riesgo tecnologías informáticas.pdfEvaluación del riesgo tecnologías informáticas.pdf
Evaluación del riesgo tecnologías informáticas.pdf
GuillermoBarquero7
 
2da. Clase Mecanografía e introducción a Excel (2).pptx
2da. Clase Mecanografía e introducción a Excel (2).pptx2da. Clase Mecanografía e introducción a Excel (2).pptx
2da. Clase Mecanografía e introducción a Excel (2).pptx
EncomiendasElSherpa
 

Último (6)

ESCRITORIO DE WINDOWS 11 Y SUS ELEMENTOS
ESCRITORIO DE WINDOWS 11 Y SUS ELEMENTOSESCRITORIO DE WINDOWS 11 Y SUS ELEMENTOS
ESCRITORIO DE WINDOWS 11 Y SUS ELEMENTOS
 
Evaluación del riesgo tecnologías informáticas.pdf
Evaluación del riesgo tecnologías informáticas.pdfEvaluación del riesgo tecnologías informáticas.pdf
Evaluación del riesgo tecnologías informáticas.pdf
 
Trabajo de Powerpoint - Unsaac - Ofimática
Trabajo de Powerpoint - Unsaac - OfimáticaTrabajo de Powerpoint - Unsaac - Ofimática
Trabajo de Powerpoint - Unsaac - Ofimática
 
Caso de Exito LPL Projects Logistics Spain y Business Central
Caso de Exito LPL Projects Logistics Spain y Business CentralCaso de Exito LPL Projects Logistics Spain y Business Central
Caso de Exito LPL Projects Logistics Spain y Business Central
 
Caso de éxito de Hervian con el ERP Sage 200
Caso de éxito de Hervian con el ERP Sage 200Caso de éxito de Hervian con el ERP Sage 200
Caso de éxito de Hervian con el ERP Sage 200
 
2da. Clase Mecanografía e introducción a Excel (2).pptx
2da. Clase Mecanografía e introducción a Excel (2).pptx2da. Clase Mecanografía e introducción a Excel (2).pptx
2da. Clase Mecanografía e introducción a Excel (2).pptx
 

Scripting cliente

  • 1. PROGRAMACIÓN WEB Scripting en el lado del Cliente M.T.E. Arturo Ocampo López
  • 2. ARQUITECTURA DE RED DE 3 CAPAS Desarrollo web y móvil: Interfaz gráfica del lado del cliente Servidores Web: Apache, IIS, y otros. Servidor de Aplicaciones Web: Tomcat, Jboss, IBM WebSphere y derivados, IIS, y otros Manejador de Base de Datos: MySQL, PostgreSQL, MariaDB, Oracle, SQL Server, y otras
  • 3. PÁGINAS DINÁMICAS DEL LADO DE CLIENTE • Son aquellas en las que la propia página contiene código para implementar dicha interactividad. Se implementan con lenguajes de Script y aplicaciones de ejecución local como: JavaScript o VBScript
  • 4. PÁGINAS DINÁMICAS DEL LADO DEL SERVIDOR • Son aquellas generadas por una aplicación web, tal que la información contenida en ellas puede haber sido personalizada por el usuario. Se implementa con diversas tecnologías: CGI, ASP,JSP, PHP, ASP.NET
  • 5. INVESTIGACIÓN • Integrar parejas o tríadas (25 minutos) • Investigar en “fuentes válidas” sobre “Lenguajes Script del lado del cliente” considerar los siguientes aspectos: • Ejemplos de lenguajes • Características • Ventajas • Desventajas • Contexto: Considerando la arquitectura de 3 capas y la ejecución del lado del cliente o del servidor, ¿cuáles serían los aspectos más importantes a considerar si deseo hacer un sitio web para compartir información del lado del cliente?
  • 6. APLICACIONES DE EJECUCIÓN LOCAL • HTML Lenguaje de hipermarcado de texto • CSS hojas de estilos en cascada para el diseño que acompaña a la información. • DOM: Document Object Model para mostrar e interactuar dinámicamente con la información presentada. • XMLHttpRequest para intercambiar datos de forma asíncrona con el servidor web. • XML para la transferencia de datos solicitados al servidor.
  • 7. APLICACIONES DE EJECUCIÓN LOCAL • Java Applets: Suele ser una aplicación gráfica desarrollada en Java que se queda embebida en una página web. Para su ejecución es necesario que el cliente tenga instalada la Máquina Virtual de Java. • Active X Controls: Aplicación realizada en Visual Basic o en C++, está basada en tecnologías Microsoft embebidas en el HTML. Solo es válido para Internet Explorer. • Animaciones Flash: Son objetos realizados en Macromedia Flash y embebidos en la página web, es necesario que el navegador tenga instalado el reproductor de Flash.
  • 8. SCRIPT LADO DEL CLIENTE • VBScript: Es una versión para navegadores de Visual Basic, fue un fuerte competidor de Java Script, pero debido a que solo era válido para navegadores de Microsoft ha caído en deshuso. • JavaScript: Es un lenguaje derivado del LiveScript de Netscape, se basa en la familia de lenguajes C. Tiene elementos similares a Java, pero no es Java.
  • 9. MODELO DE OBJETOS CON LENGUAJE SCRIPT. • Un script en el lado del cliente es un programa que puede acompañar a un documento HTML o que puede estar incluido en él. • El programa se ejecuta en la máquina del cliente cuando se carga el documento, o en algún otro instante, como por ejemplo cuando se activa un vínculo.
  • 10. MODELO DE OBJETOS CON LENGUAJE SCRIPT. • El soporte de scripts de HTML es independiente del lenguaje de scripts. • Hay dos tipos de scripts que los autores pueden asociar a un documento HTML: Aquellos que se ejecutan una sola vez cuando el agente de usuario carga el documento. Aquellos que son ejecutados cada vez que ocurre un determinado evento.
  • 11. USO DE SCRIPTING • Modificar los contenidos del documento dinámicamente. • Procesar los datos que se introducen en un formulario. • Rellenar dinámicamente partes de un formulario según los valores de los otros campos. • Asegurarse que los datos introducidos concuerden con rangos de valores. • Pueden ser llamados por eventos que afecten al documento. • Pueden ser vinculados a controles de formulario para producir elementos gráficos.
  • 12. VENTAJAS • Aplicaciones de muy diversos tipo, desde generadores de HTML, comprobadores de formularios, etc. • Desarrollar aplicaciones web que permitan crear páginas como si fueran ventanas. • Da la sensación de estar trabajando con una aplicación con interfaz de ventanas.
  • 13. VENTAJAS • Páginas dinámicas (DHTML) • Comprobación de datos (Formularios) • Uso de los elementos de la página web • Intercambiar información entre páginas web en distintas ventanas • Manipulación de gráficos, texto, etc. • Comunicación con plug-ins: Flash, Java, Shockwave, etc.
  • 14. VENTAJAS • Es seguro y fiable hay que interpretarlo, por lo que puede ser filtrado. • Se ejecuta en el cliente por lo que el servidor no es solicitado más de lo debido.
  • 15. DESVENTAJAS • Dependiente del sistema donde se están ejecutando
  • 16. NUEVAS CAPACIDADES • DHTML, los scripts en el lado del cliente cambian el HTML del documento, lo cual afecta la apariencia y las funciones de los objetos. • AJAX es en donde se utiliza el objeto XMLHttpRequest para intercambiar datos asincrónicamente con el servidor web.
  • 17. INTEGRACIÓN • Conformar equipos de 4 participantes (45 minutos) • Integrar en un archivo de Word la siguiente información: • Portada • Introducción • Ejemplos de Lenguajes Script del cliente • Ventajas • Desventajas • Conclusiones • Bibliografía (en formato APA) • Enviar el archivo en Blakboard