Cómo configurar CodeIgniter: tutorial completo

El desarrollo de sitios web puede parecer un reto, sobre todo si se aborda sin ninguna ayuda. Por suerte, existen herramientas de desarrollo como CodeIgniter, un framework PHP mantenido por el Instituto de Tecnología de la Columbia Británica con un conjunto de herramientas sencillas pero eficaces para desarrollar aplicaciones web.

En este tutorial de CodeIgniter, recorreremos el proceso de instalación y configuración del framework CodeIgniter en un alojamiento compartido y en un VPS. Además, demostraremos cómo crear una aplicación web sencilla.

Configura CodeIgniter para tu sitio web

Antes de empezar, ten en cuenta que CodeIgniter requiere una pila Linux, Apache, MySQL y PHP (LAMP). Por suerte, viene preinstalado con el alojamiento compartido de Hostinger.

Sin embargo, si tienes un VPS, tendrás que instalar primero la pila LAMP en Ubuntu o CentOS. Una vez hecho esto, procede con la instalación de CodeIgniter.

Paso 1: instala CodeIgniter

CodeIgniter puede instalarse automáticamente a través de Composer o manualmente mediante el Administrador de archivos.

Instalar CodeIgniter 4 con Composer

1. Accede a tu cuenta SSH y navega al directorio raíz public_html con este comando:

cd dominios/tudominio.com/public_html

2. Instala CodeIgniter 4.

composer create-project codeigniter4/appstarter project-root

El comando anterior creará un directorio raíz del proyecto para los archivos de CodeIgniter. En este tutorial, estamos utilizando la última versión estable de CodeIgniter: 4.1.9. Puedes utilizar el comando de abajo desde tu directorio CodeIgniter para actualizarlo:

composer update

3. Por comodidad, te recomendamos mover el contenido de project-root al directorio public_html. Primero, determina el directorio actual con este comando:

pwd

Tendrá un aspecto parecido a éste:

/home/u123456789/domains/tudominio.com/public_html

Ahora mueve los archivos:

mv proyecto-root/* /home/u123456789/domains/tudominio.com/public_html

4. Una vez hecho esto, introduce esta URL en el navegador:

https://tudominio.com/public  

Asegúrate de sustituir tudominio.com por tu dominio real. 

Aparecerá la pantalla predeterminada de CodeIgniter, indicándote que se ha instalado correctamente.

Instalar CodeIgniter 4 manualmente

Si quieres omitir la parte SSH necesaria para Composer, opta por la instalación manual.

Recuerda que, aunque el método manual es sencillo, tendrás que comprobar si hay conflictos de fusión al actualizar tu sitio web. Sigue estos pasos para realizar la instalación manual:

1. Descarga la última versión de CodeIgniter.
2. Utilizando el Administrador de archivos, extráelo en el directorio raíz: tudominio.com/public_html.
3. Aparecerá la carpeta framework-4.1.9. Ábrela y haz doble clic en la carpeta que contiene. Deberías ver una ventana como ésta:

Pulsa CTRL + A para seleccionar todos los archivos y utiliza el botón Mover para transferirlo todo a public_html:

4. Abre el navegador e introduce esta URL:

https://tudominio.com/public

Asegúrate de sustituir tudominio.com por tu nombre de dominio.

Aparecerá la pantalla predeterminada de CodeIgniter, lo que significa que se ha instalado correctamente.

Paso 2: configura CodeIgniter

Después de instalar CodeIgniter, es vital configurarlo para que funcione correctamente. Te recomendamos que empieces creando un archivo .htaccess y pegando en él este fragmento:

RewriteEngine on
RewriteCond %{REQUEST_URI} !^public
RewriteRule ^(.*)$ public/$1 [L]

Estas reglas .htaccess harán que la URL del sitio web de CodeIgniter tenga este aspecto:

https://tudominio.com

En lugar de:

https://tudominio.com/public

Después, procede con la configuración avanzada.

Configurar CodeIgniter para planes compartidos

En esta sección, hablaremos de la configuración avanzada de los planes de alojamiento compartido. Empecemos con una nueva base de datos MySQL.

1. Busca la sección Hosting → Gestionar → Bases de datos MySQL en el hPanel de Hostinger:

2. Una vez allí, especifica el nombre de la base de datos, el nombre de usuario y la contraseña y haz clic en Crear:

3. Ve al Administrador de archivos y abre el archivo Database.php para editarlo. Aquí tienes la ruta completa:

/domains/tudominio.com/public_html/app/Config/Database.php

4. Localiza la siguiente sección del archivo y sustituye los datos por la información de tu base de datos recién creada: nombre de usuario, contraseña y base de datos. El resto de los valores deben seguir este ejemplo:

public $default = [
'DSN'      => '',
'hostname' => 'localhost',
'username' => 'u123456789_user',
'password' => 'Y0ur$tr0ngPa$$w0rd',
'database' => 'u123456789_name',
'DBDriver' => 'MySQLi',
'DBPrefix' => '',
'pConnect' => false,
'DBDebug'  => (ENVIRONMENT !== 'production'),
'charset'  => 'utf8',
'DBCollat' => 'utf8_general_ci',
'swapPre'  => '',
'encrypt'  => false,
'compress' => false,
'strictOn' => false,
'failover' => [],
'port'     => 3306,
];

5. Configura tu nombre de dominio modificando el archivo App.php de CodeIgniter que se encuentra aquí:

/domains/tudominio.com/public_html/app/Config/App.php

6. Localiza la siguiente línea y cambia su valor por el de tu nombre de dominio real:

public $baseURL = 'https://tudominio.com/';

Guarda el archivo y sal.

La base de datos ya está sincronizada con CodeIgniter.

Configurar hosts virtuales en VPS

Los usuarios de VPS pueden ejecutar varias aplicaciones CodeIgniter en un único nombre de dominio. Para ello, necesitan configurar hosts virtuales.

1. Asegúrate de que la raíz del documento está sincronizada con el directorio de instalación de CodeIgniter. Para ello, abre el archivo host virtual.

sudo nano /etc/apache2/sites-enabled/000-default

2. Busca el siguiente bloque:

<VirtualHost *:80>
DocumentRoot /path/to/codeigniter
[.......]
<VirtualHost *:80><br>

3. Cambia /path/to/codeigniter por la ruta real del directorio de instalación de CodeIgniter. Al hacer esto, todas las URL apuntarán a esta carpeta. Guarda los cambios pulsando CTRL + X y Y.

Para un proceso de desarrollo más eficiente, elimina index.php del formato URL de CodeIgniter. Aquí cómo hacerlo:

1. Abre el archivo config.php.

nano /public_html/app/Config/App.php

Localiza la siguiente línea:

public $indexPage = 'index.php';

Sustitúyelo por esto:

public $indexPage = '';

2. Es necesario redirigir las peticiones futuras modificando el archivo .htaccess para que no aparezcan errores. Antes de hacerlo, comprueba si mod_rewrite está activado.

apache2ctl -M

El comando anterior mostrará las capacidades del servidor. Si mod_rewrite está en la lista, continúa con el siguiente paso. En caso contrario, ejecuta esta línea:

a2enmod rewrite

A continuación, reinicia Apache.

sudo service apache2 restart

3. Crea un archivo .htaccess en la carpeta raíz de CodeIgniter.

nano public_html/.htaccess

4. Pega las siguientes líneas en el archivo. Si el .htaccess ya se creó durante la parte de configuración del tutorial, añade todas las líneas excepto la primera. Guarda los cambios y sal del archivo.

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule .* index.php?/$0 [PT,L]<br>

5. Haz saber a Apache que debe buscar el archivo .htaccess recién creado. Para ello, abre de nuevo el archivo del host virtual:

sudo nano /etc/apache2/sites-enabled/000-default

Asegúrate de que AllowOverride está establecido en Todos, como se muestra a continuación:

<Directory>
Options Indexes FollowSymLinks MultiViews
AllowOverride All
Order allow,deny
allow from all
</Directory>

Tras confirmarlo, guarda el archivo.

Si se hace correctamente, index.php no aparecerá, haciendo que la URL tenga un aspecto más limpio.

Cómo funciona MVC

Antes de continuar con nuestro tutorial de CodeIgniter y aprender a crear una aplicación con el framework, debemos cubrir los aspectos básicos del patrón modelo-vista-controlador (MVC).

En pocas palabras, MVC es un paradigma de arquitectura de desarrollo web. Este establece que la lógica de negocio de cualquier aplicación debe estar separada de la presentación.

• Modelo: trata con la base de datos, realiza cálculos y mucho más. En resumen, es donde se encuentra tu lógica empresarial.
• Vista: forma la capa de presentación de la aplicación, donde se incrustan los datos de los modelos.
• Controlador: dirigirá las peticiones de los usuarios al modelo adecuado. Una vez que el modelo haya hecho su trabajo, el controlador cargará la vista correspondiente.

Este patrón arquitectónico también ofrece a los desarrolladores la flexibilidad de reutilizar código para múltiples vistas. Por ejemplo, te permitirá implementar la misma barra de navegación en todas las páginas web de tu aplicación. 

Además, como tanto las vistas como los modelos están totalmente separados, los desarrolladores del front-end pueden trabajar en paralelo con el equipo del back-end para acelerar el proceso de desarrollo.

Ten en cuenta que CodeIgniter también se adhiere al paradigma de la Programación Orientada a Objetos (POO). Como tales, los modelos y controladores son clases PHP que extienden las clases base proporcionadas por el framework. Las vistas también pueden denominarse archivos PHP, aunque la mayor parte de su contenido es HTML/CSS. 

Sólo hay unos pocos fragmentos de código PHP central y se utilizan para mostrar los datos de los modelos.

Enrutamiento básico

Así es como CodeIgniter formatea sus cadenas URL:

<base_url>/index.php/<controller_name>/<controller_function>/<function_parameter_1>/>/<function_parameter_2>...

En la sección anterior te hemos mostrado cómo eliminar index.php del formato. Como resultado, tu URL será similar a la de este ejemplo:

http://www.tudominio.com/welcome/tester/1

Aquí, welcome es una clase controladora que corresponde a un archivo controlador llamado welcome.php. Esta clase llamará a la función tester() y le pasará «1″ como parámetro. Se pueden proporcionar más parámetros de forma similar, separados por barras oblicuas.

Librerías

CodeIgniter fomenta la reutilización de las bibliotecas y funciones de ayuda existentes para realizar tareas comunes. El framework también permite a los usuarios decidir qué biblioteca cargar y cuándo. Este proceso bajo demanda da como resultado aplicaciones rápidas, ligeras y ricas en funciones.

Cargar una biblioteca es fácil en CodeIgniter. Por ejemplo, para cargar la biblioteca Base de datos, pasa la siguiente línea en tu modelo o controlador:

$this->load->database();

Te sugerimos que autocargues las bibliotecas comunes para que estén listas siempre que las necesites. CodeIgniter utiliza el estándar PSR-4, que facilita la carga automática:

1. Abre el archivo de carga automática:

nano app/Config/Autoload.php

2. Añade las bibliotecas a la matriz psr4:

$psr4 = [
'App'         => APPPATH,
'CodeIgniter' => SYSTEMPATH,
];

Crea una aplicación sencilla con CodeIgniter

En este punto del tutorial de CodeIgniter, deberías tener una distribución en funcionamiento de CodeIgniter y una comprensión de cómo funcionan los modelos, las vistas y los controladores. Ahora vamos a crear una sencilla aplicación web CodeIgniter.

Utilizaremos el modelo para obtener los nombres de las agencias de nuestra base de datos y ordenarlos y mostrarlos utilizando nuestra vista. El controlador se utilizará para dirigir las peticiones entre el modelo y la vista.

Una vez que tengas conocimientos básicos sobre el proceso fundamental de CodeIgniter, podrás empezar a crear aplicaciones web completas.

Paso 1: crear una tabla phpMyAdmin

Esta sección cubrirá los pasos para crear una tabla con phpMyAdmin a través de hPanel. Esta tabla es esencial porque constituirá la base de nuestra aplicación.

1. Accede a tu cuenta de alojamiento. Ve a la sección Bases de datos y selecciona phpMyAdmin.
2. Busca la base de datos que has sincronizado con CodeIgniter y haz clic en Entrar en phpMyAdmin:

3. Una vez allí, selecciona la sección SQL, pega esta consulta y pulsa Ir:

CREATE TABLE agencies (
    id int(11) NOT NULL AUTO_INCREMENT COMMENT 'Primary Key',
    name varchar(100) NOT NULL COMMENT 'Name',
    email varchar(255) NOT NULL COMMENT 'Email Address',
    PRIMARY KEY (id)
  ) ENGINE=InnoDB DEFAULT CHARSET=latin1 COMMENT=''AUTO_INCREMENT=1;
  
    INSERT INTO agencies(id, name, email) VALUES
  (1, 'Development', 'awesomeinbox@domain.com'),
  (2, 'Production', 'sparkingjoy@domain.net'),
  (3, 'Testing', 'user@mydomain.com'),
  (4, 'Building', 'editor@mydomain.net'),
  (5, 'Debugging', 'anotherawesomeinbox@anotherdomain.com');

Tendrá este aspecto:

Esta consulta creará automáticamente una base de datos con los datos que podremos utilizar más adelante.

Paso 2: crear el modelo

Una vez creada la tabla de la base de datos, empieza a trabajar en la lógica empresarial. Para ello, crea un modelo que recupere los valores de la base de datos.

1. Accede al Administrador de archivos
2. Los modelos se colocan en el directorio public_html/app/Models para que no interfieran con la estructura de directorios de la aplicación. Ve al directorio Models y crea un nuevo archivo PHP llamado AgencyModel.php.
3. Pega el siguiente código en el archivo AgencyModel.php:

<?php namespace App\Models;
use CodeIgniter\Database\ConnectionInterface;
use CodeIgniter\Model; 
class AgencyModel extends Model
{
    protected $table = 'agencies';
     protected $allowedFields = ['name', 'email'];
}

Como puedes ver, la clase modelo (AgencyModel) extiende la clase genérica Modelo que proporciona CodeIgniter. Ten en cuenta que CodeIgniter exige que todos los nombres de clase empiecen por mayúscula.

Paso 3: crear el controlador

A continuación, crearemos una ruta utilizando el controlador. De esta forma, cada vez que un usuario realice una petición, la vista recibirá la información del modelo.

1. Para crear un nuevo controlador, ve al directorio app/Controladores y crea un archivo llamado Agencias.php. Recuerda que los controladores de CodeIgniter deben tener el mismo nombre que la clase que contienen.
2. Pega el siguiente código en el archivo:

<?php namespace App\Controllers;
 
use CodeIgniter\Controller;
use App\Models\AgencyModel;
class Agencies extends Controller
{
}

3. Crearemos una función sencilla para ordenar todas las entradas de la base de datos de mayor a menor. Para ello, añade este fragmento de código al archivo:

public function index()
{    
  $model = new AgencyModel(); 
  $data['agencies'] = $model->orderBy('id', 'DESC')->findAll();    return view('agencies', $data);
}

4. El código completo tendrá este aspecto:

<?php namespace App\Controllers;
use CodeIgniter\Controller;
use App\Models\AgencyModel;
class Agencies extends Controller
{
public function index()
{    
  $model = new AgencyModel(); 
  $data['agencies'] = $model->orderBy('id', 'DESC')->findAll();    return view('agencies', $data);
}
}

Paso 4: crear la vista

Por último, crearemos una vista que mostrará la lista de agencias.

1. Entra en la carpeta app/Views y crea un nuevo archivo titulado agencias.php. El nombre del archivo tiene que corresponder a la vista que le dijiste al controlador que cargará, que aparece en la última línea del método view().
2. Pega el siguiente código y guarda el archivo:

<!doctype html>
<html lang="en">
  <head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>
<body>
<div class="row mt-3">
     <table class="table table-bordered" id="agencies">       <thead>
   <tr>
             <th>Id</th>
             <th>Name</th>
             <th>Email</th>
          </tr>
       </thead>
       <tbody>
          <?php if($agencies): ?>
          <?php foreach($agencies as $agencies1): ?>
          <tr>
             <td><?php echo $agencies1['id']; ?></td>
             <td><?php echo $agencies1['name']; ?></td>
             <td><?php echo $agencies1['email']; ?></td>
          </tr>
         <?php endforeach; ?>
         <?php endif; ?>
       </tbody>
     </table>
  </div>
</div>
</body>
</html>

La vista mostrará la información pasada por el controlador en la matriz $data. Los resultados no serán espectaculares, ya que no hemos añadido estilo a nuestra vista. Sin embargo, puedes añadir estilos en línea o hacer referencia a una hoja de estilos CSS en la vista más adelante.

Nuestra aplicación de ejemplo está completa. Deberías poder ejecutar esta aplicación introduciendo la siguiente URL en tu navegador:

http://tudominio.com/Agencies

La aplicación web llamará al controlador de agencias creado en el paso 3 y ordenará los elementos de la base de datos.

Conclusión

Aprender a crear una aplicación web es necesario si deseas convertirte en desarrollador web. Por suerte, CodeIgniter y su arquitectura MVC hacen que el proceso de desarrollo sea rápido, eficiente y fácil para cualquiera.

En este artículo, hemos tratado los aspectos esenciales de este framework y hemos hablado de lo que hace que CodeIgniter sea tan sencillo pero eficaz. También hemos mostrado cómo funciona el patrón de diseño de software MVC y hemos creado una aplicación sencilla.

Si tienes algún comentario o pregunta, déjalo en la sección de comentarios más abajo.

CodeIgniter – Preguntas frecuentes

A continuación responderemos algunas de las preguntas más comunes sobre CodeIgniter.