clase programación web

Máster en Comunicación Digital y Branding

Vicente RosComunicación Digital CEU


Linked-in: http://www.linkedin.com/in/fernandoleandroXing: http://www.xing.com/profile/fernando_leandroBaladronFacebook: http://es-la.facebook.com/fernandoleTwitter: http://www.twitter.es/documentalista_Flickr: http://www.flickr.com/documentalistadigitalDelicious: http://www.delicious.com/documentalistadigitalYoutube: http://www.youtube.com/documntalistadigitalSlideshare: http://www.slideshare.net/documentalistadigitalNetvibes: http://www.netvibes.com/documentalistadigital

#Y este quién es?


CLASE 1: Programación WEB

http://digital.ceu.es


#La Red Social!NO HABLAMOS EN CHINO!!

你好中國，我們並不非常清楚地知道，可我們的興趣，或者我們可以關心你所以你去拜訪您指望之一的，對我們來說，更多的捐款來自西班牙的世界：

食譜馬鈴薯煎蛋

皮爾的洋蔥和土豆喜鵲洋蔥成非常小的碎片和地點他們不要魚苗在一個泛用大量石油同時削減土豆不能過於單薄鋁箔，季節性，並加入到鍋偶爾炒攪拌，直到金黃色圍繞位刪除，並讓流失準備一碗擊敗第蛋購買的土豆，洋蔥把小油，鍋和爭取的混合之前



Dirección web

<h1>ÍNDICE</h1>

<h2>Tecnología de Servidor</h2>

<h2>Programación</h2>

<h2>BD</h2>

<h2>XML/RSS</h2>

<h2> Web Semántica </h2>


<h1>TECNOLOGÍA DE SERVIDOR</h1>


“La Tecnología y no la Ideología es lo que cambiará el mundo” – Aldous Huxley

<h1>Tecnología de Servidor</h1>


Arquitectura de 3 capas


¿A cuál le doy mi Sí Quiero!?Los Lenguajes de Desarrollo


Vale! Dónde estan las Maletas?Los Sistemas de Gestión de Base de Datos


Hogar dulce Hogar!Los Servidores de Aplicaciones


CMSQue? Eso lo serás tú!


Arquitectura de 3 capas


¿Hosting/Housing/Servidor Privado?

- Hosting: En este tipo de servicio se alojan clientes de varios sitios en un mismo servidor, gracias a la configuración del programa servidor web. Resulta una alternativa muy buena para pequeños y medianos clientes, es un servicio económico debido a la reducción de costos ya que al compartir un servidor con cientos de personas o usuarios el costo se reduce dramáticamente para cada uno, y tiene buen rendimiento. Un solo servidor puede alojar hasta 300 proyectos.

- Housing: Este servicio consiste básicamente en vender o alquilar un espacio físico de un centro de datos para que el cliente coloque ahí su propio ordenador. La empresa le da la corriente y la conexión a Internet, pero el ordenador servidor lo elige completamente el usuario (hasta el hardware).

- Servidor dedicado: se refiere a una forma avanzada de alojamiento web en la cual el cliente alquila o compra un ordenador completo, y por tanto tiene el control completo y la responsabilidad de administrarlo. El cuidado físico de la máquina y de la conectividad a Internet es tarea de la empresa de alojamiento, que suele tenerlo en un centro de datos.


Fases Proyecto Informático

-Diagrama de Gantt

-Definir las Fases, Definir las predecesoras, antecesoras

-Herramienta Project


Ejemplo Ficha Tarea

Especificación de TareaNúmero: 3.1.

Nombre: Diseño B.D.

Descripción: Se diseñara la base de datos, partiendo del modelo entidad-relación propuesto en el análisis y con el objetivo de tener un sistema funcionando sobre DB2.

Esfuerzo Estimado: 2 semanas/hombre

Entregables:Estructura de implementación de la B.D.

……………: ……………………………


<h1>DIAGRAMA DE GANTT</h1>TAREAS

Especificar Necesidades

Diseño Programas

Diseño Base de Datos

Realización Esquema

Codificación Aplicaciones

Pruebas

0 2 4 6 8 10 12 14 16 SEMANAS


Nombre Proyecto Puntos de Función

Lenguaje Esfuerzo en horas

Estudio

viabilid.

Análisis

Diseño

Codifi-cación

Prueba

Instala-ción

Mant. Inicial

WEB Editorial 200 PHP 5.017 4% 12% 12% 22% 22% 8% 20%

Vinos S.L 300 JAVA 5.410 5% 15% 15% 20% 10% 10% 25%

JugueteraValenciana

250 ASP.NET 5.930 4% 12% 12% 22% 20% 8% 22, %

PeriodicoMediterráneo

150 PHP 2.569 5% 15% 15% 22% 8% 10% 25%

#Planificación


#Trabajar con programadores

Planifica, Planifica, Planifica..Ejecuta y

Controla


Proyecto Informáticos<pregunta> Contrataría a estas personas? </pregunta>


<h1>Proyecto Informáticos</h1>

-BETA continuo! ÉXITO

-Productos Escalables /Estandarizables-La improvisación la dejamos para el Teatro-Se entiende como “fracaso” un proyecto con demoras significativas, gastos muy superiores al presupuesto, o que no se entregó el valor esperado-No reinventemos la Rueda, genera Código Reusable.-Las Cosas necesitan Ser Probadas!

<h1>Práctica Planificación Project</h1>


<h1>PROGRAMACIÓN</h1>



"Cualquier tonto puede escribir código que un ordenador entiende. Los buenos programadores escriben código

que los humanos pueden entender. - Martin Fowler



PROBLEMA -> ALGORITMO -> PROGRAMA

Un algoritmo (del griego y latin, dixit algorithmus y éste a su vez del matemático persa Al Juarismi ) es un conjunto preescrito de instrucciones o reglas bien definidas, ordenadas y finitas que permite realizar una actividad mediante pasos sucesivos que no generen dudas a quien deba realizar dicha actividad


<h1>Mi Algoritmo</h1>

Algoritmo para hacer un huevo frito:

1.Voy a la cocina.2.Saco un huevo del refrigerador.3.Saco una sartén.4.Pongo un poco de aceite en la sartén.5.Hecho el huevo a la sartén.6.Lo frío.7.Me lo como.

Versión Mejorada:

1.Voy a la cocina.2.Veo si hay huevos en el refrigerador.3.Si hay, saco un huevo y salto al paso 84.Si no hay, voy a comprar.5.Para comprar, voy a buscar $.6.Si hay $, saco y voy al paso 87.Si no hay $, no se hace el huevo frito.8.Veo si hay gas.9.Si hay, prendo la cocina y voy al paso 14.10.Si no hay, busco dinero para pedir gas.11.Si no hay dinero, no hago el huevo.12.Si hay, encargo y salto al paso 14.13.Espero que llegue el gas.14.Saco una sartén.15.Si no hay sartén, no hago el huevo.16.Etc, etc.



http://www.flickr.com/photos/ryantron/4453018910/in/photostream/


<h1>Ejemplo</h1>Inicio /* Establecemos el inicio del programa */

Letra mensaje=”Hola mundo”;

/* A continuación definimos una variable de tipo “Letra”, de nombre “mensaje” y le damos un valor inicial de “Hola mundo”, el mensaje que queremos mostrar. Luego de la sentencia ponemos un punto y coma para indicar el fin de esta, algo que utilizaremos mucho cuando estemos programando en algún lenguaje, ya que eso le indica al entorno de programación que es el fin de la sentencia */

Principal( )

/* Definimos la función “Principal” que es donde irá el cuerpo del programa. Ya adentraremos el tema de las funciones */

mostrar mensaje;

/* Utilizamos la sentencia “mostrar” para enviar un mensaje que se despliegue en pantalla y luego la variable que contiene el mensaje, en este caso “mensaje”. Cerramos la sentencia con un punto y coma para indicar que se ejecute la línea */

Fin/* Finalizamos el programa */


<h1>Variables</h1>

1.Int: Corresponde a números enteros

2.Float: Corresponde a valores de punto flotante

3.Char: Corresponde a valores de caracteres alfanuméricos (0 a 9 y abecedario).

4.Boolean: Corresponden a valores de tipo lógico. Almacenan sólo 2 posibles valores: true o false.

5.String: Corresponde a una cadena de caracteres


Sintaxis lenguajes programación

<h1> LOS OPERADORES </h1>

La lógica Boleana utiliza los siguientes Operadores :Y, O, y NO. Operador Y (and / && )asegura que se incluya las condiciones.“social media” y “marketing online”

Operador O (or / || )Generamos alternativas “marketing online” or “social media”

Operador NO (not / ! )Que no se dé esa condiciónNo (“socialmedia”)


Sintaxis lenguajes programación

<h1> LOS OPERADORES (Continuación)</h1>

+ Suma.- Resta.* Multiplicación./ División.% Módulo de la división (resto).++ Incremento.– Decremento.< Menor a.> Mayor a.== Igual a. (Se debe usar doble signo ya que el signo simple es para asignar valores).!= Distinto de. (<>)


Diagrama de Flujo


<h1>diagrama de flujo</h1>


Iteraciones condicionales múltiples y uso de más de una condición

IF (condición_1) THENBLOQUE DE INSTRUCCIONES 1

ELSEIF (condición_2) THEN

BLOQUE DE INSTRUCCIONES 2ELSE

BLOQUE DE INSTRUCCIONES 3END IF

END IF

MiEdad = InputBox("indicame tu edad: ", , 25)

if (MiEdad>=18) and (miEdad<=65) thenmsgbox("Usted está en edad laboral")

elsemsgbox ("Usted no esta en edad laboral")

end if


Switch: Otra iteración condicional.

//Activamos el switch con la variable opción.

Switch (opcion) {/* En el caso que valga 1 */case 1: printf(“\nHola mundo”); break;

/* En el caso que valga 2 */case 2: printf(“\nBuenos dias”); break;

/* En el caso que valga 3 */case 3: break;

/* Caso por defecto */default: printf(“\nOpcion no valida”); break;}


<h1>Programación</h1><h3>Los Ciclos o búcles.</h3>

Dim variable as integer;variable=500;

for (inicialización; Condición; siguiente iteración){ACCIONES;}


<PHP><ASP>

-Ver Chate Sheet


Examen Informaticus Programatorum

Primero resuelve el problema. Entonces, escribe el código.- John Johnson


<h1>Ejemplo SCPF</h1>

http://www.scpf.com/


En búsqueda de PatronesVuelo de las abejas!, Simulación Estadística, Random() Forever!

http://humanismoyconectividad.wordpress.com/2010/07/30/patrones-naturaleza/

http://www.begues.net/javascript/6650-abeja.html


<h1>Repaso</h1>

ZZZZZZZZZZZZZZZzzz


<h1>BASE DE DATOS</h1>


Base de Datos

La Información es Poder …Si se actualiza.- Genis Roca


<h1>Diseño de Base de Datos</h1>

Conceptos:

-Tablas-Registros-Restricción Clave Primaria-Clave Ajena

Es un conjunto de datos pertenecientes a un mismo contexto y almacenados sistemáticamente para su posterior uso.


DNI Apellidos Direccion Telefono000000001Perez Lopez Av/. calle 5 910002525

000000002

Martin Perez

C/. Lope 15 910002524

COD_VIAJE DNI

1 000000001

3 000000002

2 000000001

COD_VIAJE Fecha Precio DNI_GUIA1 10/12/201010/12/2010 150 € 0000000032 20/12/2010 140 € 000000005

3 24/12/2010 250 €

00000004

CHOFER

CONDUCE

VIAJE

¿Qué chofer sale el día 10/12/2010?


Diseño de Base de Datos


Diseño de Base de Datos-Práctica Diseño de la Base de datos para Twitter/Facebook


<h1>XML/RSS</h1>


<h1>XML</h1>

"Colaboración es multiplicación." John C. Maxwell (físico que desarrolló la teoría electromagnética)


<XML></XML>XML, siglas en inglés de eXtensible Markup Language (lenguaje de marcas extensible), es un metalenguaje extensible de etiquetas desarrollado por el World Wide Web Consortium (W3C).

Máster en Comunicación Digital y BrandingXML

<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE Edit_Mensaje SYSTEM "Edit_Mensaje.dtd"> <Edit_Mensaje> <Mensaje>

<Remitente> <Nombre>Nombre del remitente</Nombre> <Mail> Correo del remitente </Mail>

</Remitente>

<Destinatario> <Nombre>Nombre del destinatario</Nombre> <Mail>Correo del destinatario</Mail>

</Destinatario>

<Texto> <Asunto> Este es mi documento con una estructura muy …</Asunto> <Parrafo> Este es mi documento con una estructura muy sencilla... </Parrafo> </Texto>

</Mensaje> </Edit_Mensaje>

Máster en Comunicación Digital y BrandingXML<?xml version="1.0" encoding="utf-8" ?> -<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" -xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" x-si:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">

<url> <loc>http://www.uchceu.es/cursos/index.aspx</loc> <priority>5</priority> <lastmod>20/10/2009</lastmod> <changeFreq>monthly</changeFreq> </url><url> <loc>http://www.uchceu.es/eventos/index.aspx</loc> <priority>5</priority> <lastmod>29/09/2009</lastmod> <changeFreq>monthly</changeFreq> </url><url> <loc>http://www.uchceu.es/noticias/index.aspx</loc> <priority>5</priority> <lastmod>07/07/2010</lastmod> <changeFreq>monthly</changeFreq> </url> </urlset>


<h1>Yo soy tu Padre</h1>


<h1>RSS por dentro!<h1><?xml version="1.0" encoding="utf-8"?><rss version="2.0" xmlns:blogChannel="http://www.uch.ceu.es"><channel><title>RSS de los Blogs CEU</title><link>http://www.uch.ceu.es/principal/listablogs.aspx</link><description>Este RSS sirve para suscribirse a los Blogs CEU</description>

<item><title>Noticia1</title><link>http://www.uch.ceu.es/principal/docu/noticia.aspx</link><description>Texto de la descripcion 1.</description></item>

<item><title>Noticia 2</title><link>http://www.uch.ceu.es/principal/docu/revistaPrensa.aspx</link><description>Texto de la descripcion 2. </description></item>

</channel></rss>


<h1>Practica XML!<h1>


<h1>Web Semántica</h1>


“Los límites de mi lenguaje son los límites de mi mente.” Ludwig Wittgenstein

<h1>Web Semántica</h1>


Web Semántica: dando Significado a la web


http://dotsub.com/view/8945aae8-9f00-4018-8426-bdd788adcfc6

http://hello.eboy.com/

Ver Video Introducción Web Semántica


Me encanta Paris!


Y justo cuando usted pensaba que estaba entendiendo la Web 2.0Por Heidi Dawley

OntologíasPolisemiaSinonimia

Folksonomias (delicio.us, last.fm, flickr)

OWL/ RDF/ Microformatos


<h1>Ontologías<h1>

El término ontología en informática hace referencia a la formulación de un exhaustivo y riguroso esquema conceptual dentro de uno o varios dominios dados; con la finalidad de facilitar la comunicación y el intercambio de información entre diferentes sistemas y entidades.


#es Segura?


<h1>Ejemplo de Ontología</h1>


Ej:Ontología para el sw libre


Ej:Ontología para la web Semántica

http://bvs.sld.cu/revistas/aci/vol13_6_05/aci030605.htm


Programar una ontología


Casos de Estudio

http://www.w3.org/2001/sw/sweo/public/UseCases/


es Segura?Try {

Catch (ex Exception){ }


<p>Estamos en tiempos de cambios</p>

@documentalista_

-Conspiración en la Red Ryan Philip y Tim Robbins http://www.youtube.com/watch?v=I4PyJDiVcPw

Presione cualquier tecla para continuar... no, no, no, ESA NO!


<h1>Muchas @Gracias</h1>(en Binario: 01001101 01110101 01100011 01101000 01100001 01110011 00100000 01100111 01110010 01100001

01100011 01101001 01100001 01110011 )

@documentalista_


<h1>Referencias</h1>-Chuleta con todo en PHP: http://www.emezeta.com/weblog/emezeta-php-card-v0.2.png-Chuleta ASP: http://ult-tex.net/info/asp/asp_cheat_sheet.png-Chuleta SQL : http://mario21ic.files.wordpress.com/2008/08/mysql_cheat_sheet.png-Chuleta JavaScript: http://nomikos.info/wp-content/uploads/2010/06/javascript-cheat-sheet-v1.png-Estimación proyectos web. http://www.upv.es/~jmontesa/eog-ind.html-Red Social Elgg: http://www.magarciaguerra.com/2010/04/como-crear-una-red-social-con-elgg/-Blog WordPress http://www.magarciaguerra.com/2010/02/crea-una-red-social-de-profesores-para-tu-centro/-Tecnologías WEB. http://www.slideshare.net/aalbanes/tecnologas-web-OWL. http://swoogle.umbc.edu/-Standard w3c. http://www.w3c.es/divulgacion/guiasbreves/websemantica-ISOCO http://www.isoco.com/-Herramienta Ontologías. http://protege.stanford.edu -Dolors Reig. El caparazon. http://www.dreig.eu/caparazon/-Aprender a programar y no morir en el intento: www.comolohago.cl

clase programación web

Education

tecnologa y

anlisis y

saco y voy

mquina y

corriente y

huevo y salto

cocina y voy

hay sartn