Conocimientos de aplicaciones web

Conocimientos previos a las Aplicaciones Web

1

ADMINISTRAR REDES Y GESTIONAR LA CONEXIÓN A REDES EXTERNAS

Actividad Nº 6

“Taller conocimientos previos Aplicaciones Web”

JUAN CAMILO PANIAGUA GUTIERREZ PRISCILLA YEPES CORREA

Programa:

TECNOLOGIA EN GESTION DE REDES DE DATOS

Instructora Lina Mckoll

SERVICIO NACIONAL DE APRENDIZAJE SENA CENTROS DE SERVICIOS Y GESTION EMPRESARIAL

MEDELLIN – ANTIOQUIA

2012


2

Contenido

INTRODUCCION....................................................................................................................3

CUESTIONARIO.....................................................................................................................4

SOLUCION............................................................................................................................6

WEBGRAFÍA ....................................................................................................................... 24


3

INTRODUCCION

Antes de realizar un desarrollo exquisito de Aplicaciones Web, una persona corriente

debiera de entrarse en el contexto como tal de manera que nosotros lo realizaremos resolviendo unos interrogantes que crean dudas y preguntas, que aterrizaran en el tema a cualquier lector interesado en adquirir las bases conceptuales y procedimentales necesarias para la Instalación, administración y ejecución de Aplicaciones Web en diferentes plataformas.


4

CUESTIONARIO

1. Diseñe uno o varios gráficos en los que se muestre todo el proceso de comunicación

usando el modelo OSI, de la interacción cliente-servidor de una petición Web. Comience desde que el usuario ingresa la URL en el navegador Web y tenga en cuenta las consultas a los servidores DNS. Suponga dirección IP privada para el cliente (Dentro de una LAN) y dirección IP pública para el servidor Web. Puede usar Packet Tracer como ayuda y analizar la PDU de cada capa del modelo OSI.

2. ¿Cuáles son los puertos bien conocidos del modelo TCP/IP?.

3. ¿Cuáles son los puertos registrados del modelo TCP/IP?.

4. Defina HTTP.

5. Dé un ejemplo real de un diálogo HTTP, de muestre con Wireshark u otro software capturador de tráfico.

6. ¿Cuáles son los códigos de estado HTTP?.

7. ¿Qué son las cookies?.

8. ¿Cuál es la diferencia entre una aplicación en el lado del cliente una aplicación en el lado del servidor? Dé ejemplos.

9. Explique la diferencia entre una página Web dinámica y una página Web estática.

10. ¿Cuáles son los elementos y atributos de una estructura HTML?.

11. Cree una tabla en la que muestre las etiquetas y atributos correspondientes a los

siguientes elementos de un documento HTML (Dé ejemplos):

o Inicio y final de un documento HTML

o Cabecera de un documento HTML

o Título de la página Web o Cuerpo de la página Web o Tabla o Fila o Columna o Hipervínculo o División de la página

o Texto en negrita o Texto en cursiva o Texto subrayado o Formulario y elementos del

formulario o Código de un script o Insertar una imagen o Fuentes o Salto de línea o Marcos

12. Ingrese al sitio Web que usted creo, obtenga el código fuente de la página Web e identifique todas las etiquetas del documento HTML.

13. Consulte la tabla de colores RGB con su correspondiente código hexadecimal.

http://www.ayddiseno.com/web.html


5

14. ¿Qué son las hojas de estilo (CSS)?.

15. ¿Qué es una aplicación Web? Realice una lista de 20 aplicaciones Web.

16. Explique los siguientes lenguajes de programación y conceptos relacionados con las

aplicaciones Web:

o PHP o ASP o Perl o Python o CGI o .NET o JSP

17. Define WAMP, LAMP y XAMPP.

18. ¿Qué es una base de datos?.

19. ¿Cuáles son las principales características de SQL?.

20. Cuáles son los principales sistemas de gestión de bases de datos (Explique brevemente cada uno de ellos).

21. Instale un gestor de base de datos MYSQL en Windows y un gestor de base de datos

MYSQL en Linux. Cree una base de datos y diferentes tablas y campos, mediante un software de administración gráfica y mediante línea de comandos. Use máquinas virtuales y evidencie el proceso.

22. Realice una lista de comandos para administrar una base de datos MYSQL.


6

SOLUCION

1. Es una LAN que se dirige hacia una red exterior en el cual, están los servicios de la página alojada.

En el Servidor se crea una página estática en una red y se instala un PC en una LAN diferente para crear una topología similar a la realidad, así observar y probar como se vería la interacción entre cliente y servidor.

Esta es la PDU de la comunicación entre cliente y servidor, solicitando una re spuesta de la petición del cliente por una Pagina Web.


7

2. Los puertos bien conocidos son los identificadores de unos protocolos que ya están definidos, en puertos lógicos permitir la comunicación con estos. Los puertos son en números y van del 0 al 1023. Los mas comunes son:

Puertos Protocolos

20 & 21 FTP

22 SSH 23 TELNET

53 DNS 67 DHCP

80 HTTP

3. Puertos registrados van del 1024 al 49151 y estos son de libre utilización.

4. HTTP es un protocolo de Capa de Aplicación, sus siglas traducen “Protocolo de Transferencia de Hipertextos”.

Este realiza la transferencia de archivos entre navegador web y un servidor web. Cuando se escribe un URL realiza una petición y establece conexión con el servicio web del servidor que usa el protocolo HTTP para transmitir los datos del código de la página y responde la solicitud al usuario.

5. Con la Herramienta Wireshark podemos capturar el tráfico de la red. En la cual

estamos pidiendo la respuesta desde un Sitio Web.

Estamos viendo en trafico de pregunta y respuesta del cliente servidor respectivamente para logra recibir gráficamente la Página Web


8

6. Los códigos de estados HTTP son:

Son códigos numéricos que proporcionan información con respecto al estado en que se encuentra la solicitud http, se clasifican de la siguiente manera:

Código Descripción 1xx (Respuesta Provisional)

Son códigos en espera, es decir le solicitan al cliente que continúe.

2xx (Correcto) Estos códigos son los que informan los éxitos. 3xx (Redirigido)

Son códigos los cuales requieren acciones específicas para completar mi petición. Para el nuevo direccionamiento.

4xx (Error de solicitud)

Los códigos indican que en la petición hay errores al procesar.

5xx (Error del servidor)

Los códigos informan errores en el servidor, no en la petición.

305 (Usar proxy) 400 (Solicitud incorrecta) 407(Autenticación del Router) 7. Las cookies son una pequeña pieza de información enviada por un sitio web, las cuales

son almacenadas en el navegador del usuario, de esta manera el sitio web puede consultar dicha información para notificar al sitio de la actividad previa del usuario.

8. La diferencia principalmente entre las aplicaciones manejadas desde cliente y servidor,

seria básicamente que en el cliente este interactúe con la aplicación y sus herramientas y funciones determinadas por el servidor, mientras que en el servidor se encuentra la configuración y códigos de la aplicación.

9. Página Web

Estática Dinámica


9

La página Web dinámica nos permite tener una mejor interacción con la pagina ya que esta puede contener imágenes videos aplicaciones y demás herramientas para la interacción con el cliente, mientras que la pagina web estática solo nos muestra un texto o un contenido definido por el administrador de la pagina web y no le permite al usuario mayor acción con esta.

10. Los elementos de una estructura básica de HTML en programación son los siguientes y esta está delimitada por unos atributos que son los que nos posibilitan definir hasta dónde puede llegar dicho elemento de programación y como se definirá dicho elemento y donde se estará ubicado. Por Ejemplo: <html> <head><title>Titulo de Atributo</title></head> <body> <p bg color=“Blue”> Esto es un ejemplo de atributo y un elemento </p> </body> </html> Elementos. Atributo.

11. Algunas etiquetas son:

Inicio y final de un documento HTML <HTML></HTML> Cabecera de un documento HTML <head></head>

Título de la página Web <title></title>

Cuerpo de la página Web <body></body>

Tabla <table border=“#”></table>

Columna <td></td>

Hipervínculo <a href=“ruta”>nombre de vinculo</a>

División de la página

Texto en negrita <b>texto</b>

Texto en cursiva <i> texto </i>

Texto subrayado <U> texto</U>

Formulario y elementos del

formulario

<form name=“nombre del fomulario” method=“metodo”> </form>

Código de un script <script language=“lenguaje”> </script>

Insertar una imagen <img src=“Ruta de la imagen”/>

Fuentes <font face= “letra” color= “color” size= “tamaño”> texto </font>

Salto de línea <br>

Marcos <frame rows= “#”> </frame>


10

12. Identificando código fuente.

Inicialmente fue un hipervínculo con <a href>; luego se inicio una tabla con el borde 0 dentro de un formulario; un titulo tipo uno que utiliza varias columnas, con el atributo colspan. Cada columna (<td>) es creada dentro de una fila (<tr>). Al frente de cada requerimiento de información hay un cuadro de texto estos se realizan por medio de la etiqueta <input type =“text”> que significa que habrá una entrada de texto. Luego la selección de género se logra mediante una entrada tipo radio. Seguido de esta tenemos una casilla de selección que se logra con la etiqueta <select> a esta se le da nombre y unas opciones para escoger mediante (<option value>). la opción inicial tiene una característica que la indica que es la opcion predeterminada, esta se configura mediante el atributo selected= “selected” dentro de la misma etiqueta. Luego de repetir unas casillas de texto tenemos entradas tipo botón que pueden llevar a otro lugar y borrar todos los datos ingresados. Son entradas <input type= con valores de “reset” y “submit”>.

13. La tabla de colores RGB es:


11

14. Las hojas de estilo CSS tienen como idea separar la estructura del documento al de su

presentación.

15. Las aplicaciones web son herramienta codificadas en lenguajes posibles para ser soportada por los navegadores y este software será para disfrute y servicio de los usuarios, y es ofrecido mediante el servidor web.

Existen varios tales como:

Webmails

Tiendas en línea

Wikipedia Wikis

Weblogs

1link.in Remindr

Friend or Follow

Emisoras online Fav4

U2ws

Chat roulette

simpy social marks

Flock

Yoono 30boxes

Eventicus

campfire lfoder

16. Conceptos de Bases de Datos y lenguajes de Programación: PHP es un lenguaje de Programación, con el cual se puede crear contenido dinámico que permite la conexión a bases de datos. ASP es un lenguaje de programación creado por Microsoft para elaboración de paginas web dinámicas. Perl es un lenguaje de programación interpretado por la Shell, proveniente de lenguajes tales como C, sh. Este es de libre Uso. Python es uno de los lenguajes de programación que te permite crear un código elegante, este ahorra un tiempo considerable en el desarrollo de los programas. El intérprete se puede utilizar en modo interactivo, lo que facilita experimentar con características del lenguaje. CGI es una importante tecnología de la red que permite a un cliente transferir datos entre cliente y servidor y el programa. Es un mecanismo entre el servidor web y una aplicación externa cuyo nombre de CGLs. .NET es un proyecto de Microsoft para crear una nueva plataforma de desarrollo de software. Con el cual desea desarrollar desde el sistema operativo hasta las herramientas del mercado.

JSP es una tecnología orientada a crear páginas web con programación en java. Podemos crear aplicaciones web que se ejecute en variados servidores web, de múltiples plataformas.


12

17. WAMP - LAMP - XAMPP: Son acrónimos para los servidores que usan diferentes herramientas asociadas en un mismo software:

X Plataforma Windows Linux (Sistema Operativo) Apache Apache Apache (Servidor Web) Mysql Mysql Mysql (Base de Datos) Php, Perl, Python Php, Perl Php, Perl (Language)

Todos son de código abierto menos en Windows ya que este tiene estructura de Internet y XAMPP es para cualquier plataforma. 18. Las bases de Datos son un gran “almacén” de datos relacionados con un significado implícito organizada de manera eficiente. 19. SQL ES un lenguaje de ordenes con el que es posible acceder a las bases de datos. Sus características son:

Soporte de Translaciones.

Escalabilidad, estabilidad y seguridad.

Entorno grafico. 20. Sistemas de Gestión de Bases de datos son tales como: Mysql: Sistema multiusuarios muy utilizado en aplicaciones web, en plataformas Linux/Windows. DBASE: Fue el primer sistema de gestión de datos usados ampliamente para microcomputadoras DBASE nunca pudo superar exitosamente la transición de Microsoft Windows y termino siendo desplazado por otros productos. FileMaker: Es una aplicación multiplataforma de Windows y Mac de base de datos relacional de FileMaker inc. FileMaker integra el motor de la base de datos con interfaz, esto les facilita a los usuarios manipular la base de datos al arrastrar.


13

21. Instalación MYSQL en Linux y Windows: Windows XP

Iniciamos la instalación de Mysql e indicamos siguiente.

Después de indicar siguiente en parámetros anteriores omitidos, sale la pantalla de Carga de la instalación.


14

Se indica configurar las opciones generales de Mysql y finalizar.

Inicio Configuración del servidor Mysql y siguiente.


15

Indicar parámetros del password del root y finalizamos. AGREGAR BASE DE DATOS MEDIANTE LINEA DE COMANDOS:

Con el comando créate database, creamos nuestra base de datos en este caso ejemplo y la visualizamos en la lista mediante el comando show databases.


16

Pasamos a crear la tabla, primero indicamos con el comando use que base de datos vamos a utilizar en este caso ejemplo, insertamos la tabla y sus parámetros con la sintaxis créate table (datos) (nombre varchar (15), apellido varchar (15), teléfono varchar (15)); mediante lo anterior creamos la tabla con el nombre datos y con los parámetros nombre, apellido y teléfono. Varchar indica el tipo de carácter que ira en el campo en este caso cualquiera, con un limite de 15.Finalizando se visualiza la tabla con describe datos.

Insertamos información en la tabla mediante la sintaxis INSERT INTO datos (nombre, apellido, teléfono) VALUES (“camilo”, “Paniagua”, “2364097”); esto ingresa en el campo nombre camilo, apellido Paniagua, teléfono 2364097 y visualizamos el contenido de la tabla con el comando select * from datos;.


17

Linux CentOS

Se instalan los paquetes del servidor Mysql.

Por seguridad nos pide una contraseña para el usuario root, la cual debemos confirmar.


18

Descargaremos el phpmyadmin que controlara el modo grafico.

Se escoge el servidor que ejecutara el phpmyadmin.


19

Aceptamos la configuración de las bases de datos para la facilidad de la manipulación.

Indicamos la contraseña que manejara el root.


20

Se incluye en el archivo apache.conf de la ruta del phpmyadmin para que el servidor la identifique, se reinicia el apache.

Digitamos en el navegador /local host/phpmyadmin, cambiamos el lenguaje e ingresamos usuario root y contraseña.


21

En el espacio donde esta el cursor se escribe el nombre de la nueva base d e datos y las características de cotejamiento para que haya un optimo funcionamiento, el tipo de codificación que usamos es la utf8_general_ci que es la del lenguaje español.

Le indicamos crear una tabla dentro de la base de datos ya creada para almacenar la información (se pueden crear miles de bases de datos).


22

Esta es la configuración de los atributos de la tabla, se indica el nombre del atributo, tipo de carácter, longitud y cotejamiento.


23

En modo consola se ingresa al Mysql con la opcion -u indicando el usuario root y con la opcion -p la contraseña para próximamente ingresarla, Con el comando créate database, creamos nuestra base de datos. Pasamos a crear la tabla, primero indicamos con el comando use que base de datos vamos a utilizar en este caso ejemplo, insertamos la tabla y sus parámetros con la sintaxis créate table tabla(Documento int(15), Nombre text(15), Apellido text (15)); mediante lo anterior creamos la tabla con el nombre tabla y con los parámetros documento, nombre y apellido. TEXT indica que el tipo de carácter que ira en el campo en este caso será texto (letras), y dentro de los paréntesis se ubica su longitud límite. INT indica caracteres numéricos. Insertamos información en la tabla mediante la sintaxis: INSERT INTO tabla (Documento, Nombre, Apellido) VALUES (“9412092464”, “Juan” “Paniagua”); esto ingresa los valores en su columna respectiva. 22. Estos serán algunos comandos básicos para manejar Mysql.

Comando Función

Show databases; Ver las bases de datos creadas. Show tables; Ver las tablas creadas.

Show columns from tabla; Ver la configuración de la tabla. Describe tabla; Ver la configuración de la tabla.

Use base de datos; Usar una Base de Datos.

Créate table tabla (col1 tipo(lon.), col2 tipo(lon.));

Crear Tabla.

Créate base de datos; Crear Base de Datos.

Drop table tabla; Borrar una tabla. Drop date base base de datos; Borrar una Base de Datos.

Select columnas from tabla where condisión; Seleccionar datos de una tabla. Insert into table(col1, col1) values(“dato”, “dato”);

Introducir datos en una table.


24

WEBGRAFÍA

Sicrono.com Socialblabla.com Htmlpoint.com Masadelante.com Alegsa.com.ar Wikipedia.org Desarrolloweb.com

Conocimientos de aplicaciones web

Documents

Transcript of Conocimientos de aplicaciones web