Unidad I

Introducción

Objetivo

Comprender los conceptos del paradigma de la

programación declarativa.

Comprender los elementos de la arquitectura de

aplicaciones web

Comprender los fundamentos para la administración

del desarrollo web
 Unidad I
1.1. Paradigma de la programación declarativa y lenguajes usados.

Conceptos
Lenguaje de programación
es
Lenguaje formal

Lenguaje formal, es decir que se compone de letras símbolos, punto y

coma y reglas para unir esos símbolos.
Los símbolos sería el alfabeto y las reglas la sintaxis o la semántica
Programa
Conjunto de instrucciones escritas
en un lenguaje de programación ,
de modo que puedan ser
ejecutadas por una computadora.

Es la forma en la que le decimos a la computadora como es que queremos que se

comporte

Programación
Proceso que
permite escribir
(codificar) en un
lenguaje de
programación
instrucciones para
la computadora
 Unidad I
Paradigma

Todo aquel modelo, patrón o ejemplo que debe seguirse en

determinada situación.

Una teoría o conjunto de teorías que sirve de modelo a seguir para

resolver problemas o situaciones determinadas que se planteen.
(Normas, reglas)
 Unidad I

Ejemplos de paradigmas
 Unidad I

La programación generalmente viene en diferentes colores, sabores y olores;

es tan diversa como uno se lo pueda imaginar. A esta diversidad en el mundo
de la programación se le conoce como paradigmas o estilos de
programación.
 Unidad I
Estos distintos lenguajes de programación se basan en diferentes formas de
estructurar y desarrollar el software.
Cada uno tiene sus ventajas y desventajas
Cada uno se adecua a diferentes situaciones

Programación orientada a objetos :pretende

Programación representar todo lo que nos rodea en
estructurada objetos que interactúan y se relacionan
Modelar la realidad entre sí, estos objetos pueden representar
con procedimientos cualquier cosa, desde una cosa física y
secuenciales. tangible como una persona hasta cosas
Lenguaje C intangibles como la imaginación, un proceso
químico, una fecha, un algoritmo
matemático. Java, Phyton.
 Unidad I
Programación declarativa

Es un estilo de programación en el que el programador no dice “cómo” llegar a

obtener la solución de un problema (es decir, las instrucciones necesarias para
llegar a ella) sino “qué” define esa solución.

Consiste en decirle a
un programa lo qué SELECCIONAR nombre
tiene que hacer en DE empleados
lugar de decirle cómo DONDE nombre =“Juan”
debería hacerlo. Productos

¿Cómo se logra esto?

Por medio de un lenguaje específico

de dominio (DSL, del inglés Domain-
specific lenguage) que expresa lo
que el usuario quiere.
 Sin duda la herramienta de programación declarativa
más efectiva son las bases de datos relacionales

Su principal característica es que tiene un Lenguaje Específico de Dominio (DSL)

Un Lenguaje Específico de Dominio

(DSL): la interface universal para
bases de datos relacional es el
Lenguaje estructurado de consultas
mejor conocido como SQL.

Lenguajes usados Prolog, PHP JSP

 Unidad I
1.2. Arquitectura de las aplicaciones web.

Conceptos

Arquitectura: forma de integrar un grupo de componentes y servicios informáticos.

 Unidad I
Arquitectura cliente servidor.

La arquitectura tradicional de cliente/servidor también es conocida como arquitectura de dos capas.

Interfaz y Servidor

Requiere una interfaz de Cliente: es quien

usuario que se instala y inicia un
se ejecuta en una requerimiento
computadora de servicio

Servidor: computadora
El cliente envía solicitudes
especializada cuyo software
a un servidor para ejecutar
proporciona servicios a
operaciones complejas.
otras computadoras o
usuarios, que se conocen
como «clientes».
1.2.1. Modelo Cliente-Servidor de 3 capas Unidad I
(Datos, lógica de negocio y presentación).

Las aplicaciones Web suelen estar formadas

por 3 capas

Capa 1: Cliente de aplicación: Navegador Web.

Navegador: (browser) Aplicación que permite acceder a páginas

web y navegar por una red informática.
 Unidad I
Capa 2: Servidor de Aplicaciones: Apache, Servidor Tomcat.

Alojan aplicaciones web (programas que se ejecutan en un navegador

web) para que los usuarios de la red ejecuten y usen estas
aplicaciones sin tener que instalarlas en sus computadoras.
 Unidad I
Capa 3: Servidor de Datos: base de datos

Mantienen y comparten cualquier tipo de base de datos

(recopilaciones de datos organizados con propiedades predefinidas) a
través de la red

Servidor Base de datos

Navegador
 Unidad I
1.2.2. Modelo Vista Controlador. (MVC) Model, View, Controller

Es un tipo de arquitectura de software que va a permitir tener todos los

elementos que interactúan en la aplicación de manera aislada, lo que
permitirá que las aplicaciones sean mantenibles y escalables.
Es decir, su mantenimiento va a ser fácil y podrán agregarse nuevos
módulos a la aplicación.

Modelo
Petición HTTP
Consulta acciones

Respuesta HTTP Resultado de la consulta

Controlador

Resultado visual Resultado de la consulta de datos

Vista
 Unidad I
Modelo: este componente se encarga de
manipular, gestionar y actualizar los datos.
Si se utiliza una base de datos aquí es
donde se realizan las consultas,
búsquedas, filtros y actualizaciones

Vista: este componente se encarga de

mostrarle al usuario final las pantallas,
ventanas, páginas y formularios; el resultado
de una solicitud. Desde la perspectiva del
programador este componente es el que se
encarga del frontend; la programación de la
interfaz de usuario si se trata de un
aplicación de escritorio, o bien, la
visualización de las páginas web (CSS, HTML,
HTML5 y Javascript).
 Unidad I

Controlador: este componente se encarga de gestionar las

instrucciones que se reciben, atenderlas y procesarlas. Por medio
de él se comunican el modelo y la vista: solicitando los datos
necesarios; manipulándolos para obtener los resultados; y
entregándolos a la vista para que pueda mostrarlos
 Unidad I
1.3. Conceptos de interfaces

Interfaz de programación de aplicaciones ( API)

API : son un conjunto de reglas (código) y especificaciones que
las aplicaciones pueden seguir para comunicarse entre ellas
Permiten hacer uso de funciones ya existentes en otro
software (o de la infraestructura ya existente en otras
plataformas) para no estar reinventando la rueda
constantemente, reutilizando así código que se sabe que está
probado y que funciona correctamente.
 Unidad I
Por ejemplo, cuando el usuario compra entradas a través de la página web de una
sala de cine e introduce la información de su tarjeta de crédito, la web usa una API
para enviar dicha información de forma remota a otro programa que verifica si los
datos bancarios son correctos. Una vez que se confirma el pago, la aplicación
remota envía la información al sitio web del cine y le da un «OK», por lo que esta
página emite los tickets.

En todo ese proceso, el usuario solo ve una cara del proceso, la página del cine,
pero tras bambalinas hay muchas aplicaciones que se están comunicando gracias a
las API.

Solicitud de pago de boletos

BBVA
cine
Autoriza o rechaza solicitud
 Unidad I
1.4.1 UML

Modelado de procesos con UML

Introducción

En todas las actividades que desarrollamos en

nuestra vida, estamos rodeados de procesos.
Entendiendo como proceso una sucesión de
acciones continuas regulares que nos llevan a
cumplir algún objetivo.
Algunos ejemplos pueden ser: hacer un
pastel, cambiar la llanta de un automóvil,
bañarnos.
Dentro de las organizaciones es muy
importante mantener el control de los
procesos ya que esto permite conocer las
áreas problemáticas y susceptibles a mejoras.
 Unidad I
Concepto de proceso de negocio

Los procesos de negocio pueden ser vistos como un conjunto de

actividades cuyo objetivo es satisfacer las necesidades de todos los
agentes ligados a la organización (proveedores, empleados, clientes,
terceros).

Un proceso de negocio es la forma en la que el trabajo está organizado,

coordinado y enfocado a producir un producto o servicio.

Ejemplos

Manufactura y producción: el producto se

ensambla, se verifica la calidad se entrega el
producto
 Unidad I

Ventas: identifica a los clientes, identifica necesidades, le

vende producto

Recursos humanos: Contabilidad y finanzas: paga a

contrata empleados, los acreedores, controla los
evalúa su estados financieros y administra
desempeño el efectivo
 Unidad I

Sistemas: análisis, desarrollo y mantenimiento

de software que mejore los procesos de la
organización.

Para realizar estas actividades se tendrá que

basar en diferentes metodologías

Una metodología son una serie de pasos que se

deben de seguir para lograr un objetivo
 Unidad I
¿Qué es UML?

El Lenguaje de Modelamiento Unificado (UML - Unified Modeling

Language) es un lenguaje gráfico para visualizar, especificar y
documentar cada una de las partes que comprende el desarrollo
de software.
UML entrega una forma de modelar cosas conceptuales como lo
son procesos de negocio y funciones de sistema.
Entre sus principales diagramas podemos mencionar:
Diagrama de caso de uso
Diagrama de clases
Diagrama de actividades.
 Unidad I

Elementos que intervienen en el diseño UML

Actividad

Conjunto de operaciones o tareas propias de

una persona o entidad.

Actor Es el elemento encargado de realizar la

actividad.
Pueden ser individuos, grupos de
personas o departamentos
organizacionales.
 Unidad I
Objetivo

El objetivo de una actividad es una característica

propia que (Meta del proceso) indica el propósito de
su existencia dentro del negocio al que pertenece

Acciones
Efecto que causa un agente sobre algo. ( cortar
la tela, medir, cocer ) Tareas que realiza una
persona.
 Unidad I
Recursos
Un recurso es todo aquello que es usado o
afectado por las actividades. A menudo son
consideradas entradas, salidas o resultados

Rol
Los participantes deben asumir un cierto papel
de acuerdo al contexto y cumplir con diversas
tareas de acuerdo a este papel.
Función que cumple cada cual en una actividad
En la vida diaria una mujer puede ser madre,
esposa, empleada y en cada “rol” desempeña
diferentes actividades
 Unidad I
Interacciones (Relaciones )

Es una acción recíproca entre dos o más

objetos, sustancias, personas o agentes.

Disparadores

Evento que causa una transición (un cambio).

La “causa” de algo.
 Unidad I
1.4.2 Diagramas de diseño (Wireframe, Mock-up)

Wireframe: organiza el contenido de un sitio web.

Representación de un diseño.
Esta herramienta te indica que tienes que hacer un boceto para
organizar los elementos que vas a presentar en una página web.
 Unidad I
Un wireframe o prototipo no es más que un boceto donde se
representa visualmente, de una forma muy sencilla y esquemática la
estructura de una página web.

El objetivo de estos es definir el contenido y la posición de los

diversos bloques de una página web. Esto incluye menús de
navegación, bloques de contenido, etc… Además, permite
visualizar como interactuarán estos elementos entre sí.
 Unidad I
En los wireframes no se utilizan ni colores, ni tipografías ni
cualquier elemento gráfico. Lo importante es centrarse en la
funcionalidad del sitio y la experiencia del usuario. La prioridad
son los contenidos de la web.

Existen herramientas gratuitas on line que permiten hacer el

diseño o modelado de la página web.

Wireframe.cc

Mockflow

Axure

MockPlus

HotGloo
 Los Mock Ups Unidad I
Son fotomontajes que permiten a los diseñadores gráficos y web mostrar
al cliente cómo quedaran sus diseños.

el mockup es un diseño de calidad media o alta. Hay más colores, diferentes tipos de letra, fondos…
en definitiva, todo aquello que permita representar la estructura de la información y demostrar las
funcionalidades básicas.