27 enero, 2009

Empezando con CodeIgniter

Nota: He traducido el tutorial de Kohana, derivado de CodeIgniter y al que algunos consideran una mejora considerable sobre éste.
He traducido este excelente tutorial sobre la librería PHP CodeIgniter por Ben Haines.

CodeIgniter es una librería de aplicaciones web para PHP. Permite a los desarrolladores construir aplicaciones web más rápidamente, y ofrece útiles librerías de código y atajos que aceleran las tareas tediosas en PHP. CodeIgniter se basa en un diseño modular (lo que quiere decir que puedes implementar librerías específicas a voluntad) lo que repercute en una mayor velocidad del sistema. Este tutorial intentará mostrar los pasos básicos de instalar la librería, incluyendo como construir una aplicación web básica hola mundo que utiliza un enfoque MVC.

¿Por qué una librería?


Las librerías permiten estructurar las aplicaciones al desarrollarlas ofreciendo clases reusables y funciones que pueden reducir significativamente el tiempo de desarrollo. Algunas pegas de las librerías es que ofrecen clases no necesitadas, añadiendo exceso de código que dificulta encontrar las cosas.

¿Por qué CodeIgniter?




Lo básico de CodeIgniter

CodeIgniter es una librería muy ligera con buen rendimiento. Mientras que resulta perfecta para el principiante (a causa de su pequeña curva de aprendizaje), también resulta perfecta para aplicaciones web grandes y exigentes. CodeIgniter está desarrollada por EllisLab y dispone de una documentación accesible y fácil de comprender. Una lista de razones que hacen de CodeIgniter una librería adecuada:
  • Usa pocos recursos pero ofrece un rendimiento excepcional
  • Enfoque MVC para el desarrollo (aunque permite bastante flexibilidad al utilizar una estructura poco rígida)
  • Genera URLs limpias aptas para motores de búsqueda
  • Fácilmente extensible
  • Funciona sobre PHP 4 (a partir de 4.3.2) y PHP 5
  • Soporta las principales bases de datos incluyendo MySQL (a partir de 4.1), MySQLi, SQL Server, Postgres, Oracle, SQLite y ODBC
  • La seguridad de la aplicación es un objetivo básico
  • Operaciones cacheadas fácilmente
  • Módulos y atajos que ayudan con las operaciones complejas como email, manipulación de imágenes, validación de formularios, subida de archivos, sesiones, aplicaciones multilenguaje y creación de apis para una aplicación
  • La mayoría de módulos sólo se cargan cuando son necesarios, lo que redunda en un drástico recorte de los recursos necesarios

¿Por qué un MVC?


Para los principiantes, MVC significa Modelo, Vista, Controlador. Es un patrón de programación usando para desarrollar aplicaciones web. Este patrón aisla la interfície de usuario y el backend (p.e. la interacción de la base de datos de todo lo demás. Una implementación correcta de esto permite que los desarrolladores modifiquen su interfície de usuario o backend sin afectar a la otra parte. MVC también incrementa la flexibilidad de una aplicación permitiendo la reutilización continua de los modelos o vistas). A continuación se puede encontrar una descripción de MVC.
  • Modelo: El modelo trata con los datos en su origen y con la interacción con la base de datos y contendrá funciones como agregar registros a la base de datos o seleccionar registros específicos de la base de datos. En CodeIgniter el componente modelo no es requerido y puede ser incluido en el controlador.
  • Vista: La vista trata con la visualización de los datos y con la interfície que el usuario controla. En CodeIgniter (o CI) la vista puede ser una página web, una fuente RSS, datos Ajax o cualquier otra "página".
  • Controlador: El controlador actúa como el intermediario entre la vista y el modelo y, como su nombre sugiere, controla lo que se envía desde el modelo hacia la vista. En CI, el controlador también es el lugar donde cargar módulos y atajos.

Un ejemplo de un enfoque MVC sería el de un formulario de contacto.
  1. El usuario interactúa con la vista rellenando un formulario y enviándolo.
  2. El controlador recibe los datos POST del formulario, y envía estos datos al modelo que es quien actualiza la base de datos.
  3. El modelo envía el resultado de la base de datos al controlador.
  4. El resultado es actualizado en la vista y mostrado al usuario.

Esto puede sonar como mucho trabajo que hacer. Pero creeme, cuando se empieza a trabajar con aplicaciones grandes, poder reutilizar modelos o vistas ahorra un montón de tiempo.

Paso 1. Descargar CodeIgniter


Para empezar se necesita descargar CodeIgniter y subirlo a un servidor web. Apuntar el navegador a http://www.codeigniter.com/ y pulsa sobre el gran botón de descarga. Para este tutorial se usará la versión 1.70.



Paso 2. Instalar y explorar CodeIgniter


Una vez descargado, sólo es necesario descomprimir el Zip y renombrar la carpeta "CodeIgniter_1.7.0" al nombre de la aplicación deseada o, en este caso, "ci" y subirla a un servidor con soporte de PHP y MySQL. Ahora que está en el servidor, explicaré para qué son las carpetas y archivos:

  • La carpeta system almacena todos los archivos que hacen que CI funcione
    • La carpeta de aplicación es casi idéntica al contenido de la carpeta de sistema para que que el usuario pueda tener archivos que sean particulares de la aplicación, por ejemplo si un usuario quiere cargar un atajo en una aplicación, lo ubicaría en la carpeta system/application/helpers en lugar de la de system/helpers.
      • La carpeta config almacena todos los archivos de configuración relevantes para la aplicación. Eso incluye qué librerías debe auto-cargar la aplicación y detalles de la base de datos.
      • La carpeta controllers almacena todos los controladores de la aplicación.
      • La carpeta errors almacena todas las páginas de patrones de errores de la aplicación. Cuando un error aparece, se genera una página de error a partir de uno de estos patrones.
      • La carpeta hooks contiene extensiones que modifican el funcionamiento de los archivos del núcleo de CI. Están pensados para los usuarios avanzados de CI.
      • La carpeta language contiene líneas de texto que pueden ser cargadas a través del módulo de lenguaje para crear sitios multilenguaje.
      • La carpeta libraries contiene todas las librerías o módulos específicos para la aplicación.
      • La carpeta models almacena los modelos de la aplicación.
      • La carpeta views almacena las vistas de la aplicación.
    • La carpeta cache almacena los caches generados por el módulo de caché.
    • La carpeta codeigniter almacena los archivos necesarios para que CI funcione.
    • La carpeta database almacena todos los drivers de base de datos y las clases que habilitan las conexiones a bases de datos.
    • La carpeta fonts almacena todas las fuentes que pueden ser usadas por el módulo de manipulación de imágenes.
    • La carpeta helpers contiene los atajos del núcleo de CI, pero es posible ubicar otros atajos personales para que accedan todas las aplicaciones.
    • La carpeta language contiene los archivos de lenguaje del núcleo de CI que usan sus módulos y atajos, pero es posible ubicar carpetas de lenguaje para que accedan todas las aplicaciones.
    • La carpeta libraries almacena las librerías del nucleo de CI, pero es posible ubicar otras librerías personales para que sean accedidas por todas las aplicaciones.
    • La carpeta logs contiene todos los logs (registros) generados por CI.
    • La carpeta plugin almacena todos los plugins que pueden ser usados. Los plugins son casi idénticos a los atajos (helpers). Son funciones dirigidas a ser compartidas por la comunidad.
    • La carpeta scaffolding almacena todos los archivos que hacen que la clase scaffolding (andamiaje) funcione. Scaffolding permite una interfície CRUD (Create-Read-Update-Delete) conveniente para acceder a la información de la base de datos durante el desarrollo.
  • La user_guide guarda la guía de usuario de CI.
  • El archivo index.php es el elemento que gestiona toda la magia de CI y permite cambiar el nombre de las carpetas de sistema y de aplicación.

Paso 3: Configurar CodeIgniter


Conseguir que CI se ponga en marcha y funcione es bastante simple. Principalmente requiere editar unos pocos archivos de configuración.

Se necesita configurar CI para que apunte a la URL base correcta de la aplicación. Para hacerlo, hay que abrir system/application/config/config.php y editar la variable array base_url para que apunte a tu servidor y carpeta CI.
$config['base_url'] = "http://localhost/ci/";

Paso 4: Probando CodeIgniter


Haremos un rápido test para ver si CI está en marcha y funcionando adecuadamente. Dirígete a http://localhost/ci/ y deberías ver lo siguiente.



Paso 5: Configurando CodeIgniter (continuación)


Si está en marcha y funcionando, deberíamos terminar la configuración. Estamos empezando a configurarlo específicamente para nuestra nueva aplicación holamundo. Si quieres usar una base de datos con tu aplicación (cosa que haremos en este tutorial), abre system/application/config/database.php y establece los siguientes elementos a los valores correspondientes. Este código conecta a una base de datos MySQL llamada "holamundo" en localhost con el usuario "root" y la clave "root".
$db['default']['hostname'] = "localhost";
$db['default']['username'] = "root";
$db['default']['password'] = "root";
$db['default']['database'] = "holamundo";
$db['default']['dbdriver'] = "mysql";
Además, como vamos a usar la base de datos un poco, queremos que se cargue automáticamente para no tener que hacerlo cada vez que conectemos. Abre system/application/config/autoload.php y agrega 'database' a la variable array de carga automática de módulos.
$autoload['libraries'] = array('database');
Actualmente, la configuración de CI tendrá un controlador predefinido llamado "welcome.php" que se puede encontrar en la carpeta system/application/controllers. Para este tutorial, bórralo y abre el archivo system/application/config/routes.php y cambia el la variable de ruta predefinida para que apunte al controlador "holamundo".
$route['default_controller'] = "Helloworld"
CI también tiene un archivo de vista que no necesitamos. Abre la carpeta system/application/view/ y elimina el archivo welcome_message.php.

Paso 6: Crea la base de datos Holamundo


Puesto que esto no es un tutorial de MySQL, esta sección será corta. Crea una base de datos llamada "holamundo" y ejecuta el siguiente código SQL mediante phpMyAdmin o cualquier otro cliente MySQL.
CREATE TABLE `data` (
  `id` int(11) NOT NULL auto_increment,
  `title` varchar(255) NOT NULL,
  `text` text NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

INSERT INTO `data` (`id`, `title`, `text`) VALUES(1, 'Hello World!', 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla 
sapien eros, lacinia eu, consectetur vel, dignissim et, massa. Praesent suscipit nunc vitae neque. Duis a ipsum. Nunc a erat. Praesent 
nec libero. Phasellus lobortis, velit sed pharetra imperdiet, justo ipsum facilisis arcu, in eleifend elit nulla sit amet tellus. 
Pellentesque molestie dui lacinia nulla. Sed vitae arcu at nisl sodales ultricies. Etiam mi ligula, consequat eget, elementum sed, 
vulputate in, augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;');

Paso 7: Crea el modelo Holamundo



Los modelos son opcionales en CI, pero está considerada una buena práctica el utilizarlos. Se trata de simples clases PHP que contienen funciones que trabajan con información de la base de datos. Crea un archivo helloworld_model.php en la carpeta system/application/models. En este archivo, crea una clase Helloworld_model, con un constructor Helloworld_model y una función getData.

En la función getData vamos a usar funciones de base de datos Active Record que aceleran el desarrollo cuando se trabaja con CI y bases de datos. Esencialmente se trata de funciones simplificadas para crear consultas.
<?php
class Helloworld_model extends Model {

    function Helloworld_model()
    {
        // Call the Model constructor
        parent::Model();
    }
    
    function getData()
  {
   //Query the data table for every record and row
   $query = $this->db->get('data');
   
   if ($query->num_rows() > 0)
   {
    return $query->result();
   }else{
    //show_error('Database is empty!');
   }
  }

}
?>

Paso 8: Crea el controlador Holamundo



Creemos un controlador que muestre la vista y cargue el modelo. De esa forma, cuando vayas a la dirección http://localhost/ci/index.php/helloworld/, verás datos que vienen de la base de datos. En la carpeta system/application/controllers, crea un archivo llamado helloworld.php. Ahí crearemos una clase que tiene el mismo nombre que el archivo.

Dentro de esta clase, necesitas crear una función llamada "index". Esta es la función que se mostrará cuando no se indique otra (por ejemplo al visitar http://localhost/ci/index.php/helloworld/). Si, por ejemplo, creasemos una función llamada foo, podríamos encontrarla en http://localhost/ci/index.php/helloworld/foo/.

Lo que hay que recordar es cómo CI estructura sus URLs. Es decir: http://host/codeignitordirectory/index.php/class/function

En la función index del controlador necesitamos cargar el modelo, consultar la base de datos, y pasar los datos solicitados a la vista. Para cargar cualquier recurso en CI (como módulos, atajos, vistas o modelos) usamos la clase load. Tras cargar el modelo, podemos acceder a él a través de su nombre y de la función particular deseada. Para pasar datos a la vista, necesitamos asignarla a un elemento de array y pasar el array, lo cuál recrea los elementos del array como una variable en el archivo de vista.
<?php
 class Helloworld extends Controller{
  function index()
  {
   $this->load->model('helloworld_model');

   $data['result'] = $this->helloworld_model->getData();
   $data['page_title'] = "CI Hello World App!";

   $this->load->view('helloworld_view',$data);
     }
 }
?>

Si visitamos http://localhost/ci/index.php/helloworld/ ahora, no funcionará. Eso se debe a que aún no hemos creado el archivo de la vista.



Paso 9: Crea la vista Holamundo


El archivo de vista es lo que el usuario ve y con lo que interactúa, pudiendo ser un segmento de una página o una página entera. Puedes pasar un array de variables a la vista a través del segundo argumento de la función de carga del modelo. Para crear la vista de nuestro tutorial, crea un nuevo archivo llamado helloworld_view.php en la carpeta system/application/view. Ahora, necesitamos crear los elementos normales html, head y body y entonces crear una cabecera y un párrafo para la información que vendrá de la base de datos. Para mostrar todos los registros recibidos de la base de datos, ponemos un bucle foreach que recorra todos los elementos.
<html>
 <head>
  <title><?=$page_title?></title>
 </head>
 <body>
  <?php foreach($result as $row):?>
  <h3><?=$row->title?></h3>
  <p><?=$row->text?></p>
  <br />
  <?php endforeach;?>
 </body>
</html>

Es posible que te hayas dado cuenta de que estamos usando una sintaxis alternativa de PHP que ofrece una forma conveniente de escribir comandos echo y que además ahorra tiempo.

Paso 10: Ta-da y algunos Extras


Cuando visites target="_blank">http://localhost/ci/index.php/helloworld/ deberías ver algo similar a lo siguiente:


Pero aún no hemos terminado. Hay unas pocas cosas que mejoran la experiencia con CodeIgniter - como eliminar ese molesto "index.php" de la URL. Es posible hacerlo creando un archivo .htaccess en la carpeta raíz y añadiendo el siguiente código.
RewriteEngine on
RewriteCond $1 !^(index\.php|images|robots\.txt)
RewriteRule ^(.*)$ ci/index.php/$1 [L]

También necesitarás abrir el archivo config.php de system/application/config/ y editar el elemento index_page asignándole una cadena vacía.
$config['index_page'] = ""; 
Otro truco es activar la habilidad de CI de parsear la sintaxis alternativa de PHP, si no está habilitada por defecto en el servidor. Para conseguirlo, abre el mismo archivo que antes (system/application/config/config.php) y edita el elemento rewrite_short_tags con el valor TRUE.
$config['rewrite_short_tags'] = TRUE;
Y con esto llegamos al final del tutorial. Una aplicación simple de CodeIgniter que permite entender cómo se estructura el código con esta librería, aunque no se pueden ver todas sus ventajas hasta que se empiecen a crear aplicaciones un poco más complejas. Espero que haya sido de utilidad. Addendum: En NetTuts ofrecen 6 trucos u optimizaciones muy interesantes si vas a utilizar la librería.

14 comentarios:

MARCELOABELDA dijo...

Hay un error en

Paso 7: Crea el modelo Holamundo

15. if ($query->num_rows() > 0)
16. {
17. //show_error('Database is empty!');
18. }else{
19. return $query->result();
20. }

debería ser:

15. if ($query->num_rows() > 0)
16. {
17. return $query->result();
18. }else{
19. //show_error('Database is empty!');
20. }

o cualquier otra opción válida.

EXCELENTE ARTÍCULO !!!!!!!!!

saludos.
desde www.marceloabelda.com.ar

digitta dijo...

Cierto. Hice copia-pega del artículo original. Lo corrijo... Gracias Marcelo.

Anónimo dijo...

Como cargo una imagen en la vista

José Rico dijo...

Como en html img src=""

Anónimo dijo...

algun ejemplo con la libreria login? >_<

Omar Malave (Blackberry) dijo...

hola, monte mi servidor de pruebas y para sorpresa mia, no me muestra las paginas de error 404, osea muestra las de apache normal! que pasara? en mi windows todo bien pero en el linux no me va!

Omar Malave (Blackberry) dijo...

hola, no me van los errores 404 cuando trato de llamar un controlador que no existe, es decir en mi windows todo bien pero en linux no, arme mi servidor de pruebas y no me anda, sera algo del mod_rewrite?

Anónimo dijo...

hola, yo trato de gestionar mi intranet con el CI, y siguiendo los pasos solo me muestra los textos de forma desarticulada y no las imagenes
si me pudieran dar una solucion ...agradecido

Victor Manuel dijo...

Buen totorial :P

John dijo...

Primero gracias por compartir este valioso manual. Mas encima lo has traducido. Gracias

Fermuch dijo...

Hola. Tuve un problema con el .htaccess
Lo solucione así:

RewriteEngine on
RewriteCond $1 !^(index\.php|images|robots\.txt)
RewriteRule ^(.*)$ index.php/$1 [L]

Anónimo dijo...

BACAN EL ARTÍCULO..., MUCHAS GRACIAS...
By Mafuen

Anónimo dijo...

Eres lo maximo amigo, gracias, de verdad

Àl dijo...

Gracias. Intentaré seguir con el nivel aunque últimamente tengo un poco parado el blog...

Publicar un comentario en la entrada

Últimos links en indiza.com