Instituto Tecnolgico de ChetumalIngeniera en Sistemas Computacionales

FrameWork para desarrollo WEB

Unidad 1 Estrategias de Reutilizacin

1.1 Introduccin

La ingeniera del software basada en reutilizacin es una estrategia de ingeniera del software comparable en la que el proceso de desarrollo es adaptado a la reutilizacin del software existente.

Si bien los beneficios de la reutilizacin han sido reconocidos durante muchos aos, solo en la ltima dcada ha existido una transicin gradual desde el desarrollo del software original hasta el desarrollo basado en la reutilizacin. La tendencia hacia el desarrollo basado en la reutilizacin viene dada como respuesta a las demandas de una menor produccin de software y de menores costos de mantenimiento, de una entrega ms rpida de los sistemas y del incremento en la calidad del software.

Cada vez ms compaas ven su software como un activo valioso y estn promocionando la reutilizacin para incrementar sus beneficios en las inversiones del software.

Las unidades de software que se reutilizan pueden ser de tamaos totalmente diferentes:

Reutilizacin de sistemas de aplicaciones: Puede ser reutilizada incorporndolos sin ningn cambio en otros sistemas, configurando la aplicacin para diferentes clientes.

Reutilizacin de componentes: Vara en tamao desde subsistemas hasta objetos simples.

Reutilizacin de objetos y funciones: Pueden reutilizarse componentes software que implementan una nica funcin.

Una forma complementaria de reutilizacin es la reutilizacin de conceptos, en la que en lugar de reutilizar un componente, la entidad reutilizada es ms abstracta y se disea para ser configurada y adaptada a una variedad de situaciones. Puede incluirse tanto en patrones de diseo, productos de sistemas configurables y generadores de programas. La gran ventaja es que los costos de desarrollo deberan reducirse.

Seguidamente se muestra una tabla con una serie de ventajas e inconvenientes que existe en el proceso de reutilizacin del software:

VENTAJASDESVENTAJAS

Incremento de la confiabilidadIncremento en los costos de mantenimiento

Reduccin del riesgo del procesoFalta de soporte de las herramientas

Uso efectivo de especialistasSndrome de reinventar la rueda

Cumplimiento de estndaresCreacin y mantenimiento de una librera de componentes

Desarrollo aceleradoBsqueda de componentes

EL CAMPO DE REUTILIZACIN

Se explota el hecho de que los sistemas del mismo dominio de aplicacin son similares y tienen potencial para la reutilizacin. Esta reutilizacin es posible a diferentes niveles desde funciones simples a funciones completas. Los factores clave que deberan de considerarse a la hora de planificar la reutilizacin son:

La agenda de desarrollo del software: Son activos reutilizables de grano grueso (difcil de modificar).

Vida esperada del software: Si se est desarrollando un sistema de larga vida, habra que centrarse en la mantenibilidad del sistema. Se tendr que adaptar el sistema a nuevos requerimientos, lo cual probablemente signifique hacer cambios a los componentes y sistemas de proveedores. Los conocimientos, habilidades y experiencia del grupo de desarrollo: Todas las tecnologas de reutilizacin son bastante complejas y se necesita bastante tiempo para comprenderlas y usarlas de forma efectiva. Los aspectos crticos del software y sus requerimientos no funcionales: Se tiene que crear un caso de confiabilidad para el sistema. Esto es difcil si no se tiene acceso al cdigo fuente del software. El dominio de las aplicaciones: En algunos dominios de aplicaciones como los sistemas de informacin medica y de fabricacin hay varios productos genricos que pueden reutilizarse para configurarlos a una situacin particular. La plataforma sobre la que el sistema se va ejecutar: Los sistemas de aplicaciones genricos pueden ser plataformas especificas y solamente es posible reutilizarlos si el sistema se disea para la plataforma.

Ejercicio 1.1

Despus de la lectura de las hojas anteriores el alumno entregar en equipo de no ms de 5 integrantes lo siguiente:

Una conclusin en la que determine que es un Framework y cual es es el mayor beneficio de su uso, as mismo especificar que tan conveniente es usarlo en el desarrollo de un Sistema Computacional.

PATRONES DE DISEO Los patrones de diseo se derivaron de las ideas introducidas por Christopher Alezander, quien sugiri que existan ciertos patrones del diseo de edificios que eran comunes e inherentemente interesantes y efectivos.

1.2 Patrones de Diseo

Patrones de diseo o ms comnmente conocidos como "Design Patterns". Son soluciones simples y elegantes a problemas especficos y comunes. Son soluciones basadas en la experiencia y que se ha demostrado que funcionan. Es evidente que a lo largo de multitud de diseos de aplicaciones hay problemas que se repiten o que son anlogos, es decir, que responden a un cierto patrn. Sera deseable tener una coleccin de dichos patrones con las soluciones ms ptimas para cada caso. Los patrones de diseo no son fciles de entender, pero una vez entendido su funcionamiento, los diseos sern mucho ms flexibles, modulares y reutilizables. Han revolucionado el diseo orientado a objetos y todo buen arquitecto de software debera conocerlos. El trmino patrn de diseo no es extremadamente preciso pero s muy til. En la forma en la que se suele entender actualmente, fue acuado en Gamma y col. (1994), importante referencia que se suele designar abreviadamente como GoF.

Por la manera en que se emplea este concepto en esta referencia bsica y en la mayora de usos posteriores, se refiere a una manera especialmente inteligente y perspicaz de resolver un tipo general de problema.

A pesar de constar el trmino diseo no se suele considerar que se refiera nicamente a la fase de diseo de un programa, es una solucin completa que incluye anlisis, diseo e implementacin. Un patrn de diseo no se considera bien especificado hasta que se ha podido plasmar en forma de cdigo en algn lenguaje, pero claramente no es una convencin o receta idiomtica, ligada a un lenguaje concreto, como podra la relacionada con cmo recorrer de forma eficiente un vector en C empleando aritmtica de punteros, por poner un ejemplo. Sin embargo, en GoF se remarca que un patrn puede serlo, tener sentido identificarlo como tal o no, dependiendo del lenguaje utilizado. En el lenguaje de implementacin elegido en GoF, C++, un patrn como herencia no tiene sentido (ya est implcito en el propio lenguaje) mientras que sera una solucin general muy adecuada a numerosos problemas si el lenguaje de implementacin fuese C, por ejemplo. En un mbito de problemas y de conceptos ms cercano a la Estadstica, y que trataremos con mayor detalle ms adelante, un patrn de diseo muy comn como objeto funcin segn la terminologa de Eckel(2003) o comando segn la terminologa de GoF, tiene sentido en Java o en C++, pero no en Python, donde todo, y en concreto cualquier mtodo o funcin miembro, es un objeto.

Lista con los patrones de diseo a objetos ms habituales publicados en el libro "Design Patterns", escrito por los que comnmente se conoce como GoF (gang of four, "pandilla de los cuatro").

Abstract Factory.

Proporciona una interfaz para crear familias de objetos o que dependen entre s, sin especificar sus clases concretas.La idea detrs del patron Abstract Factory (que en espaol se traducira como fabrica abstracta) consiste en la nocin de que nuestro programa (o el cliente de una clase que nosotros proporcionamos) trabaja con una serie de productos (como los de una fbrica) que tienen unas determinadas caractersticas (por ejemplo tenemos productos embotellados y productos en tetrabrick). Nuestro programa va a utilizar dichos productos realizando una serie de acciones sobre ellos (como meter las botellas en unos camiones y los tetrabricks en otros) sin importarle quien le est suministrando los productos.As mismo existen una serie de fbricas que producen esos productos que vamos a tratar, una empresa fabrica cocacola y otra pepsi pero ambas en botellas de las que nuestro programa trata. Al final, el concepto bsico consiste en que a nuestro programa (o cliente) no le importa lo que haya dentro de la botella ni quien lo haya producido mientras sea una botella.Desde el punto de vista software el ejemplo anterior se traduce en una situacin en la que nuestro programa maneja un tipo de objetos con unas caractersticas comunes y algunas caractersiticas propias. Esto en general en software se resuelve mediante el uso de dos caractersticas de los lenguajes de programacin orientados a objetos, las clases abstractas y las interfaces.ProblemaEl patrn de diseo Abstract Factory aborda el problema de la creacin de familias de objetos (como por ejemplo iterfaces grficos) que comparten toda una serie de caractersticas comunes en los objetos que componen dichas familias.AplicabilidadEl uso de este patrn est recomendado para situaciones en las que tenemos una familia de productos concretos y prevemos la inclusin de distintas familias de productos en un futuro.De esta forma nuestro programa realiza unas ciertas operaciones sobre dichas caractersticas comunes sin importarle que otras caractersticas tenga el objeto en cuestin. Por otro lado existen distintos productores de dichos objetos. Un ejemplo muy tpico en muchos frameworks de programacin que sigue este patrn se da en el caso de las familias de interfaces grficos. As existen diversas fbricas de interfaces que proporcionan sus propios botones, campos de texto, listas desplegables, etc... Todas ellas basadas en los tipos bsicos. Los clientes obtienen una familia y proceden a utilizar los controles usando el tipo abstracto genrico que da soporte.Ejemplos realesFamilia de comunicacionesUn caso bastante comn es el similar al presentado en el ejemplo de cdigo, es decir, una familia de algoritmos de comunicacin por distintos medios que permiten el envo de informacin entre pares (por ejemplo). De esta forma nuestro programa puede usar comunicacin TCP, UDP o cualquier otro protocolo que se nos ocurra sobre un dispositivo no estandar o que no soporte IP.Interfaces grficosOtro caso relativamente comn de uso de este patrn se da en la creacin de familias de interfaces grficos en las cuales los elementos (productos) del interfaz se mantienen constantes (por ejemplo labels, botones, cajas de texto ...) pero el dibujado de dichos elementos puede delegarse en distintas familias (por ejemplo QT, GTK, etc) de forma que, en funcin de la fbrica seleccionada obtenemos unos botones u otros.Builder. Separa la construccin de un objeto complejo de su representacin, de forma que el mismo proceso de construccin pueda crear diferentes representaciones.Permite a un objeto (fuente) construir un objeto complejo especificando slo su tipo. El objeto constructor (fuente) se compone de una serie de partes que individualmente van formando el objeto complejo. As se abstrae el proceso de creacin del objeto complejo para que se puedan crear representaciones diferentes con el mismo proceso. Se nos pueden ocurrir muchos ejemplos para el patrn Builder, vehculos, recetas, electrodomsticos y cualquier cosa que est compuesta por muchas partes. Tambin se utiliza mucho para crear los objetos del patrn Composite (patrn estructural). El siguiente ejemplo va ensamblando los componentes de un ordenador segn el uso que le queramos dar. El patrn constructor sigue la misma idea que el patrn factora, pero no se encarga simplemente de devolver una clase, si no de construir una composicin de objetos entera, por compleja o sencilla que sea. El caso ms habitual es el de construir una interfaz de usuario, pero no se limita nicamente a componentes visuales.IntencinSeparar la construccin de un objeto complejo de su representacin de modo que el mismo proceso de construccin pueda crear diferentes representaciones.MotivacinLos objetos que dependen de un algoritmo tendrn que cambiar cuando el algoritmo cambia. Por lo tanto los algoritmos que estn expuestos a dicho cambio deberan ser separados, permitiendo de esta manera reutilizar algoritmos para crear diferentes representaciones.El patrn Builder se usa cuando: El algoritmo para creacin de un objeto complejo debe ser independiente de las partes que conforman el objeto y cmo estn ensambladas. El proceso de construccin debe permitir diferentes representaciones del objeto que se construye.2. Patrones de Diseo (Modelo Vista Controlador)El Modelo Vista Controlador es un patrn de diseo empleado por la mayora de Frameworks PHP para desarrollo web, existen tambin algunos lenguajes que lo implementan, en este punto analizaremos como aplica el Framework CodeIgniter este modelo, es interesante porque separa en varios grupos las complejidades de las distintas partes que componen una pgina web, como la vista y la lgica, as como el acceso a la base de datos. Quizs lo que ms nos lleva a cambiar nuestros hbitos de programacin en PHP es el hecho de tener que basar nuestros scripts en este modelo de programacin, que seguramente resultar novedoso sobretodo para los programadores veteranos, porque fija un nuevo estilo de desarrollo de aplicaciones, que nos obliga a separar cdigo fuente segn su mbito. Sin embargo, como hemos dicho anteriormente, estas nuevas costumbres de codificacin tambin nos ayudarn a que nuestros programas sean mejores y disfruten de varias ventajas como ser ms organizados, extendibles y entendibles por otros desarrolladores, reutilizables, y sobretodo algo muy importante: Facilitar el mantenimiento, etc. Para los que no lo conocen, el Modelo - Vista - Controlador (en ingls Model - View - Controller) es un patrn de desarrollo o un estilo de arquitectura de software que separa el cdigo fuente de las aplicaciones en tres grupos: Modelo: Este representa todo el cdigo que tiene que ver con el acceso a base de datos. En el modelo mantendremos encapsulada la complejidad de nuestra base de datos y simplemente crearemos funciones para recibir, insertar, actualizar o borrar informacin de nuestras tablas. Al mantenerse todas las llamadas a la base de datos en un mismo cdigo, desde otras partes del programa podremos invocar las funciones que necesitemos del modelo y ste se encargar de procesarlas. En el modelo nos podrn preocupar cosas como el tipo de base de datos con la que trabajamos, o las tablas y sus relaciones, pero desde las otras partes del programa simplemente llamaremos a las funciones del modelo sin importarnos qu tiene que hace ste para conseguir realizar las acciones invocadas. Vista: La vista codifica y mantiene la presentacin final de nuestra aplicacin de cara al usuario. Es decir, en la vista colocaremos todo el cdigo HTML, CSS, Javascript, etc. que se tiene que generar para producir la pgina tal cual queremos que la vea el usuario. En la prctica la vista no slo sirve para producir pginas web, sino tambin cualquier otra salida que queramos enviar al usuario, en formatos o lenguajes distintos, como pueden ser feeds RSS, archivos JSON, XML, etc. Controlador: El controlador podramos decir que es la parte ms importante, porque hace el enlace entre el modelo, la vista y cualquier otro recurso que se tenga que procesar en el servidor para generar la pgina web. En resumen, en el controlador guardamos la lgica de nuestras pginas y realizamos todas las acciones que sean necesarias para generarlas, ayudados del modelo o la vista. Como podr ver: Esto quiere decir que en la prctica para el caso de CodeIgniter, tendremos que escribir las lneas de cdigo de cualquier pgina web en tres grupos de archivos distintos. En una aplicacin estndar podremos tener varios modelos (por ejemplo, para cada una de las entidades distintas de la base de datos), varias vistas (una o varias para cada pgina o seccin) y varios controladores (para cada pgina o seccin de la web). Luego veremos dnde tenemos que guardar los archivos de cada uno de estos tres grupos. Durante el desarrollo con CodeIgniter ser muy recomendable seguir las normas del diseo Modelo - Vista - Controlador (MVC), pero realmente el framework es bastante flexible y permite que, si lo deseamos, no sigamos el desarrollo atendiendo a dicha arquitectura. En este caso, podramos tener simplemente controladores y dentro de ellos realizar todas las acciones de acceso a la base de datos directamente, sin hacer llamadas al modelo, o escribir texto en la salida sin utilizar las vistas. Obviamente, esta opcin no aprovechar las ventajas de separacin de cdigo entre presentacin, lgica y modelo de base de datos, pero si resulta muy complejo el MVC, se puede dejar de lado. En el caso que no utilizramos los modelos, no ocurrir ningn efecto negativo en el desempeo del framework, pero en el caso de las vistas, si no las utilizamos y escribimos salida directamente desde el controlador, como por ejemplo con sentencias echo de PHP en el cdigo de los controladores, perderemos algunas de las ventajas que CodeIgniter realiza por nosotros para procesar la salida antes de enviarla al usuario.Como sabemos, o podremos imaginar, separar la vista o presentacin de la lgica de los programas es una ventaja importante, ya que ayuda a mantener un cdigo ms sencillo, reducido y con mayor facilidad de mantenimiento. En principio puede parecer un tanto complejo el hecho de manejar varios archivos con cdigos distintos, pero a medio plazo nos vendr muy bien separar el cdigo de cada parte de nuestra aplicacin. Nos evitar muchos de los problemas que a veces tenemos en desarrollos PHP, donde en un mismo archivo tenemos mezclado cdigo en varios lenguajes como HTML, CSS, SQL, con el propio cdigo PHP para generar la lgica de nuestro negocio.

Aplicacin del modelo vista controlador en CodeIgniter

Ejercicio 1.2

Instalacin de CodeIgniter:

1. Descargar CodeIgniter y descompactar el archivo2. Descargar Xampp e Instalar3. Descargar SubLime Text 2 e Instalar 4. Mover el Directorio descompactado CodeIgniter al directorio htdocs de Xampp5. Abrir con SubLime Text 2 el directorio CodeIgniter y seleccionar config6. Abrir el archivo Config.php y modificar la lnea $config['base_url']= ''; por: $config['base_url']= 'http://localhost/codeigniter';

Puedes hacer el siguiente ejercicio, en la Opcin views, busca el archivo welcome_message.php y realiza los siguientes cambios:

1. Borrar lo que se encuentra dentro del hasta Te debe de quedar as:2. Borrar todo el estilo desde hasta 3. En la opcin agregamos lo siguiente:Framework para desarrollo WEB4. Abajo de pones:Bienvenido a CodeIgniter5. Salva todo y ejecuta nuevamente la pgina de iniciohttp://localhost/Codeigniter/

Tarea: 1.1

Investigar de manera individual que es:

1. CSS2. feeds RSS3. Archivos JSON4. Archivos XML

1. CSSEs una tecnologa que nos permite crear pginas web de una manera ms exacta. Gracias a las CSS somos mucho ms dueos de los resultados finales de la pgina, pudiendo hacer muchas cosas que no se poda hacer utilizando solamente HTML, como incluir mrgenes, tipos de letra, fondos, colores... CSS son las siglas de Cascading Style Sheets, en espaol Hojas de estilo en Cascada.2. Feeds RSSGracias a los feeds RSS de Google Noticias, puede obtener un acceso ms fcil a las actualizaciones de noticias sobre temas que le interesan. Hay feeds disponibles para todas las secciones de Google Noticias (como Deportes o Economa), para los resultados la bsqueda de Google Noticias o para las pginas personalizadas del programa. Si se suscribe a un feed de Google Noticias con un lector de feeds, recibir peridicamente un resumen actualizado de las noticias relevantes junto con enlaces a los artculos completos. Los feeds RSS de Google Noticias estn disponibles en formato RSS 2.0.Puede utilizar tanto los feeds de resultados de bsqueda como los feeds de secciones de Google Noticias y suscribirse a ellos. Para localizar los feeds de Google Noticias, busque el icono naranja de RSS en la parte inferior de cualquier pgina de Google Noticias. Haciendo clic en este icono de RSS, se puede obtener un feed de cualquiera de las secciones de Google Noticias. Por ejemplo, si hace clic en el icono de RSS situado en la parte inferior de la pgina de la seccin "Economa", se podr suscribir a un feed de noticias econmicas.Tambin es posible obtener un feed de cualquier bsqueda realizada en Google Noticias. Para ello, primero debe efectuar una bsqueda en Google Noticias y, a continuacin, hacer clic en el icono de RSS situado en la parte inferior de la pgina de resultados de bsqueda para que se genere el feed.

3. Archivos JSONJSON, acrnimo de JavaScript Object Notation, es un formato ligero para el intercambio de datos. JSON es un subconjunto de la notacin literal de objetos de JavaScript que no requiere el uso de XML.La simplicidad de JSON ha dado lugar a la generalizacin de su uso, especialmente como alternativa a XML en AJAX. Una de las supuestas ventajas de JSON sobre XML como formato de intercambio de datos en este contexto es que es mucho ms sencillo escribir un analizador sintctico (parser) de JSON. En JavaScript, un texto JSON se puede analizar fcilmente usando la funcin eval(), lo cual ha sido fundamental para que JSON haya sido aceptado por parte de la comunidad de desarrolladores AJAX, debido a la ubicuidad de JavaScript en casi cualquier navegador web.En la prctica, los argumentos a favor de la facilidad de desarrollo de analizadores o del rendimiento de los mismos son poco relevantes, debido a las cuestiones de seguridad que plantea el uso de eval() y el auge del procesamiento nativo de XML incorporado en los navegadores modernos. Por esa razn, JSON se emplea habitualmente en entornos donde el tamao del flujo de datos entre cliente y servidor es de vital importancia (de aqu su uso por Yahoo, Google, etc, que atienden a millones de usuarios) cuando la fuente de datos es explcitamente de fiar y donde no es importante el no disponer de procesamiento XSLT para manipular los datos en el cliente.Si bien es frecuente ver JSON posicionado contra XML, tambin es frecuente el uso de JSON y XML en la misma aplicacin. Por ejemplo, una aplicacin de cliente que integra datos de Google Maps con datos meteorolgicos en SOAP hacen necesario soportar ambos formatos.Cada vez hay ms soporte de JSON mediante el uso de paquetes escritos por terceras partes. La lista de lenguajes soportados incluye ActionScript, C, C++, C#, ColdFusion, Common Lisp, Delphi, E, Eiffel, Java, JavaScript, ML, Objective-C, Objective CAML, Perl, PHP, Python, Rebol, Ruby, Lua y Visual FoxPro.En diciembre de 2005 Yahoo! comenz a dar soporte opcional de JSON en algunos de sus servicios web.1El trmino JSON est altamente difundido en los medios de programacin, sin embargo, es un trmino mal descrito ya que en realidad es solo una parte de la definicin del estndar ECMA-262 en que est basado Javascript. De ah que ni Yahoo, ni Google emplean JSON, sino LJS[citarequerida]. Una de las cualidades intrnsecas de Javascript denominada LJS (Literal Javascript) facilita el flujo de datos e incluso de funciones, para la cual no requiere la funcin eval() si son datos los que se transfieren como en el caso de XML. Todo lo referente a transferencia de datos en todos sus tipos, incluyendo arrays, booleans, integers, etc. no requieren de la funcin eval(), y es precisamente en eso en donde supera por mucho JavaScript al XML, si se utiliza el LJS y no la incorrecta definicin de JSON.

4. Archivos XMLLa tecnologa XML busca dar solucin al problema de expresar informacin estructurada de la manera ms abstracta y reutilizable posible. Que la informacin sea estructurada quiere decir que se compone de partes bien definidas, y que esas partes se componen a su vez de otras partes. Entonces se tiene un rbol de pedazos de informacin. Ejemplos son un tema musical, que se compone de compases, que estn formados a su vez con notas. Estas partes se llaman elementos, y se las seala mediante etiquetas.Una etiqueta consiste en una marca hecha en el documento, que seala una porcin de este como un elemento. Un pedazo de informacin con un sentido claro y definido.Teniendo en cuenta esta definicin podremos definir un XML para una lista de temas musicales de esta manera: Tanto MUSICA como tema son ambas etiquetas!xml< view plain text > 1. 2. 3. Como pueden observar la informacin est fragmentada pero a su vez est organizada de manera secuencial y en un orden jerrquico, digamos que MUSICA es el padre de tema porque cada uno de los tema que son nodos se encuentra dentro de la etiqueta MUSICA que agrupa todos los hijos o nodos tema. Pero para que un archivo realmente cumpla con las normas de XML no solo debe respetar esta estructura jerrquica sino tambin debe incluir elementos obligatorios como es el tipo de codificacin de lenguaje o prlogo.xml< view plain text > 1. 2. 3. 4. Como pueden observar se agrego una nueva lnea en la parte superior del XML que cumple con la funcin de indicar el tipo de versin 1.0 y el tipo de codificacin de lenguaje utf-8 que en este caso es para poder nosotros usar alfabeto espaol dentro de la estructura del XML.

Ejemplos y ejecucin de programas Codeigniter

Cuando el usuario hace una peticin a una URL del proyecto, el controlador identifica a que URL se esta refiriendo, por lo general todos los procesos pasan por el archivo index.php de codeigniter, despus del archivo index.php puedes poner el nombre del controlador que quieras ejecutar y el ltimo parmetro que puedes poner es la funcin que se va a ejecutar de ese controlador, si no especificas ninguna funcin se va a ejecutar la funcin index.

Puedes hacer lo siguiente para probarlo:

1. Dentro de Sublime Text 2 posicinate en controllers, oprime el botn derecho del mouse y crea un nuevo controlador (archivo) de nombre welcome.php que contenga lo siguiente:

Programa welcome.php (Controlador)

/* Despues de hacer el form_submit('','Alta de Alumno') se va al controlador holamundo y ejecuta la funcin recibirdatos */

/* Establecemos el soporte para los acentos */

/** En el cdigo anterior declaramos tres arreglos ($ncontrol, $nombre y $correo) y dentro de cada uno asignamos a name el valor de una variable y a placeholder el dialogo que queremos que se visualice cuando se teclea el dato solicitado. **/

/** En las dos lneas anteriores hacemos lo siguiente: Con form_label escribimos el mensaje del dato que vamos a solicitar y a continuacin desplegamos la variable, posteriormente leemos el dato. **/

/** Damos un salto de lnea **/

/** Hacemos lo mismo para Nombre **/

/** Otro salto **/

/** Y lo mismo para correo **/

/** Tambien un salto para separar el texto **/

/** Ponemos el botn con el mensaje 'Alta de Alumno' y cuando lo opriman ejecutaremos la funcin recibirdatos del controlador holamundo */

/** Cerramos la forma **/

/** Cerramos el body **/

/** Cerramos el html **/

Posterior a la creacin del formulario, creamos el controlador, este se encargar entre otras cosas de cargar los archivos, programas o clases necesarias, ah encontraras la carga del formulario, la carga de la vista (views) y la carga del modelo.

A continuacin se muestra el controlador usado para este ejemplo:

**/

$data = array(/** Creamos un arreglo de nombre data ($data) y le asignamos los valores tecleados en el formulario (ncontrol, nombre y correo) **/'ncontrol' => $this->input->post('ncontrol'),'nombre' => $this->input->post('nombre'),'correo' => $this->input->post('correo'));

$this->itch_model->crearCurso($data);/** Ejecutamos la funcin crearCurso del modelo itch (itch_model) y le enviamos la variable data ($data).}}?>

Veamos como nos debe quedar el modelo (itch_model)

Sintaxis del $this ->db->insert:$data = array('title' => 'My title' ,'name' => 'My Name' ,'date' => 'My date');

$this->db->insert('mytable', $data);

// Produces: INSERT INTO mytable (title, name, date) VALUES ('My title', 'My name', 'My date')

Consultando Datos

Para poder realizar un proceso de consulta, ser necesario agregar lo siguiente:

En primera instancia creo que es necesario ordenar un poco nuestro controlador principal para no sobrecargarlo y adems usar nombres de clases, funciones y variables ms acorde con el proceso, iniciaremos cambindole de nombre al controlador principal y efectuando algunas modificaciones de tal forma que quede de la siguiente manera:

Si te das cuenta en el controlador se agrego una funcin de nombre index, en ella se declara una variable $data['alumnos'] = $this->itch_model->leealumnos(); y se ejecuta la funcin leealumnos() del modelo, esperando que esta funcin consulte los datos de la tabla alumnos y los retorne en la variable declarada, para posteriormente enviaselos a la vista de nombre alumnos para su impresin en pantalla.

Vista: alumnos.php

Controlador: itchpublic function index(){$data['segmento'] = $this->uri->segment(3);if(!$data['segmento']){$data['alumnos'] = $this->itch_model->leealumnos();}else{$data['alumnos'] = $this->itch_model->leealumno($data['segmento']);}$this->load->view('alumnos',$data);}

Modelo: itch_modelfunction leealumno($id){$this->db->where('id',$id);$query = $this->db->get('alumnos');if($query->num_rows() > 0) return $query;else return false;}function leealumnos(){$query = $this->db->get('alumnos');if($query->num_rows() > 0) return $query;else return false;}

Vista: alumnos

Vista funcion1

Vista funcion2

Vista index

Ahora observe los siguientes cambios que se hicieron al controlador:

Controller home

Como podr ver hemos creado una vista de nombre template con la que configuramos nuestro entorno y posteriormente la ejecutamos envindole como parmetro la vista que queremos ejecutar.

Vista template

Trabajando con templates

Y observe el resultado que se obtiene:

Instalacin y activacin de Bootstrap

Despus de haber realizado los primeros ejemplos con Codeigniter integraremos Bootstrap a nuestra aplicacin, esto nos permitir trabajar todo lo relacionado con las vistas de una manera ms sencilla.

Antes de continuar nos detendremos unos minutos para entender que es realmente Bootstrap

En pocas palabras es el Framework de Twitter que permite crear interfaces web con CSS y Javascript que adaptan la interfaz dependiendo del tamao del dispositivo en el que se visualice de forma nativa, es decir, automticamente se adapta al tamao de un ordenador o de una Tablet sin que el usuario tenga que hacer nada, esto se denomina diseo adaptativo o Responsive Design. Aun ofreciendo todas las posibilidades que nos da Bootstrap a la hora de crear interfaces web, los diseos son simples, limpios e intuitivos, esto les da agilidad a la hora de cargar y al adaptarse a otros dispositivos. El Framework trae varios elementos con estilos predefinidos fciles de configurar: Botones, Mens desplegables, Formularios incluyendo todos sus elementos e integracin, jQuery para ofrecer ventanas y tooltips dinmicos.En su GitHub oficial puedes encontrar pginas con toda la informacin necesaria para utilizar Bootstrap en tus proyectos web, adems tambin puedes encontrar ejemplos de utilizacin.Claramente el mejor ejemplo de utilizacin de Bootstrap es Twitter, pero existen otros sitios que implementan diseos responsive basados en este Framework.

Para descargar bootstrap entraremos en su pagina web: http://twitter.github.io/bootstrap/Una vez descargado y abierto podremos observar la estructura de archivos que tiene, bsicamente son tres carpetas:Copiamos y pegamos en el directorio raz de nuestro proyecto las tres carpetas.CREACION DE UNA PLANTILLAA continuacin crearemos un controlador nuevo llamado acerca_de. 1234public function acerca_de(){$this->load->view('home/acerca_de');}

Creamos la vista acerca_de, por ahora podemos usar index.php y guardarla con otro nombre.Empezamos por crear una vista en la carpeta views con el nombre template.php y aadimos el siguiente cdigo que hemos descargado de la pagina de Bootstrap.12345678910111213141516171819202122232425262728

Borramos todo de las paginas acerca_de e index y colocamos solo el nombre de cada una en encabezado 1. Ejemplo de index: 1 Pgina Inicio

1234567 Pgina Acerca De Donec ullamcorper nulla non metus auctor fringilla.

Large button Large button

Probamos a ver como queda acerca_de:A continuacin cargaremos o generaremos el archivo jquery.js

Observa que el jquery lo puedes ejecutar va Internet aunque desde mi punto de vista no es lo ms recomendable, lo mejor es descargarlo y pegarlo a tu aplicacin como archivo, para tal fin se requiere hacer lo siguiente:

1. Dirgete a la pgina de jquery (http://jquery.com/) y selecciona lo siguiente:

Posteriormente elige: Te mostrara un cdigo muy raro pero en el inicio encontraras algo como esto: /*! jQuery v1.11.0 | (c) 2005

Seleccinalo todo, completo para que lo puedas copiar a un archivo.

Crea en la carpeta js un nuevo archivo de nombre jquery.js

Y pega todo el contenido que copiaste

A continuacin te muestro la imagen de un template.

Ejemplos de Mantenimiento a tablas de base de datos

Creamos la Base de Datos itch y la tabla Alumnos con la siguiente estructura:

Recordemos como debe de estar nuestro archivo database.php que se encuentra en la carpeta config:

Iniciaremos con el listado de nuestro controlador principal de nombre itch:

Ahora listaremos nuestro template principal: