89001683 Desarrollo Aplicaciones Web (Redes)

7/25/2019 89001683 Desarrollo Aplicaciones Web (Redes)

1/245

SERVICIO NACIONAL DE ADIESTRAMIENTO EN TRABAJO INDUSTRIAL

MANUAL DE APRENDIZAJE

CDIGO: 89001683

Profesional Tcnico

DESARROLLO DEAPLICACIONES WEB

COMPUTACIN EINFORMTICA


2/245


3/245


4/245


5/245

DESARROLLO DE APLICACIONES WEB

TAREA 01: ANALIZAR LA ESTRUCTURA A LAS APLICACIONES WEB.

En esta tarea trataremos las siguientes operaciones:

Analizar el alcance del proyecto web.

Identificar la estructura bsica de una aplicacin web.Organizar el equipo de trabajo segn especialidades.Seleccionar la interfaz de desarrollo ms adecuada.

EQUIPOS Y MATERIALES:

Computadora con microprocesadores core 2 Duo de mayor capacidad. Sistema operativo Windows. Acceso a internet. Software de maquetacin y desarrollo de pginas web.

ORDEN DE EJECUCIN:

Analizar el alcance del proyecto web. Identificar la estructura bsica de una aplicacin web. Organizar el equipo de trabajo segn especialidades. Seleccionar la interfaz de desarrollo ms adecuada.

OPERACIONES.

1.1. OPERACIN: ANALIZAR EL ALCANCE DEL PROYECTO WEB.Una de los procesos ms importantes para el crecimiento de una empresa ymedir su productividad, es la gestin de sus proyectos.

El personal encargado de desarrollar este tipo deproyectos recibe a diario todo tipo derequerimiento por parte de los usuarios (clientes).A travs de las consultas recibidas se puedeestablecer que las empresas se preocupan

constantemente por encontrar una aplicacin

"Nunca consideres el estudio como una obligacin, sinocomo una oportunidad para penetrar en el bello ymaravilloso mundo del saber..ALBERT EINSTEIN.

ESCUELA DE TECNOLOGAS DE LA INFORMACIN 5


6/245


software para la gestin de proyectos buena, bonita y barata.

ste es un enfoque errneo, ya que antes de elegir unaherramienta software para la gestin de proyectos es

necesario definir los procesos que permitan optimizar eldesarrollo de proyectos.

El mejor software informtico no sirve de nada sino se cuentas con los procesos de trabajo biendefinidos. Sin embargo, con una aplicacin comny una buena metodologa de gestin de proyectosse pueden conseguir grandes resultados en eldesarrollo de proyectos.

Planificacin y el Diseo.

Definir los objetivos y el pblico al que se dirige. Antesde comenzar con el desarrollo, es necesario determinarcul es el fin de nuestro sitio web (generar marca, captarclientes, vender,) e identificar su pblico objetivo.Asimismo, debemos echar un vistazo a la competencia:qu hace, cules son sus estrategias, etc.Hay que tener en cuenta que el desarrollo de nuestraweb no deja de ser un proyecto empresarial o de

negocio.

Organizar la informacin (Arquitectura de la informacin). Unavez hemos determinado el objeto de nuestra web y su pblico,tenemos que organizar y estructurar adecuadamente lainformacin que publicaremos en el sitio. Tras dicha tarea,podremos definir la estructura de la web (pginas,jerarqua,).

Disear la web y crear un prototipo. En este pasono se consideran solo los aspectos visuales oestticos; el diseo tambin se basa en criteriosde usabilidad, accesibilidad y posicionamiento. Deeste modo, el sitio web, adems de ser atractivo ytransmitir calidad, deber disponer de un sistemade navegacin sencillo (la experiencia del usuarioes fundamental) y permitir su correctoposicionamiento web en buscadores. Lgicamente, los elementos denavegacin se plantearn a partir de la estructura web definida en el pasoanterior. Finalmente, este trabajo de diseo se concretar en un prototipo



7/245


realizado en cualquier formato vlido (pdf, presentacin en PowerPoint, etc.); elcual permitir reproducir el diseo acordado, la funcionalidad bsica del sitio y,sobre todo, ayudar a evaluar la solucin web antes de su ejecucin (ahorro decostes).

NOTA:1. Para qu nuestro cliente quiere un sitio web?

Esta pregunta es muy importante ya que debemos de identificar el objetivo del cliente,pues teniendo esto claro nuestro enfoque ser ms centrado y apuntado al proyecto.Recuerda que hay diferentes tipos de sitios web (Sitios Informativos, para ventas, paraentretener, para educar, para promocionar,etc.) diferentes enfoques que satisfacen lasdiferentes necesidades.

2. El tiempo siempre es importante tenerloen cuenta, por lo general el cliente siempre tendr urgencia y lo querr lo antesposible, pero debes de tener en cuenta el tipo y tamao de la web, lo complejo queser hacerla, tener en cuenta el tiempo de cambios y detalles, y lo ms importante, turitmo y forma de trabajo, dependiendo de esto debes de calcular el tiempo para tenerel website listo.

1.2. OPERACIN: IDENTIFICAR LA ESTRUCTURA BSICA DE UNAAPLICACIN WEB.

Un factor importante es la elaboracin de una estructura y jerarqua bienelaborada de los contenidos de la pgina. La gestin del contenido, es decir, lapresentacin de la informacin, los mensajes a transmitir a los clientes, ladistribucin e intercambio de informacin con los usuarios para obtener unapgina web que sea eficaz como canal de comunicacin, es fundamental paraconseguir una fidelidad y un contacto fluido y directo con los futuros usuarios yclientes.

Textos.La informacin suministrada en la pgina web debeser nica y relevante, usando las palabras y frasesclave para poder proceder posteriormente a unabuena optimizacin. Copiando el texto de una pginaweb similar supondra la penalizacin de sta por losbuscadores de internet.

Es muy importante que la informacin de su pginaest actualizada regularmente y no quede obsoleta.



8/245


Imgenes y Animacin .El uso de imgenes y animaciones incrementavisualmente la calidad de la pgina web, encambio, un uso incorrecto de stas puede serobviado por los buscadores y por tanto no serconsideradas para la optimizacin de la pgina. Eluso abusivo de imgenes tambin ralentiza lacarga de la pgina web hacindola de difcil acceso a los usuarios quedispongan de una conexin lenta.

NOTA:

El texto contenido en imgenes y animaciones flash es totalmente invisible a losbuscadores y por tanto, no tienen ningn valor a la hora de posicionar la pgina.

Creatividad y Diseo.Una vez definida la estructura de la pgina web y loselementos que la componen, se procede al diseovisual del contenido junto a la identidad corporativa dela empresa, es decir, la integracin del logo, colorescorporativos, etc.

El propsito es conseguir una unin entre diseo y contenido, aumentando elefecto visual y la eficacia de la pgina web.

Navegabilidad.Es importante que su pgina web sea fcilmentenavegable, es decir, que el usuario visualice y accedaa la informacin solicitada, desplazndose fcilmentepor todas las pginas que componen su web.

Es importante que todos los clientes interesados en la

informacin y contenido de su pgina web puedan acceder de una forma fcil asu pgina a travs de distintos navegadores de Internet, no solamente de unnavegador.

Accesibi lidad .Cada navegador interpreta los cdigos HTML de formadiferente, es decir, una pgina programada solamente para I.E.10 no se ver igual en un navegador Chrome, Opera, Mozilla uotros.



9/245


Otros servicios:Las aplicaciones basadas en web incrementan eltrfico en la pgina ya que los usuarios losconsideran de un inters adicional, y crean laposibilidad de que su pgina vuelva a ser visitadae incluso recomendada a terceras personas.

Aplicaciones web como servicios comopronstico del tiempo, zonas de descarga, calculadores de hipoteca, bsquedapor secciones, bsqueda de productos, convertidores de moneda, sitiosseguros, comercio electrnico, reservas on-line y otras gestiones de servicio,son algunos de los elementos que generan el dinamismo y la interactividad enla pgina web.

1.3. OPERACIN: ORGANIZAR EL EQUIPO DETRABAJO SEGN ESPECIALIDADES.

El trabajo en equipo es un proceso en el que participaun grupo de personas que comparten objetivossimilares y cuyos conocimientos se complementan, conla finalidad de alcanzar metas comunes. El incumplimiento o lairresponsabilidad de alguno de los integrantes del grupo de trabajo afectan eltrabajo de todos.

Para desarrollar un sitio Web (el diseo del proyecto, desarrollo, publicacin,mantenimiento, etctera) se requiere la formacin de un grupo de personas quetrabajen en forma coordinada.

Dicho grupo debe estar compuesto por personal de diferentes reas de lacompaa, que deben representar los intereses de su departamento en el sitioWeb.

Lo primero que debemos tener en cuenta es que en el desarrollo web existentres pilares fundamentales para llevar a cabo las tareas.

El rea de diseo: sta es la encargada de realizartodo lo que tiene que ver con la parte cosmtica delproceso, aqu se tiene que plasmar de manerailustrada todo lo que trae el proyecto, las interfacesde usuario y sus respectivas implicaciones dentrode las experiencias de usuario son inicialmentedeterminadas en esta rea.



10/245


Desarrollo Front-End: en esta fase el proyectodeja de ser simplemente una serie de imgenesy bocetos para materializarse por medio decdigo del lado del cliente; es decir, todo elcdigo que no tiene que pasar por medio de unservidor para poder ser ejecutado. HTML, CSS yJavaScript hacen parte del paquete front-endque acerca mucho ms el desarrollo a su forma real, permitiendo mostrarposibles falencias en la fase de diseo y haciendo de forma sencilla lareestructuracin de los aspectos ms dbiles que vienen desde el primerproceso.

Desarrollo Back-End: la parte final del proyectodonde se le da vida a nuestro desarrollo, todas las

funcionalidades internas, las consultas a bases dedatos en servidores remotos como pueden serenvo de formularios, inicios de sesin y todo loque tenga que pasar a travs de un servidor haceparte de esta etapa. Lenguajes de programacin como PHP, ASP, JAVA yframeworks como Django y Ruby on Rails entre otros hacen parte de la faseBack-End.

Es importante anotar que cada una de estas fases debe ser realizada al menos

por tres departamentos distintos incluso si el grupo es pequeo y slo constade un diseador, un desarrollador front-end y un desarrollador back-end. Nodigo que sea imposible que una sola persona realice todo lo anterior, pero porel tema de optimizacin de trabajo es mejor tener bien definidos los roles decada profesional enfocando su mximo esfuerzo al rea en la que mejor sedesempee.

NOTA:

El desarrollo web es un trabajo en equipo en todas sus formas y acostumbrarse a

hacer uso de las buenas prcticas en cada uno de los roles en los que nos veamosinvolucrados es fundamental para lograr un trabajo eficaz.

1.4. OPERACIN: SELECCIONAR LA INTERFAZ DE DESARROLLO MSADECUADA.

Para desarrollar nuestro proyecto web utilizaremos los siguientes programas:Dreamweaver y Wampserver.



11/245


Dreamweaver.

Iniciar la aplicacin:En la ventana de ejecutar ingrese Dreamweaver y dele clic en aceptar.

Crear nuevo sitio:Dele clic en el men Sitio y luego en Nuevo sitio.

A continuacin ingrese el nombre del sitio y la carpetaque contiene o que va a contener los archivos de supgina web.

Administ rar Sit ios.En esta ventana Ud. podr darle mantenimiento a los sitios que he definido.



12/245


Archivos del proyecto.

En esta ventana Ud. podr cambiar de proyecto de forma rpida mientras en elpanel inferior se muestran los archivos y carpetas que contienen el proyecto.

Crear una nueva pgina.

Dele clic en Nuevo, luego seleccione el tipo de pgina que va a generar y deleclic en el botn crear.

Vistas de una pgina.Puede abrir una pgina dndole doble clic en la pginadesde el panel de archivos en la parte derecha.Luego la pgina se puede ver de tres formas.

Modo Diseo.

Modo Dividi r.En esta vista se puede ver parte del diseo y el cdigo al mismo tiempo.



13/245


Modo Cdigo.En esta vista solo se puede ver el cdigo de la pgina web.

El inspector de Propiedades.En esta ventana se podrn aplicar cambios de formato a la pgina y suselementos.

Dreamweaver CS6 es un software fcil de usar que permite crear pginas webprofesionales.

Las funciones de edicin visual de Dreamweaver CS6 permiten agregarrpidamente diseo y funcionalidad a las pginas, sin la necesidad deprogramar manualmente el cdigo HTML.

Se puede crear tablas, editar marcos, trabajar con capas, insertar

comportamientos JavaScript, etc... de una forma muy sencilla y visual.

Adems incluye un software de cliente FTP completo, permitiendo entre otrascosas trabajar con mapas visuales de los sitios web, actualizando el sitio weben el servidor sin salir del programa.

Novedades de Dreamweaver CS6.

En este punto comentaremos las caractersticas que aporta esta nueva versinsobre la anterior.



14/245


Plantillas diseo fluido. El acceso a la weba travs de todo tipo de dispositivos estexperimentando un aumento importante.Ahora es habitual acceder a internet desdeel telfono mvil y desde las tabletas. Estocomplica el diseo de los sitios web porquelos dispositivos son de diferentesdimensiones. Una forma de afrontar este problema es utilizando el diseofluido, este tipo de diseo hace que la pgina se adapte automticamente a lasdimensiones del dispositivo. Este tipo de diseo utiliza HTML 5 por los que losnavegadores antiguos no son capaces de representarlo correctamente. Sinembargo, existen libreras de Javascript que solucionaneste inconveniente.

Transiciones . Las transiciones permiten pasarpropiedades CSS de un estado inicial a otro estado finalde forma continua. Con transiciones se pueden lograrvistosos efectos de animaciones.

Fuentes Web. Existen sitios web con multitud denuevas fuentes que pueden dar un aire distinto anuestros diseos de pginas web. En estaversin, Dreamweaver permite incorporar los

archivos de nuevas fuentes de forma sencilla.

Integracin con PhoneGap mejorada. PhoneGap es unservicio para generar aplicaciones para telfonosmviles en las plataformas ms utilizadas (Android,Apple,) ahora se ha mejorado la compatibilidad con PhoneGap desdeDreamweaver.

Funciones exclusivas para Creative Cloud. Creative

Cloud es la nueva forma de adquirir productos Adobe,como Dreamweaver, mediante suscripcin mensual oanual, de esta forma se tiene acceso ms rpido a las

actualizaciones y se puede disponer de los archivosde trabajo en cualquier ubicacin con acceso ainternet.

Adems hay funciones que slo estn disponiblespara los suscriptores de Cloud, como la insercin de

etiquetas HTML 5 desde el panel Insertar, lacompatibilidad con Edge Animate o la bsqueda



15/245


dinmica en Mac.

Wampserver.

WampServer es un entorno de desarrollo web paraWindows en el cual se podrn crear aplicaciones web conApache, PHP y base de datos en MySQL (motor de basede datos). Esta herramienta incluye ademas con unadministrador de base de datos PHPMyAdmin con el cualpodremos crear una nueva base de datos e ingresar ladata de las tablas creadas en ella, realizar consultas ygenerar scripts SQL, como exportar e importar scripts de base de datos.

WampServer ofrece a los desarrolladores herramientas necesarias pararealizar aplicaciones web de manera local, con un sistema operativo(Windows), un manejador de base de datos (MySQL), un software deprogramacin script web PHP.

WampSever se caracteriza por que puede ser usado de forma libre es decir nodebemos de contar con alguna licencia el cual nos permita el uso de la misma,ya que pertenece a la corriente de "open source".

FUNDAMENTO TERICO.

Analizar el alcance del proyecto web.

Definir el Alcance del Proyecto es el proceso que consiste en desarrollar unadescripcin detallada del Proyecto y del producto. Esto es fundamental para suxito, ya que proporciona un entendimiento comn entre los interesados delProyecto.

Se elabora a partir de los entregables principales, supuestos y posiblesrestricciones al Proyecto que se han documentado en la fase de Iniciacin,siendo en la fase de Planificacin donde el Alcance del Proyecto se describe yse define de manera ms especfica, segn se va obteniendo ms informacinsobre del Proyecto. Durante este proceso, se analizan los riesgos, lossupuestos y las restricciones existentes, actualizando esta informacin segnsea necesario.



16/245


Planteamiento del proyecto web.

Como diseador o desarrollador web seguramente va aencontrarte con proyectos de todo tipo. A veces se dices a un trabajo sin analizar a fondo lo que tendr que

hacer, cosa que puede llevar problemas ms adelante.Cuando te presentan un nuevo proyecto, pararse apensar si realmente vale la pena, puede ahorrarnosmuchas horas de trabajo no deseado.

Conocer el cl iente.

Es vital conocer un poco el cliente para saber conqu tipo de cliente vamos a trabajar. Si es posible,sera una muy buena pista ver anteriores proyectos

de ese cliente. Pregunta si te puede mostraranteriores pginas web para ver qu cosas legustan y que estilo tiene.Lo importante es sacar informacin para conocerlo, para hacer directamente loque a l le gusta.

Entender al quiere.

Me he encontrado con clientes, que quieren una

cosa pero no saben exactamente qu. Luego tepiden que t, como experto en el tema les desconsejo. Estos tipos de proyecto son peligrososya que son los tpicos que nunca se acaban. Como el cliente no tiene claro loque quiere, aunque el proyecto se haya acabado, l va a encontrar cosas quequiere cambiar.

La mejor forma de solucionar estos problemas es haciendo preguntas, paraque de las respuestas puedas ir obteniendo pistas de cmo hacerlo. Ademshaciendo preguntas vas completando lo comentado en el apartado anterior, elhecho de conocer el cliente para presentar exactamente lo que le gusta.

Escribir todo.

Es bsico, importante, fundamental, esencial y miladjetivos ms, que todo est por escrito. Antes deempezar a trabajar en el proyecto, poneros deacuerdo las dos partes con el precio, los plazos y todoel trabajo que debers hacer, escrbelo todo y firmarlo

las dos partes. De esta forma nos aseguramos que se



17/245


tienen claros los costes del proyecto, se acepta la fecha de entrega y se tieneclaro el proyecto.Si el cliente con el que vas a trabajar es de los que se ha comentadoanteriormente, que duda de qu quiere y del cmo lo quiere, asegrate deescribir y dejar bien claro como trabajaras. La forma ms rpida desolucionarlo, es cobrar al cliente por horas trabajadas, pero hay gente a la queno le gusta trabajar por horas y prefiere cerrar un precio fijo a todo proyectoweb.

En este caso, mi recomendacin es la siguiente:Despus de preguntarle al cliente y tener una idea de loque quiere, hazle una propuesta siguiendo las pautasque habrs obtenido despus de hacerle las preguntas.Le presentas la propuesta y que diga lo que no le gusta

y quiere cambiar (Apuntalo todo!). Hazle los cambios ymuestra el trabajo, en principio, finalizado y con el proyecto completo. A partirde ah, si quiere hacer las cambios, no tendrs ms remedio que cobrarle porhoras.

NOTA:

La declaracin de alcance se usa para definir lo queest dentro de las fronteras del proyecto y lo que est

afuera de estas fronteras. Es decir, que el alcance es ladefinicin de los puntos que entran y no entran en elproyecto y que es acordado por todas las partes,refirindose a todos los requerimientos a satisfacer enel proyecto.

Las reas que pueden ser examinadas a la hora de identificar el alcance son:datos, procesos, aplicaciones y reas de negocio.

Identificar la estructura bsica de una aplicacin web.Aunque existen muchas variaciones posibles, una aplicacin web estanormalmente estructurada como una aplicacin de tres-capas. Es su formams comn, el navegador web ofrece la primera capa y un motor capaz de usaralguna tecnologa web dinmica (por ejemplo PHP, JavaServlets o ASP, ASP.NET, CGI, ColdFusion, embPerl, Python [Programming language] o Ruby onRails) constituye la capa intermedia. Por ltimo una base de datos constituye latercera y ltima capa.



18/245


El navegador web manda peticiones a la capa media que ofrece serviciosvalindose de consultas y actualizaciones a la base de datos y a su vezproporciona una interfaz de usuario.

Hay algunos que consideran una aplicacin web como una arquitectura de dosniveles. Esto puede ser un "inteligente" cliente que realiza todo el trabajo y lasconsultas de un "tonto" server, o un "tonto" cliente que se basa en un"inteligente" del servidor.

El cliente se ocupara de la capa de presentacin, el servidor tienen la base dedatos (capa de almacenamiento), y la lgica de negocio (nivel de aplicacin)sera en uno de ellos o en ambos. Aunque esto aumenta la escalabilidad de lasaplicaciones y separa la pantalla y la base de datos, aun as no se permitir laverdadera especializacin de las capas, por lo que la mayora de las

aplicaciones superan este modelo.

Arquitectura de las aplicaciones Web.

La arquitectura tradicional de cliente/servidortambin es conocida como arquitectura de doscapas. Requiere una interfaz de usuario que seinstala y se ejecuta en una PC o estacin detrabajo y enva solicitudes a un servidor para

ejecutar operaciones complejas.

Por ejemplo, una estacin de trabajo utilizada como cliente puede ejecutar unaaplicacin de interfaz de usuario que interroga a un servidor central de basesde datos.

Ventajas del Sistema de Dos Capas:

El desarrollo de aplicaciones en un ambiente de dos capas funcionaadecuadamente, pero no es necesariamente lo ms eficiente. Las

herramientas para el desarrollo con dos capas son robustas y ampliamenteevaluadas.

Las tcnicas de ingeniera de software de prototipo se emplean fcilmente.Las soluciones de dos capas trabajan bien en ambientes no dinmicosestables, pero no se ejecutan bien en organizaciones rpidamentecambiantes.

Desventajas del sistema de dos capas:

Los ambientes de dos capas requieren control excesivo de las versiones ydemandan esfuerzo de distribucin de la aplicacin cuando se les hacen



19/245


cambios. Esto se debe al hecho de que la mayora de la aplicacin lgicaexiste en la estacin de trabajo del cliente.

La seguridad del sistema en un diseo de dos capas es compleja y amenudo requiere administracin de las bases de datos; esto es debido alnmero de dispositivos con acceso directo al ambiente de esas bases dedatos.

Las herramientas del cliente y de la base de datos, utilizadas en diseos dedos capas, constantemente estn cambiando. La dependencia a largo plazode cualquier herramienta, puede complicar el escalamiento futuro o lasimplementaciones.

Arquitectura de t res capas.

La arquitectura de tres capas es un diseo reciente que introduce una capa

intermedia en el proceso. Cada capa es un proceso separado y bien definidocorriendo en plataformas separadas. En la arquitectura tradicional de trescapas se instala una interfaz de usuario en la computadora del usuario final (elcliente). La arquitectura basada en Web transforma la interfaz de bsquedaexistente (el explorador de Web), en la interfaz del usuario final.

La arquitectura de las aplicaciones Web suelen presentar un esquema de tresniveles.

El primer nivel consiste en la capa de presentacin que incluye no slo elnavegador, sino tambin el servidor web que es el responsable de presentarlos datos un formato adecuado.

El segundo nivel est referido habitualmente a algn tipo de programa o script.Finalmente, el tercer nivel proporciona al segundo los datos necesarios para suejecucin. Una aplicacin Web tpica recoger datos del usuario (primer nivel),los enviar al servidor, que ejecutar un programa (segundo y tercer nivel) ycuyo resultado ser formateado y presentado al usuario en el navegador(primer nivel otra vez).

Las diferentes capas suelen ser:

Capa 1: Cliente de aplicacin: Navegador Web. Capa 2: Servidor de Aplicaciones: Apache,

Servidor Tomcat con servlets. Capa 3: Servidor de Datos: Base de datos,

servidor SMTP.



20/245


Ventajas de la arquitectura de tres capas:

Las llamas de la interfaz del usuario en la estacin de trabajo, al servidor decapa intermedia, son ms flexibles que en el diseo de dos capas, ya que laestacin solo necesita transferir parmetros a la capa intermedia.

Con la arquitectura de tres capas, la interfaz del cliente no es requerida paracomprender o comunicarse con el receptor de los datos. Por lo tanto, esaestructura de los datos puede ser modificada sin cambiar la interfaz delusuario en la PC.

El cdigo de la capa intermedia puede ser reutilizado por mltiplesaplicaciones si est diseado en formato modular. La separacin de roles entres capas, hace ms fcil reemplazar o modificar una capa sin afectar a losmdulos restantes.

Desventajas de las Arquitecturas de Tres Capas y basadas en Web. Los ambientes de tres capas pueden incrementar el trfico en la red y

requiere ms balance de carga u tolerancia a las fallas.Los exploradores actuales no son todos iguales.La estandarizacin entre diferentes proveedores ha sido lenta en

desarrollarse. Muchas organizaciones son forzadas a escoger uno en lugarde otro, mientras que cada uno ofrece sus propias y distintas ventajas.

Organizar el equipo de trabajo segn especialidades.Cmo organizar un equipo de trabajo:El lder de un equipo de trabajo debe dirigir al grupo humano siguiendo unaslneas comunicativas, participativas y dirigidas a la consecucin de metasalcanzables.

El equipo de programacin que forme debe ser especializado en el desarrollode sitios web personalizados utilizando diferentes lenguajes, como por ejemploJavascript, AJAX, jQuery, MySQL, HTML y CSS, as como la configuracin de

servidores web y desarrollo PHP. El equipo siempre debe de tratar de llegar anuevos retos. Debe de conocer las habilidades de cada uno y saber si soncapaces de llegar a soluciones creativas, y as poder encajar perfectamentecon el equipo.

Las cualidades de un buen programador.

Con los tiempos que corre, las salidas profesionalesen el mundo TIC evolucionan y se expanden. Una delas trayectorias ms populares actualmente es la deprogramador. Los informticos aprenden a programar



21/245


entre otras muchas cosas y pueden si quieren ganarse la vida con ello. Pero...puede todo el mundo ser programador? Qu cualidades ha de tener unopara ser un buen programador?

1. Capacidad para trabajar en equipo.

Trabajar en equipo significa ser capaz de trabajarde forma conjunta con otras personas para eldesarrollo eficaz de un proyecto. Laprogramacin, en particular, es un campo en elque la comunicacin con otras personas ha de ser fluida, abierta y efectiva sise quiere obtener un buen resultado.

Por supuesto, hay que distinguir entre la programacin pura qu solo

desarrollar un individuo, y el tipo de programacin que se puede desarrollarcon la ayuda de aplicaciones u otros programas como CASE.

El aspecto ms importante del trabajo en equipo es la divisin de las tareas deforma justa y acorde a las capacidades y competencias de cada miembro delequipo. Siempre es mejor identificar quin pudo dar la solucin a un problemaque culpar a algn miembro de algn error cometido.

2. Gestin de proyectos.

Sea cual sea la dificultad del proyecto, el lder deberhacerse cargo del proyecto y asignar el trabajo.

El gestor de proyectos supervisar la planificacin y elanlisis y se har cargo del diseo del sistema, suprogramacin y su implementacin. Un buen programador debe ser capaz dedesempear todos y cada uno de estos diversos roles.

3. Conocimiento de distintos lenguajes de programacin.

Los sistemas informticos de hoy en da se basanen una extensa serie de lenguajes de programacincuyo conocimiento y manejo es fundamental paralos programadores. Un buen programador necesitaentender cmo funciona internet y las redes LANS.

Aunque el lenguaje HTML no es tan importante ya como lo fue en su da an loes para el funcionamiento de todos los sistemas informticos. En la actualidad,el cdigo HTML se puede generar de forma automtica con herramientas o

aplicaciones especficas por lo que saber cmo poner en prctica todas estasposibilidades es vital.



22/245


4. Idiomas extranjeros.Todo programador ha de ser capaz de hablar algnidioma extranjero a nivel de trabajo, especialmenteel ingls. La lengua inglesa es el idioma msutilizado a nivel mundial y los programadores han deaprender a hablar ingls ya que ser muy probableque lo necesiten para trabajar en equiposinternacionales. Por otra parte, los sistemas y programas informticos sedesarrollan generalmente en ingls as que es fundamental que puedasdesenvolverte en este idioma. Otro idioma importante es, por supuesto, elespaol.

5. Competencia profesional.No hace falta decir que todo programador ha de ser

competente en una gran variedad de lenguajes deprogramacin, o al menos tener inters por aprender otroslenguajes adems de los que ya sabe. Por supuesto,depender de qu tipo de aplicaciones te interesa desarrollar.Formar un equipo de programadores competentes en diversasreas te asegurar el xito de cualquier proyecto.

Seleccionar la interfaz de desarrollo ms adecuada.

Los lenguajes de programacin que se utilizan en el desarrollo deun proyecto web son muy diversos, as como los distintosprogramas de diseo y maquetacion involucrados de desarrollo deun sistema web.

En el desarrollo web tenemos unas herramientas para el diseo, otras para lamaquetacin, otras para la programacin, y para la depuracin. Todas lasherramientas que usemos son muy importantes, desde el Sistema Operativohasta el comando ms insignificante, es por ello debemos elegir la ms

adecuada que se ajuste a nuestras necesidades para asi poder alcanzar losobjetivos.

Fases de desarrol lo de una web.

Para elegir las herramientas a utilizar, antes debemos identificar las fases delproceso que forman el ciclo de vida de un desarrollo web.

Diseo: El diseo consiste en crear esbozos de la web final mediante unaherramienta grfica, como Photoshop, GIMP o Inkscape.



23/245


Maquetacin HTML/CSS: La maquetacin consiste en convertir los esbozoscreados en la fase anterior en plantillas HTML, su respectiva hoja de estilos, ylas imgenes usadas. Es posible saltarse la fase anterior para comenzardirectamente con esta fase, dependiendo de si dominamos herramientas comoPhotoshop o no.

Programacin cliente: La programacin cliente consiste bsicamente enJavascript, incluyendo sus libreras como jQuery y Ajax. Una web puede notener necesidad de hacer programacin cliente, como puede ser una pequeaweb corporativa con poca informacin esttica, o puede que requiera enormesesfuerzos en esta fase, como ocurre con los proyectos Web 2.0.

Programacin servidor: En esta fase, que se desarrolla junto con la anterior,crearemos la aplicacin web en un lenguaje de servidor, como puede ser PHP,

ASP .NET, Python, Perl, etc.

Depuracin: Esta fase enlaza la anterior con la siguiente, y es donde haremoslas pruebas de nuestro cdigo para saber si los procesos re realizan de formacorrecta.

Pruebas en local: En nuestro servidor local haremos todas las pruebas antesde publicarlo en un hosting real.

Subir ficheros al hosting: Una vez nuestra web est completada y bientesteada en nuestro servidor local (desarrollo), la subiremos al servidor delhosting elegido (produccin). Dependiendo del hosting, podremos usar FTP,SFTP (SSH), etc.

Pruebas en hosting: Realizaremos las ltimas pruebas en el servidor delhosting para comprobar que el cambio de servidor no ha afectado a nada. Paraevitar problemas, nuestro servidor local debe tener exactamente la mismaconfiguracin que el servidor del hosting.Herramientas: desarrollo en PHPA continuacin enumerar las herramientas bsicas para el desarrollo de unaweb en PHP, en sus diferentes fases de diseo e implementacin.

Fases: diseo y maquetacin.Adobe Photoshop:Esta aplicacin slo est disponibleen Windows ya que pertenece a Microsoft, es el msusado y gracias a ello dispone de una gran comunidad deusuarios con los que se puede contar ante cualquierproblema. Con l crearemos el diseo, as como las

imgenes que usemos en la maquetacin.



24/245


GIMP: Es el equivalente de software libre ms prximo a Photoshop. Al serlibre es posible conseguirlo gratuitamente, y de hecho cualquier distribucinGNU/Linux lo incluye. Al igual que en Photoshop, con l podremos crear eldiseo y las imgenes de la maquetacin HTML. Tambindisponible en Windows.

Fase: maquetacin.Adobe Fireworks: El editor de grficos vectoriales msutilizado para el desarrollo web. Al igual que su compaeroPhotoshop se utilizado bajo plataforma Windows.

Inkscape:Es un excelente editor grfico vectorial con el que podercrear iconos, banners, y dems dibujos de forma muy fcil ysencilla, incluso para aquellos que no tengan conocimientos

avanzados en edicin grfica digital.

Fases: maquetacin, programacin cl iente.Dreamweaver: Es uno de los principales editores web del mercado, se haconvertido quizs en uno de los editores ms cmodos para trabajar con CSS,y por ello quizs tambin sea el ms usado por los diseadores web.

Fase: programacin servidor.Zend Studio:Sin duda el mejor IDE existente en el

mercado para desarrollo web con PHP. Es un editorde texto para pginas PHP que proporciona un buennmero de ayudas desde la creacin y gestin deproyectos hasta la depuracin del cdigo.

Otra aplicacin muy til que est muy ligada a ZendStudio es Zend Platform, un mdulo para Apache que permite depurar una webdirectamente en el navegador (Internet Explorer o Firefox), adems de otrasfunciones ms complejas, como alertas configurables para que nos enve unemail por cada error ocurrido en la web, o cuando un script sobrepase untiempo determinado de ejecucin, por ejemplo.

Fase: prueba local.Apache:Instalar un servidor web Apache en la mquina dondedesarrollamos es fundamental. De esta manera haremospruebas rpidamente: editamos un fichero PHP, vamos alnavegador, actualizamos, y vemos los cambios.

Fases: pruebas en local, depuracin.

En esta fase las pruebas la haremos con nuestro navegador de internet localdonde se podr visualizar el resultado de los procesos codificados.



25/245


Subir ficheros al servidor del hosting.

Una vez hayamos concluido todas las fasesanteriores, y nuestro proyecto est listo,podemos subirlo al servidor del hosting con unprograma FTP.

1. Cules son los planteamientos iniciales antes de comenzar a desarrollaruna pgina web?

2. Cul es la estructura de una pgina web? Explique cada una.3. Describa las cualidades que debe tener cada miembro de un equipo de

desarrollo web.4. Explique las diferencias ms importantes entre la programacin en local y

en servidor.

Ejercicios y tareas de investigacin



26/245


TAREA 02: IMPLEMENTAR PHP COMO LENGUAJE DEDESARROLLO DE UNA APLICACIN WEB.

En esta tarea trataremos los siguientes Operaciones:

Instalar el servidor PHP y base de datos.Trabajar con la sintaxis bsica de PHP. Implementar estructuras condicionales.Desarrollar estructuras repetitivas.Utilizar y elaborar funciones en PHP.

.



ORDEN DE EJECUCIN:

Instalar el servidor PHP y base de datos. Trabajar con la sintaxis bsica de PHP. Implementar estructuras condicionales. Desarrollar estructuras repetitivas. Utilizar y elaborar funciones en PHP.

OPERACIONES:

2.1. OPERACIN: INSTALAR EL SERVIDORPHP Y BASE DE DATOS.

INSTALACIN.

Para desarrollar la instalacin de WampServer

debemos de bajar la versin con la cual vamos atrabajar.

Da tu primer paso ahora. No es necesario que veas el caminocompleto, pero da tu primer paso. El resto ir apareciendo amedida que camines.Martin Luther, Jr.



27/245


Una vez descargado el programa procederemos a la instalacin de la mismaejecutando el archivo WampServer2.exe que descargaron el cual nos permitirrealizar la instalacin del programa.

Le damos clic en siguiente.

A continuacin se mostrar la carpeta donde seinstalara el programa y en cual podremos acceder acada uno de los recursos instalados por el mismo.

Luego nos da la opcin de crear un acceso directo enel escritorio, para ejecutar el WampServer cuandoqueramos utilizarlo.

Por ltimo se realizar la instalacin del

WampServer el cual extraer los archivosnecesarios y los instalar, el proceso deinstalacin demorara de acuerdo a la capacidaddel ordenador, pero de modo general sedesarrolla de forma rpida.

En la siguiente ventana vemos que nos solicita laruta del explorador por defecto.



28/245


En la siguiente ventana nos pide los parmetros de nuestro correo.

Si es local puede dejar los valores por defecto.

En la parte final de la instalacin veremos la siguienteventana que nos informa que la instalacin se ha

completado, adems de ofrecernos la opcin de que seejecute WampServer al finalizar la instalacin.

NOTA:

En algunos casos para que funcione el servidorWampserver tiene que agregar el nmero 80 en elarchivo httpd.conf tal como lo muestra la siguienteimagen:

Busca la lnea Listen y digita el numero 80 alcostado del que ya est escrito, luego guarde yreinicie los servicios.

PROBAR FUNCIONAMIENTO DEL WAMPSERVER.

Abra su navegador de internet ydigite en la barra de direcciones.

Localhost:8080 y presione la teclaENTER.



29/245


VERIFICAR EL PHPMYADMIN.En la ventana anterior dele clic en el vnculo de la seccin Tools que dicephpmyadmin,tal como lo indica la imagen anterior.

2.2. TRABAJAR CON LA SINTAXIS BSICA DE PHP.El cdigo PHP est incrustado entre medio del cdigo HTML. Por tantodebemos indicar de alguna forma que dejamos de escribir en cdigo HTML yempezamos a escribir en cdigo PHP. Tambin debemos indicar dnde acabael cdigo PHP y volvemos a escribir en cdigo HTML.

Esto se hace indicndolo mediante unas etiquetas especiales que indicandnde empieza y acaba el cdigo PHP.

La etiqueta indica que acaba el cdigo PHP.

Escribir en la pgina con PHP

La instruccin echoes una de las ms utilizadas en PHP, ya que nos permitevisualizar en pantalla lo que escribamos detrs de esta palabra clave. Si lo quequeremos visualizar es un texto, debemos escribirlo entre comillas de lasiguiente manera:

Lo escrito dentro de la instruccin echo entre comillas, es interpretado por elnavegador como cdigo HTML, por lo que podemos poner etiquetas HTMLdentro del texto entre comillas para integrar mejor este texto en la pgina:

http://localhost:8080/phpmyadmin/http://localhost:8080/phpmyadmin/http://localhost:8080/phpmyadmin/


30/245


La instruccin print es en todo igual a la instruccin echo pudiendo usar una uotra indistintamente para obtener el mismo resultado:

Esta instruccin o sentencia funciona igual que la anterior, y tiene el mismoefecto en la pgina.

Trabajar PHP con Dreamweaver y probarlo en nuestro servidor local.

Pasos para crear un archivo php yejecutarlo en el servidor local:

1. Abra el programa Dreamweaver y creeuna nueva pgina PHP.

2. Digite el siguiente cdigo y guarde el archivo con el nombre proceso1.php

3. Gurdelo dentro de la carpeta www que se gener al momento de instalar suservidor Wampserver.

4. Verifique que su archivo ya tenga un nombre asignado y este guardado en lacarpeta www.



31/245


5. Abra su navegador de internet y en la barra de direcciones digite losiguiente:

http://localhost:8080/proceso1.php

El resultado debe ser una pgina como lasiguiente:

NOTAS:

Es preferible crear carpetas dentro de la raz www para organizar nuestros cdigos.Al ejecutar el Wampserver reconocer las carpetas que se encuentran dentro de suraz principal, las cuales al ejecutarlas buscaran automticamente el archivo connombre index.php el cual siempre ser el primero en ejecutarse tal como tambinpasa en un servidor real en internet.

Trabajar con carpetas dentro del servidor local.

1. Crear una carpeta con el nombre CAPITULO 2, elaborar un archivo php conel nombre proceso2_1.php el cual tendr el siguiente cdigo:

2. Guardar el archivo en la carpeta creada en elpaso anterior y ejecutar el servidorWampserver.

3. Verifique que la carpeta se puede visualizar en la pantalla principal delWampserver.

http://localhost:8080/proceso1.phphttp://localhost:8080/proceso1.php


32/245


4. Dele clic a la carpeta indicada en el paso anteriory podr ver el listado de archivos que la

contienen.

Al darle clic al archivo se ejecutara en nuestro servidor.

NOTA:Si el archivo tuviera el nombre index.phpse ejecutara automticamente al darle clic

al nombre de la carpeta.Dentro de la carpeta pueden existir varios archivos pero siempre se ejecutara pordefecto el archivo con nombre index.php.

Ingresar script PHP dentro de una pgina con contenido HTML.

1. Cree la siguiente pgina php dentro de la carpeta Capitulo 2.

2. Actualice el listado de archivos de la carpeta con F5 y ejecute el archivo queacabamos de crear. Vera un resultado como el siguiente:

Separar instrucciones.

Como hemos visto en los ejemplos anteriores, cuando finaliza la instruccin o

la funcin aadimos un punto y coma al final de la lnea para separar lasinstrucciones y que el servidor pueda ejecutar todo correctamente.



33/245


Comentarios.

Si queremos explicar una funcin, marcar un error o avisar de tu ltimaactualizacin podemos usar comentarios. Tenemos varias formas de comentar,ya sea en una lnea o en varias.

Crea un nuevo archivo php con el nombre comentario1.php y gurdalo en lacarpeta Capitulo 2.

Verifica que los archivos que se van creando se organizan en fichas dentro delprograma Dreamweaver.

NOTA:Crea un nuevo SITIO local que este asignado a la carpeta Capitulo 2 para quelos archivos estn organizados.

En la ventana anterior se pueden visualizar todos los archivos y carpetas quecontiene el sitio Capitulo 2.

2.3. IMPLEMENTAR ESTRUCTURAS CONDICIONALES.

Quiz la estructura de control ms bsica y la ms utilizada sea if-else:

if (condicion) {// Instrucciones que hay que ejecutar si la condicin es verdadera} else {// Instrucciones que hay que ejecutar si la condicin es falsa}

En castellano sera algo as:Si (Tal cosa es cierta) {



34/245


// Haz esto} En caso contrario {// Haz esto otro}

Ejercicio 1:

En un formulario preguntaremos al usuario como se llama, pasaremos lasvariables a la pgina saludos.php. En saludos.php mostraremos un saludodiferente en funcin del usuario ingresado.

Formulario Ejemplo If 1

Quin eres?

saludos.php

Ejemplo de If Pgina de bienvenida



35/245


NOTA:

El operador ==, es muy importante.Si utilizas slo =, estars utilizando el operador de asignacin, es decir estableciendoque $nombre es igual a senati con lo que la condicin siempre sera cierta.

Del ejercicio anterior supongamos que queremos dejar pasar slo al usuariosenati y que ingrese la contrasea, por ejemplo la clave 123.

Formulario: Ejemplo If 3

Quin eres?

Y tu Contrasea?

saludos.php

Ejemplo If 2 Pgina de bienvenida


36/245


Adems existe la instruccin elseif, que como su nombre indica, es unacombinacin de if y else. Aade una nueva condicin en el caso de que laprimera fuera falsa y slo ejecuta las instrucciones si esta nueva condicin esverdadera. Es decir,

Veamos un ejemplo:

if ($a > $b) {// Ejecuta esto si a es Mayor que becho("a es mayor que b");

} elseif ($a == $b) {// si a no es mayor que be, comprueba si a es igual a becho("a es igual que b");} else {// si no se cumplen las anteriores condiciones ejecuta staecho ("a es menor que b");}

Ejercicio 2:En este simple ejemplo la condicin if es verdadera por lo que se ejecutara elcdigo y se mostrara el mensaje X es mejor que Y

Ejercicio 3:

Mostrar un mensaje distinto dependiendo de la edad ingresada para cadapersona.La variable que cambiara de valor ser $edad.



37/245


En este caso la respuesta sera: S, 33 es mayor que 30.Si el valor de $edad se cambia a 22, la respuesta sera: No, 22 es menor que40, 35 y 30.

NOTA:

Por otro lado est muy relacionada con el else, que sirve para continuar con el procesosi no se cumple la condicin.

2.4. DESARROLLAR ESTRUCTURAS REPETITIVAS.

Bucle: While

If else nos permita decidir si queramos ejecutar o no una instruccin enfuncin de una condicin, los bucles nos permiten utilizar una condicin paradeterminar cuntas veces queremos ejecutar una instruccin.While (condicin) {// Instrucciones a ejecutar una y otra//vez mientras la condicin sea cierta}

El funcionamiento es muy parecido al del if-else, la diferencia estriba en que sila condicin es cierta y se ejecuta la orden, la condicin vuelve a comprobarseuna y otra vez mientras siga siendo cierta. En cambio en el cambio del if-elseslo se comprueba la condicin una vez, si es cierta se ejecuta la instruccin y

se sigue con el programa.

Ejercicio 1:$cantidad = 1;while ($cantidad < 10) {echo ("$cantidad ");$cantidad++;}Esto traducido al castellano sera:

$cantidad = 1; $cantidad es igual a unowhile ($cantidad < 10) Mientras el valor de la variable $cantidad sea menor que 10



38/245


echo ($cantidad ); Escribe el valor de cantidad$cantidad++ (suma 1 al valor que tenga $cantidad, tambin podramos haber escrito$cantidad = $cantidad +1)

Veamos cmo funciona el script paso a paso,

$Cantidad es igual a 11 es menor que 10Escribo 1 en pantalla$cantidad = 2 (1+1)2 es menor que 10Escribo 2 en pantalla$cantidad = 3 (2+1)

Si ejecutamos este script, en pantalla veramos 1 2 3 4 5 6 7 8 9

Ejercicio 2:El siguiente ejemplo es un simple programa en PHP con el que imprimimos laserie de nmeros del 1 al 10 en pantalla:

Bucle: Do While

La sentencia Do-While es la misma que la sentencia while, la nica diferenciaes que se evala la expresin al final.

Ejercicio 1:



39/245


En el ejemplo anterior el valor de $c se muestra slo si es mayor que 5, perocon la sentencia Do-while muestra el valor de $c como uno primero y luegocomprueba la expresin o condicin.

Ejercicio 2:

Utilice la sentencia "Break" para suspender la ejecucin del cdigo en un bucle.

Ejercicio 3:

$n=0;$i=1;do {

echo "$i: Esta frase se repetir $n veces";i++;

}while ($i


40/245


Ejercicio 1:for ($cantidad = 1; $cantidad

Bucle: Swich/case

Nos permite ejecutar un bloque de cdigo u otro dependiendo del valor de unavariable.

Ejercicio para mostrar un mensaje dependiendo de la edad seleccionada de lapersona en un formulario.

Formulario:Dime tu edad:

Menos de 14 aos.

de 15 a 20 aos

de 21 a 40 aos

de 41 a 60 aos

ms de 60 aos.

El cdigo PHP con la estructura switch a aplicar es el siguiente:


41/245


echo "entre 15 y 20 aos: todava eres muy joven";break;

case "joven":echo "de 21 a 40 aos: eres una persona joven";break;

case "maduro":echo "entre 41 y 60 aos: eres una persona madura";break;

case "mayor":echo "ms de 60 aos: Ya eres una persona mayor";break;

default:echo "an no me has dicho tu edad";

}?>

NOTA:

Existe un tipo de bucle especial para matrices llamado for each.

2.5. UTILIZAR Y ELABORAR FUNCIONES EN PHP.

Ejercicio 1:Crear una funcin para sumar dos nmeros.

Escribimos primero un formulario en el que pedimos al usuario que nos d dosnmeros:

Escribe dos nmeros:

Primer nmero: ...Segundo nmero:

Despus en cdigo php escribimos primero la funcin que suma los dosnmeros, despus pasamos los dos nmeros a la funcin y mostramos elresultado en pantalla.

function suma($a,$b) {$c=$a+$b;return $c;}

$n1=$_POST['n1'];$n2=$_POST['n2'];

$n3=suma($n1,$n2);echo "Sumar: $n1 + $n2 =$n3"



42/245


Ejercicio 2:Crearemos una funcin con variables.

En el ejemplo anterior se puede ver la variable que hemos declarado dentro dela funcin, de manera que la variable que declaramos fuera de ella es ignorada.El resultado ser lo siguiente:

HolaEjercicio 3:Elaborar las siguientes funciones:

Como se puede ver en el ejemplo anterior, creamos dos funciones,calcular_Cuadrado y calcular_Cubo, y luego las mostramos, podemos tantoguardarla en una variable, o simplemente mostrarla a travs de un echo.

Ejercicio 4:Vamos a ver un ejemplo de creacin de funciones en PHP. Se trata de haceruna funcin que recibe un texto y lo escribe en la pgina con cada carcterseparado por "-". Es decir, si recibe "hola" debe escribir "h-o-l-a" en la pginaweb.

La manera de realizar esta funcin ser recorrer el string, caracter a caracter,



43/245


para imprimir cada uno de los caracteres, seguido de el signo "-".Recorreremos el string con un bucle for, desde el carater 0 hasta el nmero decaracteres total de la cadena.

El nmero de caracteres de una cadena se obtiene con la funcin predefinidaen PHP strlen(), que recibe el string entre parntesis y devuelve el nmero delos caracteres que tenga.

funcion 4

La funcin que hemos creado se llama escribe_separa y recibe comoparmetro la cadena que hay que escribir con el separador "-". El bucle for nossirve para recorrer la cadena, desde el primer al ltimo carcter. Luego, dentrodel bucle, se imprime cada carcter separado del signo "-". El if que hay dentrodel bucle for comprueba que el actual no sea el ltimo carcter, porque en ese

caso no habra que escribir el signo "-" (queremos conseguir "h-o-l-a" y si noestuviera el if obtendramos "h-o-l-a-").

Resultado de cmo se vera:

h-o-l-aT-e-x-t-o- -m--s- -l-a-r-g-o-,- -a- -v-e-r- -l-o- -q-u-e- -h-a-c-e



44/245


FUNDAMENTO TERICO:

Instalar el servidor PHP y base de datos.

En informtica, un servidor es un tipo de software que realiza ciertas tareas en

nombre de los usuarios. El trmino servidor ahora tambin se utiliza parareferirse al ordenador fsico en el cual funciona ese software, una mquinacuyo propsito es proveer datos de modo que otras mquinas puedan utilizaresos datos.

Este uso dual puede llevar aconfusin. Por ejemplo, en elcaso de un servidor web, estetrmino podra referirse a la

mquina que almacena y manejalos sitios web, y en este sentidoes utilizada por las compaasque ofrecen hosting o hospedaje.Alternativamente, el servidor webpodra referirse al software, como el servidor de http de Apache, que funcionaen la mquina y maneja la entrega de los componentes de las pginas webcomo respuesta a peticiones de los navegadores de los clientes.Los archivos para cada sitio de Internet se almacenan y se ejecutan en elservidor. Hay muchos servidores en Internet y muchos tipos de servidores, pero

comparten la funcin comn de proporcionar el acceso a los archivos yservicios.

Un servidor sirve informacin a los ordenadores que se conecten a l. Cuandolos usuarios se conectan a un servidor pueden acceder a programas, archivosy otra informacin del servidor.

En la web, un servidor web es un ordenador que usa el protocolo http paraenviar pginas web al ordenador de un usuario cuando el usuario las solicita.

Los servidores web, servidores de correo y servidores de bases de datos son alo que tiene acceso la mayora de la gente al usar Internet.

Algunos servidores manejan solamente correo o solamente archivos, mientrasque otros hacen ms de un trabajo, ya que un mismo ordenador puede tenerdiferentes programas de servidor funcionando al mismo tiempo.

Los servidores se conectan a la red mediante una interfaz que puede ser una

red verdadera o mediante conexin va lnea telefnica o digital.



45/245


El rol fundamental de un Servidor Web.

La principal funcin de un servidor Web es almacenar los archivos de un sitio yemitirlos por Internet para poder ser visitado por los usuarios. Bsicamente, unservidor Web es una gran computadora que guarda y transmite datos va

Internet. Cuando un usuario entra en una pgina de Internet su navegador secomunica con el servidor enviando y recibiendo datos que determinan qu eslo que ve en la pantalla. Por eso decimos que los servidores Web estn paraalmacenar y transmitir datos de un sitio segn lo que pida el navegador de unvisitante.

Cmo funcionan los servidores.

Cada servidor Web y cada computadora conectada a Internet tienen asignadouna direccin de IP irrepetible que lo identifica en la red incluyendo la PC que

tens en tu casa. La direccin de IP vendra a ser como los datos del remitenteen una carta postal. Cuando llegas a un sitio Web, se enva un pedido desde tudireccin de IP hacia la direccin IP del servidor. El servidor Web respondemandando datos a la direccin IP que los pide. Esto es lo que pasa cada vezque estamos navegando un sitio en Internet.

Ms del 90% de los sitios en Internet utilizan un servidor alquilado a travs deuna empresa de Web hosting.

La capacidad de un servidor depende del tipo de servidor que sea y de loscomponentes que lo conforman.

Trabajar con la sintaxis bsica de PHP.

El PHP (acronimo de PHP: HypertextPreprocessor), es un lenguaje interpretado de altonivel embebido en pginas HTML y ejecutado enel servidor. El PHP inicio como una modificacin a

Perl escrita por Rasmus Lerdorf a finales de 1994.Su primer uso fue el de mantener un control sobre



46/245


quien visitaba su curriculum en su web.

En los siguientes tres aos, se fueconvirtiendo en lo que se conoce

como PHP/FI 2.0. Esta forma deprogramar llego a muchosusuarios, pero el lenguaje no tomoel peso actual hasta que ZeevSurasky y Andi Gutmans leincluyeron nuevas caractersticasen 1997, que dio por resultado elPHP 3.0. La versin 5 es la ms reciente y est previsto el lanzamiento de larama 6.

Con PHP se puede hacer cualquier cosa que podemos realizar con un scriptCGI, como el procesamiento de informacin en formularios, foros de discusin,manipulacin de cookies y pginas dinmicas.

Un sitio con pginas dinmicas es el que permite interactuar con el visitante, demodo que cada usuario que visita la pgina vea la informacin modificada pararequisitos articulares. Las aplicaciones dinmicas para el Web son frecuentesen los sitios comerciales (e-commerce), donde el contenido visualizado segenera de la informacin alcanzada en una base de datos u otra fuente

externa.

Soporte para bases de datos :

Una de sus caractersticas ms potentes es su suportepara gran cantidad de bases de datos. Entre su soportepueden mencionarse InterBase, mSQL, MySQL,Oracle, Informix, PosgreSQL, entre otras. PHP tambinofrece la integracin con las varias bibliotecas externas,que permiten que el desarrollador haga casi cualquiercosa desde generar documentos en pdf hasta analizar cdigo XML.Su sintaxis es muy similar a la del ASP, pues el cdigo PHP va incrustadodentro del cdigo HTML.

Un ejemplo prctico de una instruccin func ional de PHP sera:

Que al ser ejecutado en el servidor nos imprimira dentro del cdigo HTML la

frase:Hola SENATINOS, buenos das.



47/245


Otro ejemplo de pgina Php es el siguiente:

PHP ofrece una solucin simple y universal para laspaginaciones dinmicas del Web de fcilprogramacin. Su diseo elegante lo haceperceptiblemente ms fcil de mantener y ponerseal da que el cdigo comparables en otros lenguajes. Debido a su ampliadistribucin PHP est perfectamente soportado por una gran comunidad dedesarrolladores.

Cdigo abierto:Como producto de cdigo abierto, PHP goza de la ayuda deun gran grupo de programadores, permitiendo que los fallosde funcionamiento se encuentren y se reparan rpidamente.El cdigo se pone al da continuamente con mejoras yextensiones de lenguaje para ampliar las capacidades de

PHP. Es utilizado en aplicaciones Web-relacionadas poralgunas de las organizaciones ms prominentes tales como Mitsubishi, Redhat,Der Spiegel, MP3-Lycos, Ericsson y NASA.

PHP es la opcin natural para los programadores en mquinas con Linux queejecutan servidores web con Apache, pero funciona igualmente bien encualquier otra plataforma de UNIX o de Windows, con el software de Netscapeo del web server de Microsoft. PHP tambin utiliza las sesiones de HTTP,conectividad de Java, expresiones regulares, LDAP, SNMP, IMAP, protocolos

de COM (bajo Windows).

Para trabajar con capacidadesPHP, se puede conseguir mayorinformacin en PHP.net, sitioencargado de mantener al da atodos los desarrolladores con lasltimas descargas relacionadascon el lenguaje y documentacin.



48/245


Qu signi fica sin taxis PHP?

Sintaxis se refiere a las formas y estructura que debe de tener un lenguaje parasu interpretacin. Formado por un conjunto de reglas bsicas que debemos detener en cuenta a la hora de escribir. Un ejemplo podemos verlo a la hora de

comunicarnos con otra persona, debemos de tener una base que nos hagaexplicarnos de una forma concreta y as conseguir que el receptor nosentienda.

Mostrar texto por pantalla.

Para mostrar texto por pantalla usaremos la funcin echo o print. Si hasprogramado en C por ejemplo, seguramente te suenen estas funciones. Conella podremos imprimir variables, datos de formularios, informacin de basesde datos, en general todo lo que ver el usuario.

Separar instrucciones.

Como vemos en el ejemplo anterior, cuando finaliza la instruccin o la funcinaadimos un punto y coma al final de la lnea para separar las instrucciones yque el servidor pueda ejecutar todo correctamente. Es obligatorio su uso

Comentarios.

Si queremos explicar una funcin, marcar un error o avisar de tu ltimaactualizacin podemos usar comentarios. Tenemos varias formas de comentar,ya sea en una lnea o en varias.

NOTAS:

a. Proceso.

Las paginas PHP son interpretadas por parte del servidor y como resultado se

devuelve al cliente codigo HTML que es lo unico que sabe interpretar elnavegador, es decir las paginas PHP dependen del servidor y no del navegador



49/245


dado que este solo recive codigo HTML.

Cliente Servidor Servidor Servidor Cliente

Solicita una

Pgina PHP

Recibe la

peticin

Procesa la

Pagina PHP

Devuelve al

Cliente HTML

Visualiza la Pagina

el en Browser

b. Observaciones.

Las etiquetas que indican la presencia del cdigo Php son "", sinembargo es posible configurar Php para que reconozca incluso "" queson ms simples de escribir.

Las instrucciones en el cdigo Php tiene que estar entre las etiquetas "/*" y "*/".Otro tipo de comentario se da poniendo la etiqueta "#" al comienzo de una

lnea. La lnea entera no se pondr en marcha.

Las instrucciones Php para devolver el cdigo Html son:PRINT("");echo("");

La instruccin para la concatenacin de cadenas es el punto (.).Por ejemplo, la instruccinecho("Hola"." "."Alberto")produce la cadena

"Hola Alberto"

Cada instruccin pura en Php tiene que acabar con el punto y coma (;)

Para que se puedan ejecutar los archivos stos tienen que ser extensin ".php"(a no ser que el servidor de la red est configurado de forma diferente).Cada archivo de nuestro sitio, que incluye instrucciones Php, tiene que teneresta extensin.

Implementar estructuras condicionales.

Operadores condicionales en PHP

Los operadores condicionales nos permiten trabajar en la condicin de algunaestructura del PHP. Se pueden incluir por ejemplo, en la estructura if-else o losbucles para especificar como se debe cumplir dicha condicin.



50/245


Operador Funcin

== Comprueba si dos cadenas son indnticas

!= Comprueba si dos cadenas son diferentes

< Comprueba si el valor de la izquierda es menor que el de la derecha

> Comprueba si el valor de la izquierda es mayor que el de la derecha

=Comprueba si el valor de la izquierda es mayor o igual que el de laderecha

Estos operadores son fciles de utilizar, pues sus funciones son de matemticasimple. El operador == indica que dos variables son identicas, el != indica queson completamente contrarios. Por otro lado, el < indica menor que, mayor que y >= mayor o igual que. Veremos tan solo un ejemplode este tipo para ver su funcionamiento.

Ejemplo PHP:

Resultado PHP:

Correcto

Operadores ms ut ilizados en PHP.

Operadores aritmticos.+ Suma dos valores- Resta dos valores (o pasa a negativo un valor)

* Multiplica dos valores/ Divide dos valores



51/245


% Resto de dividir dos valores++ Incremento en una unidad Decremento en una unidad

Operadores de asignacin.= Asigna a la parte derecha el valor izquierdo+= Realiza la suma de la derecha con la izquierda y la asigna a la derecha-= Realiza la resta de la derecha con la izquierda y la asigna a la derecha*= Realiza la multiplicacin de la derecha con la izquierda y la asigna a laderecha/= Realiza la divisin de la derecha con la izquierda y la asigna a la derecha%= Se obtiene el resto y se asigna.= Concatena el valor de la izquierda con la derecha y lo asigna a la derecha

Operadores lgicos.! Operador NO o negacin. Si era true pasa a false y viceversaand Operador Y, si ambos son verdaderos vale verdaderoor Operador O, vale verdadero si alguno de los dos es verdaderoxor Verdadero si alguno de los dos es true pero nunca ambos&& True si ambos lo son|| True si alguno lo es

Operadores condicionales.

== Comprueba si dos nmeros son iguales!= Comprueba si dos nmeros son distintos> Mayor que, devuelve true en caso afirmativo< Menor que, devuelve true en caso afirmativo>= Mayor o igual


52/245


Esta vez se hizo una combinacin de operadores, se utiliz el operador andque significa y, es decir, si $una_variable es menor o igual a 10 y$otra_variable es menor o igual a 25 entonces muestra un mensaje de que lacondicin se cumple, de lo contrario si el if hubiera sido distinto mostraba otromensaje.

Existen tres tipos bsicos, las simples, las dobles y las mltiples.

Simples:Las estructuras condicionales simples se les conocen como Tomas dedecisin. Estas tomas de decisin tienen la siguiente forma:

Dobles:Las estructuras condicionales dobles permiten elegir entre dos opciones oalternativas posibles en funcin del cumplimiento o no de una determinadacondicin. Se representa de la siguiente forma:

Donde:

Si: Indica el comando de comparacin.



53/245


Condicin: Indica la condicin a evaluar.Entonces: Precede a las acciones a realizar cuando se cumple la condicin.Instruccin(es): Son las acciones a realizar cuando se cumple o no lacondicin.Si no: Precede a las acciones a realizar cuando no se cumple la condicin.Dependiendo de si la comparacin es cierta o falsa, se pueden realizar una oms acciones.

Mltiples:

Las estructuras de comparacin mltiples,son tomas de decisin especializada quepermiten comparar una variable contradistinta posibles resultados, ejecutando paracada caso una serie de instruccionesespecficas. La forma comn es la siguiente:

Desarrollar estructuras repetitivas.

Son estructuras basadas en reiterar una o un grupo de instrucciones "n" vecesy dependen de una variable de control del ciclo.

PHP propone varios tipos de estructuras repetitivas o ciclos, cada uno con

caractersticas especficas distintas.

Estructura while.

Esta instruccin ejecuta un bloque de programa mientras se cumpla una ciertacondicin.

Si la condicin es verdadera, ingresa en el ciclo del while, y ejecuta la porcinde programa incluida.

Cuando deja de cumplirse la condicin, sale del ciclo y contina ejecutndoseel resto del programa.

Si por el contrario, la condicin no se cumple de entrada, las lneas en elinterior del while no se ejecutarn ni una vez.

El formato es el siguiente:

while (Condicin){

Instruccin_1;:



54/245


Instruccin_N;}

Ejemplo Prctico:Imprimir los mltiplos de 5 comenzando en el valor 100 y terminando en el valor500.

Multiplos de 5 Mltiplos de 4 de 100 a 500

Resultado:

Estructura do..while

Es un ciclo repetitivo en el cual la condicin se evala al final del mismo. Suformato es el siguiente:do{

instruccin_1;instruccin_2;:

instruccin_n;}while (condicin);

En este caso se observa que las instrucciones dentro del ciclo se procesan almenos una vez, ya sea que la condicin sea falsa o verdadera. Por lo tanto, eneste ciclo, las instrucciones se procesarn de uno a n veces.

Ejemplo Prctico:Mostrar en pantalla todos los nmeros divisibles por 7 entre 100 y 500.



55/245


Estructura forEs uno de los ciclos ms prctico para determinadas situaciones. Se utilizageneralmente cuando se tiene bien especificada la cantidad de repeticiones arealizar. Se diferencia de los anteriores, en que se debe incluir en l, unavariable, la cual se incrementa o decremento en forma automtica.

Su formato es el siguiente:

for ($variable=ValorInicial; Condicion; Incremento){Intruccin_1;

:Intruccin_n;

}

Esta instruccin for consta de tres parmetros, que son:

Inicializacin de la variable que se utilizar en la condicin.Condicin que se debe cumplir para permanecer en el ciclo.Incremento de la variable contador.

Ejemplo Prctico:Desarrollar una tabla que contenga el nmero, su cuadrado y su cubo.

Tabla de Cuadrados y Cubos


56/245


$cubo = $i * $i * $i;echo"";echo""; echo ($i);echo""; echo ($cuadrado);echo""; echo ($cubo);

echo"";}echo "";?>

Resultado:

Utilizar y elaborar funciones en PHP.En PHP se pueden definir funciones, de manera que no haga falta escribir elmismo cdigo varias veces. Las funciones deben definirse antes de utilizarlas(aunque no sea en el mismo fragmento de cdigo php). Las funciones pueden

no tener argumento o tener argumentos por valor o por referencia.

Los nombres de las funciones siguen las mismas reglas de los identificadoresde PHP, es decir, deben comenzar por una letra o un guin bajo (_) y el restode caracteres pueden ser letras, nmeros o guiones bajos (se pueden utilizarcaracteres no ingleses como acentos, ees, etc), pero los nombres defunciones no distinguen entre maysculas o minsculas.La gua de estilo PEAR para PHP recomienda que los nombres de lasfunciones sigan el estilo camelCase (es decir, sin espacios ni guiones, con la

primera palabra en minsculas y el resto con la primera letra en maysculas).

Ejemplo de funcin y de su uso:


57/245


// ESTO ES UN EJEMPLO DE USO DE LA FUNCIN calculaHipotenusa$cateto1 = 12;$cateto2 = 16;$hipotenusa = calculaHipotenusa($cateto1, $cateto2);

print "

El tringulo de lados $cateto1, $cateto2 y $hipotenusa es rectngulo.
\n";?>
Resultado:El tringulo de lados 12, 16 y 20 es rectngulo.

PHP no distingue entre maysculas y minsculas en los nombres de lasfunciones.

La ins truccin RETURN.

Cuando invocamos una funcin, la ejecucin del programa pasa a ejecutar laslneas de cdigo que contenga la funcin, y una vez terminado, el programacontinua su ejecucin desde el punto en que fu llamada la funcin.

Existe una manera de terminar la ejecucin de la funcin aunque an hayacdigo por ejecutar, mediante el u haya cdigo por ejecutar, mediante el uso dela instrucin return terminamos la ejecucin del cdigo de una funcin ydevolvemos un valor. Podemos tener varios return en nuestra funcin, pero porlo general, cuantos ms return tengamos menos reutilizable ser nuestrafuncin.


58/245


if ($x > $y) {$msg = $x." es mayor que".$y;} else {$msg = $y." es mayor que".$x;}

return $msg;}?>

Include y require.

La clusula require("archivo"); se sustituye en el cdigo antes de que este seejecute por el contenido del archivo, que puede ser un archivo local o una URL.Esta sustitucin se realiza una sola vez, mientras se est preprocesando elcontenido del archivo .php y antes de ejecutarlo.

La clusula include("archivo"); tambin se sustituye por el contenido de archivo,pero en lugar de realizarse una nica vez durante el preproceso del archivo, serealiza durante la ejecucin, cada vez que el flujo del programa llega a esalnea.

Estas 2 clusulas son de gran utilidad a la hora de necesitar unas mismaslneas de cdigo en varios archivos (por ejemplo, una funcin que valideciertos datos, o que muestre la cabecera y pie de las pginas). En lugar de

copiar ese cdigo en todos los archivos que lo necesiten, se pone en unarchivo que es "incluido" por el resto.

Diferencias.

Aunque las clausulas include y require parecen actuar de la misma manera enrealidad no es as. Estas son 2 grandes diferencias que poseen.Optimizacin de los accesos a disco: Imagnese un cdigo en el quedependiendo de una serie de condiciones, se deba incluir o no otros archivos.Con require se cargaran TODOS los archivos SIEMPRE. Con include,

nicamente aquellos que se vayan a utilizar.

Flexibilidad. Con include podemos acceder a archivos cuyo nombre tenemosen una variable que podemos ir cambiando en tiempo de ejecucin, mientrasque con require siempre se accede al mismo archivo.

Tambin existen las funciones include_once y require_once, que nos aseguranque un determinado archivo slo ser procesado una vez, en caso de que ensucesivos includes vuelva a aparecer.



59/245


Bibliotecas.

Las bibliotecas son archivos php que se pueden incluir en cualquier otroarchivo php. Las bibliotecas se suelen utilizar para centralizar fragmentos decdigo que se utilizan en varias pginas. De esa manera, si se quiere hacer

alguna modificacin, no es necesario hacer el cambio en todos las pginas sino nicamente en la biblioteca.Por ejemplo, si definimos en la biblioteca una funcin que imprima la cabecerade las pginas, desde cualquier pgina se puede incluir la biblioteca mediantela construccin include y llamar a la funcin como si se hubiera definido en lapropia pgina:

Ejercicio:Elaborar el archivo milibreria.php

Crear el archivo ejerciciolibreria.php

Se pueden crear todas las bibliotecas que se necesiten e incluir cualquiernmero de bibliotecas en cualquier punto de un programa. Las bibliotecaspueden a su vez incluir otras bibliotecas.

Normalmente, las bibliotecas suelen contener funciones, definiciones de



60/245


constantes o inicializacin de variables, pero en realidad pueden incluircualquier tipo de cdigo php, que se ejecutar en la posicin en la que seincluya la biblioteca.

En el ejemplo siguiente, las bibliotecas modifican variables, lo que afecta a suvalor.

biblioteca_1.php

biblioteca_2.php

Programa:

Resultado:Ahora $i vale 1Ahora $i vale 11Ahora $i vale 21



61/245


1. Instale un servidor php en su computadora local.

2. Explique la diferencia entra las distintas estructuras condicionales queexisten.

3. Elabore una pgina php para que muestra la tabla de multiplicar de unnmero en orden descendente del 12 al 1. Cuando se ingrese un numeronegativo o cero el programa de indicar mediante los mensajes Es negativoo Es cero para el caso que corresponda.

4. Cree una funcin que permita ingresar el subtotal de una compra, el tipo demoneda (Soles o Dolares) y que devuelva como resultado el total mas el igv,el tipo de moneda, todo en soles.

Ejercicios y tareas de investigacin



62/245


TAREA 03: IMPLEMENTAR FORMULARIOS EN LAS PGINAS WEB.

En esta tarea trataremos los siguientes Operaciones:Trabajar con los distintos controles en un formulario.

Manipular el comportamiento de los controles de un formulario.Validar los formularios web.Enviar y recibir informacin de los formularios.

.



3.1. TRABAJAR CON LOS DISTINTOS CONTROLES EN UN

FORMULARIO.

PASOS PARA INSERTAR UN CAMPO DE TEXTO EN UNA PGINA PHP.

Los controles deben de estar dentro de un formulario.

PASO 1: Dele clic en menInsertar, luego seleccione laopcin formulario e inserteel formulario tal como lomuestra la siguienteimagen:

PASO 2: Ubique el cursor dentro delformulario, dele clic al men Insertar, luegoformulario y por ultimo seleccione campo de

texto.

El xito del hombre radica en el grado de humildad de esprituque tenga..Annimo.



63/245


PASO 3: En la siguiente ventana indicaremoslos atributos bsicos del campo de texto como por

ejemplo el id y la Etiqueta, luego dele clic en el

botn Aceptar.

Resultado en diseo:

Resultado en el navegador:

Vista cdigo:

Verifique que el cdigo se ha generado de forma automtica.

PASOS PARA INSERTAR UN CONTROL

LISTA / MENUPASO 1: Del ejemplo anterior, ubicamos elcursor debajo del campo de texto nombrey seleccionamos la opcin Lista men talcomo lo muestra la siguiente imagen:

PASO 2: Ingrese los atributos y deleclic en el botn Aceptar.



64/245


PASO 3: Seleccione el control lista/Men en la vistadiseo y dele clic al botn Valores de la lista del panelinferior de propiedades.

PASO 4: En la siguiente ventana ingrese losvalores y las etiquetas que tendr cada valorde la lista.

Utilice el botn + que se encuentra en laparte superior izquierda de la ventana paraagregar ms elementos.

PASO 5: En la vista cdigo puede ingresar el parmetro selected al elementoque desea que aparezca seleccionado por defecto.

Resultado en diseo:


Vista cdigo:

Verifique que el cdigo generado de forma automtica:



65/245


PASOS PARA INSERTAR UN CONTROL CAMPO DE TEXTO DEL TIPOCONTRASEA.

PASO 1: Ingrese un control campo de texto llamado clave con su respectivaetiqueta, tal como lo muestra la siguiente imagen:

PASO 2: Seleccione elcampo de texto yactive la opcinContrasea del panelde propiedades.

Adicionalmente puede agregar los atributos para la cantidad mxima decaracteres (Car. mx) que se puede ingresar y el tamao (Ancho car) decuantos caracteres se pueden visualizar, tal como lo muestra la imagensiguiente:




66/245


En este ejemplo se digito la siguiente clave: 12345, vemos que el campo detexto est protegido para que no se pueda visualizar el texto ingresado.

Adems solo se pueden ingresar un mximo de 5 caracteres.

Vista cdigo: Verifique que el cdigo generado de forma automtica:

Nos podemos dar cuenta que al trabajar en modo diseo el programa general

el cdigo de forma automtica.

3.2. MANIPULAR EL COMPORTAMIENTO DE LOS CONTROLES DE UNFORMULARIO.

FORMAS DE USAR JAVASCRIPT EN DOCUMENTOS HTML.

Definir javascript en la misma pgina.



67/245


La primera forma de usar JavaScript dentro de una pgina web es embebiendodirectamente el cdigo JavaScript dentro del cdigo HTML.

Escriba el siguiente cdigo y gurdelo con el nombre primer_js.html en sucarpeta del servidor local.

document.write("Hola programador!!!")

El resultado en el navegador seria el siguiente:

Como podemos observar, el cdigo JavaScript debe ir encerrado entre lassiguientes marcas:

La segunda forma para usar JavaScript es definir JavaScript en un archivoexterno. Los archivos de JavaScript son archivos de texto guardados con laextensin .js.

DEFINIR JAVASCRIPT EN UN ARCHIVO EXTERNO.

PASO 1: Crear un nuevo archivo del tipo Javascript.



68/245


PASO 2: Ingresar el cdigo en la nueva pgina creada.

alert('Mensaje JavaScript');

PASO 3: Crear una nueva pgina con el nombre javascript1.html la cual harreferencia al archivo mensaje.js y tendr el cdigo tal como lo muestra lasiguiente imagen:

PASO 4: Ejecutar la pginajavascript1.html.

Observe que al ejecutarse la pgina javascript1.js ejecuta el archivo mensaje.jsel cual tiene el cdigo para emitir una alerta en el navegador.

Luego de aceptar el mensaje de alerta se mostrar en pantalla el siguientemensaje que fue definido entre las etiquetas body de la pagina principaljavascript1.html.

NOTA:

*El archivo mensaje.js debe de estar almacenado en la misma ruta que el archivojavascrip1.html, si estuviera en otro lado habra que indicar la ruta en el src del archivoque lo invoca.

*El cdigo javascript puede ejecutarse directamente en una pgina con extensinPHP.



69/245


Operadores Aritmticos.

Los operadores aritmticos toman los valores numricos (literales o variables)como sus operando y devuelve un solo valor numrico. Los operadoresaritmticos normales son:

Operador Nombre Ejemplo Descripcin

+ Suma 5 + 6 Suma dos nmeros- Substraccin 7 - 9 Resta dos nmeros* Multiplicacin 6 * 3 Multiplica dos nmeros/ Divisin 4 / 8 Divide dos nmeros

% Mdulo: el restodespus de ladivisin

7 % 2 Devuelve el resto de dividirambos nmeros, en este ejemploel resultado es 1

++ Incremento. a++ Suma 1 al contenido deuna variable.

-- Decremento. a-- Resta 1 al contenido de unavariable.

- Invierte el signo deun operando.

-a Invierte el signo de un operando.

Elaborar cdigo JavaScript utilizando operadores

aritmticos.

PASO1: Cree un archivo con el nombreoperadores1.php e ingrese el siguiente cdigo:

PASO2:

Ejecute el archivo en su servidorlocal y tendr el siguienteresultado:

Pasos para crear un archivo que cargue datos en la misma pginautilizando una funcion ajax.

El ejemplo va a consistir en un link dentro de la pgina principal que al hacerclick sobre el mostrara una tabla sin que la pgina se recargue. La tabla que vaa mostrar se encuentra en otro archivo.



70/245


PASO 1: Crear un archivo con el nombre ajax1.php el cual tendr el siguientecdigo.

Ejemplo de ajax

function cargar(){

var url="tabla.php"

$.ajax({type: "POST",

url:url,

data:{},

success: function(datos){

$('#tabla').html(datos);

}

});

}

function borrar(){

var d = document.getElementById("tabla");

while (d.hasChildNodes())

d.removeChild(d.firstChild);

document.getElementById("cerrar").style.visibility="hidden";

}

Ejemplo utilizando ajax:

Da click sobre el link para cargar una tabla sin cambiar de pagina.

Ver tabla de alumnos



71/245


Borrar tabla

Modo diseo del cdigo anterior:

NOTA:Recuerden que para que todo funcione tenemos que mandar llamar lalibrera jquery, en el ejemplo anterior se est llamando desde una librera

alojada en un servidor.

PASO 2:

Crear un archivo con el nombre tabla.php el cual tendr el siguiente cdig

Documents

89001683 Desarrollo Aplicaciones Web (Redes)