Introducción y primeros pasitos en CodeIgniter: un framework que por su pequeño tamaño y su gran versatilidad se ha hecho casi indispensable para muchos desarrolladores a la hora de crear nuevos proyectos. Vamos a crear nuestro proyecto paso a paso usando este “pequeño” pero potente framework.

Autor:

Buenas! Soy Gerard Guiu, freelance en desarrollo y gestión de proyectos web, desarrollos con drupal, wordpress o codeigniter, SEO y gestor de campañas social media (community manager). Puedes seguirme en mi twitter o en mi blog.
Descarga Demostración

Introducción

Codeigniter es un framework escrito en php de un tamaño reducido pensado para ofrecer un alto rendimiento. Con este framework podemos cubrir desde pequeños a grandes proyectos, con lo que nos demuestra su gran versatilidad.

Codeigniter utiliza un sistema de MVC (Modelo Vista Controlador). Si no conoces el sistema de MVC dale un vistazo.

En este esquema donde podemos ver un poco el diseño del framework:

MVC

El índice es el que se encarga de inicializar el núcleo de Codeigniter. Seguido, el enrutador, se encarga de analizar la url y visualiza que tiene que realizar. En este paso, si tiene una cache mostrara el contenido guardado en la cache, en caso contrario, pasará por un filtro de seguridad donde, entre otras cosas, se limpiaran los parámetros GET. Terminado los pasos de limpieza, llegamos al controlador.

En el controlador se cargaran todos los modelos, librerías, plugins, etc para poder crear el contenido de la pagina. Una vez tenga todos los datos, cargara la vista y esta será mostrada.

Esta vista se queda guardada en la cache para que las próximas peticiones no tengan que repetir todo el proceso y agilizar la carga. Una vez tenemos esto claro, vamos a crear nuestro primer proyecto con este genial framework.

Instalación y configuración

Primer paso, descargar el framework :D codeigniter.com. Cuando lo tengamos descargado, lo descomprimimos y veremos la siguiente estructura de ficheros:

Estructura codeigniter

Si nos fijamos, vemos que en la raíz solo tenemos un archivo index y una carpeta system, que esta contendrá todo el núcleo de codeigniter.

Recomiendo cambiar el nombre de la carpeta system para evitar algún posible ataque en nuestra web. Yo normalmente uso nombres como system_nombreweb. Si cambiamos el nombre de la carpeta, debemos abrir el fichero index.php y modificar la línea $system_folder = “system”; por system_nombre_web.

Nosotros nos vamos a la siguiente ruta: System/application.

Esta ruta es donde tenemos que crear los controladores, vistas y todo el funcionamiento de nuestra web. Si modificamos los ficheros fuera de esta ruta, nos arriesgamos que en futuras actualizaciones nos pisen cosas modificadas. O sea, siempre modificaremos los archivos en system/applications.

Dentro de esta carpeta veremos las siguientes, carpetas:

  • Config: Todos los ficheros de configuración, ya sean del propio codeigniter o de nuestras clases.
  • Controller: aquí crearemos nuestros controladores.
  • Error: Clases para poder gestionar los errores.
  • Helpers: Los helpers, como su nombre dice, son funciones que nos ayudaran a mostrar o generar contenido.
  • Hooks: Los hooks son funciones que le podemos dar la orden que se carguen, por ejemplo, antes de cargar los controladores o que sea la ultima función en cargar, etc.
  • Language: aquí guardaremos las traducciones.
  • Libraries: Se guardan nuestras propias clases para utilizarlas en los controladores, modelos, etc
  • Models: Crearíamos las clases para trabajar con la capa de la base de datos.
  • Views: Crearíamos las vistas para mostrar el contenido de la web.

Una vez tenemos claro el árbol de carpetas, vamos a modificar el path i la base de datos para poder arrancar el framework. Para esto, nos vamos a system/application/config/config.php Abrimos el fichero y buscamos esta línea:

$config['base_url']    = "http://example.com/";

Y la sustituimos por nuestra base url:

$config['base_url'] = "http://localhost:8888/codeigniter/";

De momento no tocamos nada mas de este fichero. Guardamos y vamos a buscar el fichero database.php dentro de la misma carpeta. Aquí vamos a modificar las siguientes líneas:

$db['default']['hostname'] = "localhost";  // Host de la base de datos
$db['default']['username'] = "";  //Usuario de la bd
$db['default']['password'] = ""; // Password
$db['default']['database'] = ""; // nombre de la base de datos
$db['default']['dbdriver'] = "mysql";
$db['default']['dbprefix'] = "";  // Si quieres utilizar un prefijo delante de las tablas.

Recomiendo siempre utilizar un prefijo en las tablas de la base de datos para que no tengamos nunca ningún susto por pisar o borrar tablas que no tocan. En mi caso acostumbro a usar un prefijo del tipo ‘nombreweb_’

Guardamos el fichero y ya tenemos el Codeigniter en marcha. Si tecleamos al navegador la url de nuestra web y le damos al enter, veremos que ya nos sale un mensaje de bienvenida de Codeigniter.

Creando nuestro proyecto de ejemplo

Vamos a crear nuestro primer proyecto llamado presentación, que nos mostrará un ‘hola mundo desde ontuts!’ al acceder a la web.

Para empezar, vamos a crear nuestro controlador.
Nos vamos a applications/controllers y aquí creamos un fichero con nombre presentacion.php.

El nombre de la clase controlador debe ser el mismo que el nombre que hemos puesto al fichero, con la primera letra en mayúsculas

Empezamos por definir la clase y esta tiene que heredar de Controllers ya que así tendremos a nuestra disposición todos los metodos:

class Presentacion extends Controller{
  // Definimos el constructor. En php4 utilizar el nombre de la classe y no __construct.
  function __construct(){
    parent::Controller();
  }
  // Definimos el método que nos mostrará la bienvenida.
  function index() {
    // Definimos una array $data que contendrá los datos a pasar a la vista
    $data = array();
    //Asignamos el texto.
    $data['intro'] = 'Hola mundo desde ontuts!';
    //Llamamos a la vista presentación y le pasamos el array con los datos.
    $this->load->view('presentacion', $data);
  }
}

El siguiente paso es crear la vista. Las vistas las crearemos dentro de applications/views. Una vez dentro del directorio, vamos a crear una vista llamada presentacion.php.

Podemos llamarla el nombre que queramos, siempre y cuando en el controlador la llamemos por el nombre insertado. Normalmente y para no liarme, acostumbro a poner el mismo nombre.

Abrimos la vista y aquí insertamos el código html para la parte frontal:

<html>
	<head>
		<title>Ejemplo Codeigniter</title>
	</head>
	<body>
		<h3> <?=$intro;?> </h3>
	</body>
</html>

Con esto ya tendríamos nuestro primer ‘holamundo’ creado. Para ver si funciona, tenemos que teclear en la url: nombredominio.com/index.php/presentación y nos va a mostrar el texto creado:

vista previa

Apuntes sobre las url

Si nos fijamos en la estructura de la url veremos que codeigniter primero hace uso del fichero index.php que será el que se encargue de inicializar los componentes necesarios.

Luego llama a la clase, en nuestro caso, presentación y codeigniter por defecto llama al método index que sería el index.php de la clase, para así decirlo. Si creamos otro método dentro de la clase presentación, lo llamaremos con una estructura similar a esta: nombredominio.com/index.php/presentación/nuevo_metodo.

En caso de que este nuevo método usara variables, las pasaríamos de este modo: nombredominio.com/index.php/presentación/nuevo_metodo/variable1/variable2

Próximos pasos

En el siguiente tutorial vamos ver a los modelos para poder trabajar con la base de datos. Además también veremos como manipular las url para hacerlas mas google friendly y muchas mas cosas :) .

Cualquier duda… ¡en los comentarios!

¿Necesitas desarrollar un proyecto web o para móviles? ¡Estamos disponibles!

Visitar Cokidoo

Cokidoo, los creadores de Ontuts, desarrollamos proyectos tecnológicos centrados en redes sociales y aplicaciones web, aplicaciones móviles y consultoría web y bases de datos.

Somos jóvenes, inquietos, versátiles, apasionados por la innovación y enfocados en las nuevas tecnologías. Con Ontuts tratamos de compartir nuestro conocimiento adquirido en los distintos proyectos, ayudando a la comunidad y mostrando nuestra capacidad tecnológica.

Si necesitas un presupuesto sin compromiso, estamos disponibles, no dudes en contactar con nosotros.

Comentarios en esta publicación (10 comentarios)

¿Te ha gustado esta publicación? ¡Puedes compartir tu opinión con todos nosotros! Simplemente pincha aquí mismo.

Un placer estrenar nuevos colaboradores en Ontuts con CodeIgniter Gerard,

¡Gracias y a por el siguiente capítulo!

¡Que bien! Por fin le tocó a CI, mi framework :)

Es el primer framework con el que me he iniciado y es muy muy versátil, ¡Codeigniter molas!.

Genial!

Hace tiempo que toqué algo de code igniter, pero nunca me puse en serio… será el momento de retomarlo ;)

karina

hola me gustaría aprender un framework de php algunos me han recomendado cake otros CodeIgniter hay diferencias entre estos? que me recomiendan como principiante??

mariajie
jorge diaz

que pasa cuando se quiere agregar un menu simple.
¡en q parte lo agrego?
tengo q crear otros controladores para poder abrir las paginas desde el menu?

podrias guiarme un poco.

atte. Jorge diaz.

Buenos dias Jorge,
Primero de todo, comentar que estoy creando la segunda parte del tutorial, para gestionar el contenido por base de datos y un poco mas de las vistas.
Sobre lo que comentas, lo que hago yo para mostrar el menu, es crear una vista llamada ‘header’, donde aqui creo el menú.
Luego en el controlador, cuando cargo la pagina, tan solo cargo primero la vista header y luego la vista del cuerpo.
Para hacerlo mejor, tambien crea una vista del footer y cargala tambien en el controlador.
Espero haver solucionado tu problema.
Un saludo

Estimados.. he seguido todos los pasos pero curiosamente cuando hago un ejemplo y al cambiar el nombre en config/routes.php al recargar la paguna http://localhost/test/ejem se muestra en blanco… que podrà ser..?

Y mil gracias.