Tabla de Contenidos
Desarrollo de servicios web utilizando el framework CodeIgniter
Módulo perteneciente al curso Desarrollo web back-end
CodeIgniter es un framework PHP de código abierto que se utiliza para el desarrollo de aplicaciones web. Ofrece una estructura de programación rápida y sencilla, y se centra en el rendimiento y la eficiencia. Es fácil de instalar y configurar, lo que lo hace una opción popular para desarrolladores que buscan una forma rápida de crear aplicaciones web.
La estructura de carpetas y configuración de parámetros de CodeIgniter permite una fácil organización de los archivos y permite una rápida navegación a través de ellos. La creación de vistas, controladores y modelos es fácil con la estructura MVC (Modelo Vista Controlador) que ofrece el framework. Además, permite el desarrollo de aplicaciones con llamadas síncronas al servidor, así como llamadas asíncronas utilizando AJAX.
CodeIgniter promueve la búsqueda y uso de recursos externos para resolver problemas de forma autónoma, ya que ofrece una gran cantidad de documentación y recursos en línea para ayudar a los desarrolladores a construir sus aplicaciones de manera efectiva y eficiente.
En este módulo aprenderemos a trabajar con PHP utilizando el framework Codeigniter.
En esta sección del curso, nos enfocaremos en aprender a utilizar el framework CodeIgniter para el desarrollo de servicios web. CodeIgniter es un framework de código abierto basado en el patrón de diseño MVC (Modelo-Vista-Controlador) que se utiliza para desarrollar aplicaciones web de manera rápida y sencilla.
En primer lugar, aprenderemos a instalar CodeIgniter y a configurar correctamente sus parámetros. También exploraremos la estructura de carpetas que utiliza el framework para organizar nuestros archivos de manera eficiente.
Una vez que hayamos completado la instalación y configuración, veremos cómo crear vistas, controladores y modelos en CodeIgniter. Los controladores se utilizan para manejarlas solicitudes del usuario y cargar las vistas correspondientes, mientras que los modelos se encargan de la interacción con la base de datos.
Además, aprenderemos a desarrollar una aplicación web que realiza llamadas síncronas al servidor. También exploraremos cómo implementar llamadas asíncronas utilizando AJAX para mejorar la experiencia del usuario en nuestra aplicación.
En resumen, esta sección del curso nos enseñará a utilizar el framework CodeIgniter para desarrollar servicios web de manera rápida y eficiente, utilizando el patrón de diseño MVC y técnicas avanzadas como las llamadas asíncronas con AJAX.
Instalación de CodeIgniter
Para instalar CodeIgniter, lo primero que debemos hacer es descargar el archivo .zip desde la página web oficial de CodeIgniter. Una vez descargado, debemos descomprimir el archivo en el directorio raíz de nuestro servidor web, ya sea en nuestra máquina local o en un servidor remoto.
Después de descomprimir el archivo, debemos configurar los parámetros de conexión a la base de datos en el archivo de configuración database.php, que se encuentra en la carpeta application/config. Para ello, debemos instroducir los datos de nuestra base de datos, como el nombre del host, el usuario, la contraseña y el nombre de la base de datos.
Una vez configurada la conexión a la base de datos, podemos comenzar a trabajar con CodeIgniter y crear nuestras vistas, controladores y modelos para construir una aplicación web completa.
Estructura de carpetas y configuración de parámetros
Cuando trabajamos con el framework CodeIgniter, es importante conocer la estructura de carpetas y cómo se configuran los parámetros para poder desarrollar una aplicación de manera correcta y eficiente.
La estructura de carpetas de CodeIgniter está organizada de forma jerárquica, siguiendo una arquitectura de patrón MVC (Modelo-Vista-Controlador). Esto significa que cada componente de la aplicación se encuentra en una carpeta específica, con el fin de mantener una estructura clara y organizada.
Los principales componentes de la estructura de carpetas de CodeIgniter son:
application: contiene el código fuente de la aplicación, incluyendo controladores, modelos, vistas, librerías, helpers, entre otros.system: contiene los archivos del framework en sí mismo, y no se recomienda modificar ninguno de ellos.public: contiene los archivos públicos de la aplicación, como imágenes, hojas de estilo, scripts y otros archivos estáticos.
En cuanto a la configuración de parámetros, CodeIgniter utiliza un archivo llamado config.php para configurar opciones generales de la aplicación, como URL base, el prefijo de la tabla de la base de datos, la zona horaria, entre otros. Además, existe un archivo database.php que permite configurar los parámetros de conexión a la base de datos.
Creación de vistas, controladores y modelos
En CodeIgniter, la estructura de carpetas está diseñada para seguir el patrón MVC (Modelo-Vista-Controlador). Esto significa que la lógica de la aplicación se divide en tres componentes principales: modelos, vistas y controladores.
Los modelos son responsables de interactuar con la base de datos y recuperar y almacenar los datos. Las vistas son responsables de presentar los datos al usuario. Los controladores son responsables de manejar las solicitudes de los usuarios y coordinar la lógica de la aplicación.
Para crear vistas, controladores y modelos en CodeIgniter, se deben seguir algunas convenciones de nomenclatura y ubicación de archivos.
- Las vistas se encuentran en la carpeta
application/viewsy se nombran en función de su función. Por ejemplo, si la vista es para mostrar una página de inicio, su nombre puede serhome_view.php. - Los controladores se encuentran en la carpeta
application/controllersy se nombran en función de su función. Por ejemplo, si el controlador es para manejar solicitudes de inicio de sesión, su nombre puede serlogin_controller.php. - Los modelos se encuentran en la carpeta
application/modelsy se nombran en función de la tabla de la base de datos que manejan. Por ejemplo, si el modelo es para manejar una tabla de usuarios, su nombre puede serusers_model.php.
Para crear vistas, se puede usar HTML y se puede utilizar la sintaxis de CodeIgniter para insertar datos dinámicos en la vista. Para crear controladores y modelos, se deben seguir ciertas convenciones de nomenclatura y ubicación de archivos, y se pueden utilizar bibliotecas integradas para interactuar con la base de datos.
A continuación se muestra un ejemplo de cómo se puede crear un controlador y una vista en CodeIgniter:
Crear un archivo welcome_controller.php en la carpeta application/controllers con el siguiente código:
<?php class Welcome_controller extends CI_Controller { public function index() { $data = array( 'title' => 'Welcome to my site', 'content' => 'This is my first page in CodeIgniter' ); $this->load->view('welcome_view', $data); } } ?>
Crear un archivo welcome_view.php en la carpeta application/views con el siguiente código:
<!DOCTYPE html> <html> <head> <title><?php echo $title; ?></title> </head> <body> <h1><?php echo $content; ?></h1> </body> </html>
En este ejemplo, se crea un controlador llamado Welcome_controller que tiene una función llamada index. La función carga una vista llamada welcome_view y pasa algunos datos dinámicos a la vista. La vista utiliza la sintaxis de CodeIgniter para mostrar los datos dinámicos en la página, es decir, la variable $title mostrará Welcome to my site, ya que lo recoge del array $data del controlador. Lo mismo con la variable $content, que mostrará This is my first page in Codeigniter.
Desarrollo de una aplicación con llamadas síncronas al servidor
En el desarrollo de aplicaciones web con CodeIgniter, una de las funcionalidades más comunes es la realización de llamadas síncronas al servidor.
Estas llamadas se realizan a través de un formulario o mediante la URL. Tras el procesamiento de los datos por el servidor se deuvelve una respuesta al cliente en forma de una nueva vista.
Para realizar llamadas síncronas al servidor con CodeIgniter, se utiliza el método submit del formulario HTML, que envía los datos del formulario al servidor y espera una respuesta. Una vez recibida la respuesta, se muestra la nueva vista en la página del cliente.
El controlador es el encargado de recibir los datos enviados desde el formulario y procesarlos. Para ello, se utiliza la función post() o get() de CodeIgniter, según corresponda. Estas funciones permiten obtener los datos enviados desde el formulario y realizar las acciones necesarias.
A continuación, se muestra un ejemplo sencillo de un controlador en CodeIgniter que recibe datos mediante una llamada síncrona al servidor:
<?php defined('BASEPATH') OR exit('No direct script access allowed'); class Ejemplo extends CI_Controller { public function index() { $this->load->view('formulario'); } public function procesar() { $nombre = $this->input->post('nombre'); $apellido = $this->input->post('apellido'); // Procesamiento de los datos recibidos $datos['nombre'] = $nombre; $datos['apellido'] = $apellido; $this->load->view('respuesta', $datos); } }
En este ejemplo, el controlador Ejemplo cuenta con dos funciones: index() y procesar(). La función index() carga la vista formulario, que contiene un formulario HTML que envía los datos mediante una llamada síncrona al servidor. La función procesar() recibe los datos enviados mediante el formulario y los procesa, antes de cargar la vista respuesta con los datos procesados.
La estructura para la vista formulario sería algo así:
<!DOCTYPE html> <html> <head> <title>Formulario</title> </head> <body> <form action="<?php echo site_url('ejemplo/procesar'); ?>"method="post"> <input type="text" name="nombre" placeholder="Introduce tunombre..." /> <input type="text" name="apellido" placeholder="Introduce tuapellido..." /> <button type="submit">Enviar datos</button> </form> </body> </html>
En este formulario, tenemos dos campos de tipo texto, uno para el nombre y otro para el apellido, estos datos se enviarán al controlador ejemplo, a la función procesar a través del action del form. De este modo, el controlador, podrá recoger los datos enviados y procesarlos para mostrarlos en la vista respuesta la cuál tendría esta estructura:
<!DOCTYPE html> <html> <head> <title>Datos del usuario</title> </head> <body> <p>Nombre: <?php echo $nombre; ?></p> <p>Apellido: <?php echo $apellido; ?></p> </body> </html>
En resumen, las llamadas síncronas al servidor son una funcionalidad clave en el desarrollo de aplicaciones web con CodeIgniter y permiten al usuario interactuar con el servidor de forma rápida y eficiente. Para implementar esta funcionalidad, es necesario implementar un controlador que reciba los datos enviados mediante el formulario y los procese antes de devolver una respuesta al cliente en forma de una nueva vista.
Desarrollo de una aplicación con llamadas asíncronas utilizando AJAX
En el desarrollo de aplicaciones web con CodeIgniter, también es común utilizar llamadas asíncronas al servidor, que permiten actualizar el contenido de una página sin necesidad de recargarla completamente. Para implementar este tipo de llamadas, se utiliza la tecnología AJAX, que permite enviar y recibir datos en segundo plano mediante peticiones HTTP.
En CodeIgniter, la implementación de llamadas asíncronas con AJAX es muy similar a la de las llamadas síncronas. La principal diferencia radica en que, en lugar de enviar los datos mediante un formulario HTML, se utilizan las funciones de AJAX para enviar los datos al servidor y recibir una respuesta.
Para realizar una llamada asíncrona con AJAX en CodeIgniter, se puede utilizar la librería de AJAX integrada en el framework. Esta librería proporciona una serie de funciones que permiten enviar y recibir datos en segundo plano de forma sencilla. A continuación, se muestra un ejemplo sencillo de un controlador en CodeIgniter que recibe datos mediante una llamada asíncrona al servidor utilizando AJAX:
<?php defined('BASEPATH') OR exit('No direct script access allowed'); class Ejemplo extends CI_Controller { public function index() { $this->load->view('formulario'); } public function procesar_ajax() { $nombre = $this->input->post('nombre'); $apellido = $this->input->post('apellido'); // Procesamiento de los datos recibidos $datos['nombre'] = $nombre; $datos['apellido'] = $apellido; echo json_encode($datos); } }
En este ejemplo, el controlador Ejemplo cuenta con dos funciones: index() y procesar_ajax(). La función index() carga la vista formulario, que contiene un formulario HTML que envía los datos mediante una llamada asíncrona utilizando AJAX. La función procesar_ajax() recibe los datos enviados mediante la llamada AJAX y los procesa, antes de devolver una respuesta en formato JSON con los datos procesados. La estructura para la vista formulario sería algo así:
<!DOCTYPE html> <html> <head> <title>Formulario</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#formulario').on('submit', function(e){ e.preventDefault(); $.ajax({ type: "POST", url: "<?php echo site_url('ejemplo/procesar_ajax'); ?>", data: $('#formulario').serialize(), dataType: "json", success: function(data){ $('#nombre').html(data.nombre); $('#apellido').html(data.apellido); } }); }); }); </script> </head> <body> <form id="formulario"> <input type="text" name="nombre" placeholder="Introduce tu nombre..." /> <input type="text" name="apellido" placeholder="Introduce tu apellido..." /> <button type="submit">Enviar datos</button> </form> <div id="resultado"> <p>Nombre: <span id="nombre"></span></p> <p>Apellido: <span id="apellido"></span></p> </div> </body> </html>
En este formulario, tenemos dos campos de tipo texto, uno para el nombre y otro para el apellido, y un botón para enviar los datos mediante una llamada asíncrona utilizando AJAX. La respuesta del servidor se recibe en formato JSON, y se muestra en la página sin necesidad de recargarla, utilizando la función success de jQuery.
En resumen, las llamadas asíncronas utilizando AJAX son una funcionalidad en el desarrollo de aplicaciones web con CodeIgniter y permiten al usuario interactuar con el servidor de forma rápida y eficiente sin necesidad de recargar la página.
