“Año de la Diversificación Productiva y del Fortalecimiento de la Educación”

UNIVERSIDAD NACIONAL DE PIURA FACULTAD DE INGENIERIA INDUSTRIALESCUELA DE INGENIERIA INFORMATICA

INFORME DE LA APLICACION

DOCENTE: Dr. MOISES SAAVEDRA ARANGO

ALUMNO: Calle Garcia, Jairo Dario

TRABAJO REALIZADO EN EL AREA DE TECNOLOGIA MOVIL

CHULUCANAS 2015

INTRODUCCION

El presente informe de la aplicación, se detallara como se ha desarrollado, las librerías

usadas, los programas que se han utilizado para poder así llegar a construir la

aplicación.

La aplicación se basa en un catálogo de equipos celulares, donde el cliente podrá

observar los diferentes modelos y también podrá observar los planes que están

disponibles para cada equipo

Además de poder observar las características de los mismos.

Esta aplicación es solo para dispositivos móviles ya que el framework jquery mobile

nos permite hacerlo posible, también el uso de html5, JavaScript y php, ha permitido

que la aplicación se concrete.

Contenido

Herramientas utilizadas

En esta aplicación se han utilizado las siguientes herramientas

Xamp

es un servidor independiente de plataforma, software libre, que consiste principalmente

en el sistema de gestión de bases de datos MySQL, el servidor web Apache y los

intérpretes para lenguajes de script: PHP y Perl. El nombre proviene del acrónimo

de X (para cualquiera de los diferentes sistemas

operativos), Apache, MySQL, PHP, Perl.

El programa está liberado bajo la licencia GNU y actúa como un servidor web libre,

fácil de usar y capaz de interpretar páginas dinámicas. Actualmente XAMPP está

disponible para Microsoft Windows, GNU/Linux, Solaris y Mac OS X.

Php

es un lenguaje de programación de uso general de código del lado del servidor

originalmente diseñado para el desarrollo web de contenido dinámico

SublimeText3

Sublime Text es un editor de texto sofisticado para el código, marcado Sublime Text

utiliza un conjunto de herramientas de interfaz de usuario personalizada, optimizado

para la velocidad y belleza, aprovechando la funcionalidad nativa en cada plataforma

JQuery mobile

Es un Framework optimizado para dispositivos táctiles (también conocido como

Framework móvil) que está siendo desarrollado actualmente por el equipo de proyectos

de jQuery. El desarrollo se centra en la creación de un Framework compatible con la

gran variedad de smartphones y tablets, algo necesario en el creciente y heterogéneo

mercado de tablets y smartphones. El Framework de jQuery Mobile es compatible con

otros frameworks móviles y plataformas como PhoneGap y Worklight entre otros.

JavaScript

(abreviado comúnmente "JS") es un lenguaje de programación interpretado, dialecto del

estándar ECMAScript. Se define como orientado a objetos,3 basado en prototipos,

imperativo, débilmente tipado y dinámico.

Se utiliza principalmente en su forma del lado del cliente (client-side), implementado

como parte de un navegador web permitiendo mejoras en la interfaz de usuario y

páginas web dinámicas aunque existe una forma de JavaScript del lado del servidor

(Server-side JavaScript o SSJS). Su uso en aplicaciones externas a la web, por ejemplo

en documentos PDF, aplicaciones de escritorio (mayoritariamente widgets) es también

significativo.

Json

JSON, acrónimo de JavaScript Object Notation, es un formato ligero para el

intercambio de datos. JSON es un subconjunto de la notación literal de objetos de

JavaScript que no requiere el uso de XML.

Modelado de la base de Datos

En la imagen se muestra como están relacionadas las tablas de la base de Datos llamada

“proyectomóvil”.

Configuración de la Aplicación

En esta sección se detallara paso a paso como se ha configurado la aplicación:

1. En la imagen se muestra, los estilos que tendrá la aplicación todos ya están

definidos en jquery mobile.

2. En esta librería se importan todos los js (base)

3. Con esta librería se importan todos los JS de jquery mobile

4. Este JS es el que contendrá las funciones que harán posible que se muestre en

una list view de jquery mobile

5. En el siguiente código se muestra el acceso a la base de datos

6. En el siguiente código se mostrara como se crea un arreglo y como se recorre

asignando variables para cada campo de la tabla en este caso la tabla es producto

Además con el echo json_encode($datos) es el formato de como se enviara la

información en este caso será una cadena

7. En el siguiente código se muestra como se recibe la cadena Json y como se van a

listar los datos en un elemento list view

Mapa de navegación

Aquí se muestra el mapa de navegación de la aplicación que es como se observa en la

figura

TIM

Mostrar equipos

Buscar equipo

Listar equipo

Muestra descripción

Muestra planes

FUNCIONES MÁS IMPORTANTES

1. Código de interacción con la base de datos

2. En esta imagen se muestra cómo se va a crear un array y como este se recorre , además se asigna una variable para cada campo que se va a listar

3. código que mostrara el contenido de la base de datos en una tabla

Diagrama uml

En este diagrama como se trata de un catálogo el cliente solo podrá tener las acciones de

buscar los equipos y podrá observar una lista de todos los equipos

Interfaces de usuario

1 En la imagen se muestra la pagina principal

Metodología de desarrollo de la aplicación

La metodología utilizada en esta aplicación es la metodología incremental porque a partir del programa inicial, se le ha ido agregando más funcionalidades en cada iteración, esta metodología se basa que a partir del programa base, este adquiere nuevas funcionalidades en cada iteración que se realiza.

Patrón utilizado

En esta aplicación se ha utilizado el patrón MVC ya que el modelo son las funciones hechas en php, la vista serán todas las paginas HTML que se han creado para la aplicación y el controlador será el jsmobile3.js en la aplicación ya que este interactúa con php enviándole la información para que se muestre en la vista.

Conclusiones

Se utilizó el framework jquery Mobile, ya este nos permite darle a la aplicación un diseño que sea acorde con los dispositivos móviles.

Jquery Mobile viene con estilos ya predefinidos que han sido de mucha ayuda al momento de construir la aplicación ya que este tiene estilos para cada elemento a utilizar por ejemplo: las tablas, formularios ,listas,etc

En la aplicación el uso de php y JavaScript ha sido fundamental ya que su interacción con jquery Mobile ha permitido que la aplicación pueda acceder a la base de datos y poder mostrar información de ella.

Json se utilizó para poder enviar una cadena ya que al ser un formato ligero permite construir aplicaciones más rápidas e interactivas.

En algunos casos al aplicar los temas de jquery Mobile algunos de ellos no funcionan para ciertos navegadores.

Recomendaciones

Se recomienda que al momento de enviar los datos a php desde JavaScript se utilizó json ya que es un formato ligero que nos va a permitir interactuar más fácilmente.

Es importante revisar los demos que tiene jquery Mobile ya que estos nos aportaran una idea para trabajar con los distintos elementos que existen dentro de jquery Mobile.