Fundamentos sobre Cómo Funciona un Componente

From Joomla! Documentation

This page is a translated version of the page Absolute Basics of How a Component Functions and the translation is 100% complete.

Other languages:
বাংলা • ‎Deutsch • ‎English • ‎español • ‎eesti • ‎فارسی • ‎français • ‎हिन्दी • ‎Bahasa Indonesia • ‎italiano • ‎Nederlands • ‎Nederlands (informeel)‎ • ‎português do Brasil • ‎română • ‎русский • ‎українська

Este artículo está pensado para principiantes en Joomlaǃ; está diseñado para explicar que es un componente en Joomlaǃ y cómo funciona. Como un componente específico de ejemplo beneficiará el tutorial, este artículo se refiere al ejemplo del componente llamado Hello Worldǃ.

¿Qué es un Componente de Joomla!?

Un componente es un tipo de extensión de Joomla! . Los componentes son las principales unidades funcionales de Joomla!; pueden verse como mini-aplicaciones. Una analogía fácil sería considerar que Joomla! es el sistema operativo y los componentes son las aplicaciones de escritorio. Creado por un componente, se muestra en el centro del área de contenido principal de una plantilla (dependiendo de la plantilla).

La mayoría de los componentes tienen dos partes principales: la parte de administración y la parte del sitio o interfaz pública. La parte del sitio es lo que se usa para generar las páginas de su sitio web cuando lo solicitan los visitantes, durante una operación normal del sitio web. La parte de administración es la que proporciona una interfaz para configurar y gestionar los distintos aspectos del componente y es accesible a través de la aplicación de administración de Joomla!.

Joomla! viene "de serie" con varios componentes básicos, como el sistema de gestión de contenidos, formularios de contacto y enlaces web.

Ver también: Módulo, Plugin, Plantilla

En el framework de Joomla!, los componentes pueden ser diseñados utilizando un simple modelo (devuelve código HTML de la página solicitada) o el patrón Modelo-Vista-Controlador (en adelante, MVC).

Introducción a MVC

MVC es un patrón de diseño de software que puede ser utilizado para organizar el código de tal manera que la lógica de negocio y la presentación de datos esten separados. La premisa detrás de este enfoque es que si la lógica de negocios se agrupa en una sección, a continuación, la interfaz y la interacción con el usuario que rodea a los datos puede ser modificada y personalizada sin tener que reprogramar la lógica de negocio. MVC fue desarrollado originalmente para el mapa de la entrada tradicional, procesamiento, roles de salida dentro de una lógica de la arquitectura GUI.

Modelo

El modelo es la parte del componente que encapsula los datos de la aplicación. A menudo proporciona rutinas para manejar y manipular este tipo de datos de una manera significativa, además de las rutinas que recuperar los datos desde el modelo. En general, la técnica de acceso a los datos subyacentes debe ser encapsulada en el modelo. De esta manera, si una aplicación se mueve de un sistema que utiliza un archivo plano para almacenar su información a un sistema que utiliza una base de datos, el modelo es el único elemento que necesita ser cambiado, no la vista o el controlador.

Vista

La vista es la parte del componente que se utiliza para presentar los datos a partir del modelo de una manera que sea adecuada para la interacción. Para una aplicación basada en la web, la vista general sería una página HTML que se devuelve al usuario. La vista extrae los datos del modelo (que se pasan desde el controlador) y alimenta los datos en una plantilla que se rellena y se presentan al usuario. La vista no provoca que los datos sean modificados de ninguna manera, sólo se muestran los datos recibidos del modelo.

Controlador

El controlador es responsable de responder a las acciones del usuario. En el caso de una aplicación web, una acción del usuario es generalmente una solicitud de página. El controlador determinará qué solicitud ha sido realizada por el usuario y responderá de forma adecuada mediante la activación del modelo para manipular los datos de forma adecuada y pasar el modelo a la vista. El controlador no mostrará los datos en el modelo, sólo activa los métodos del modelo que modifican los datos y, a continuación, pasan del modelo a la vista que muestra los datos.

Explicación sobre el componente en el Framework de Joomla!

Modelo

En el framework Joomla, los modelos son responsables de la gestión de los datos. La primera función que se debe escribir en un modelo es una función get. Esta devuelve los datos a quien la llame. En nuestro caso, el que llama será la vista HelloWorldViewHelloWorld. De forma predeterminada, el modelo denominado HelloWorldModelHelloWorld que reside en site/models/helloworld.php es el modelo principal asociado a esta vista.

Así que vamos a echar un vistazo rápido a las convenciones de nomenclatura con un ejemplo, ya que la convención de nomenclatura es la magia, que hace todo el trabajo:

La clase HelloWorldViewHelloWorld reside en site/views/helloworld/view.html.php y hará uso de la clase HelloWorldModelHelloWorld en el archivo site/models/helloworld.php

Así que vamos a suponer que queremos utilizar una vista imaginaria fluffy', tendría que tener:

La clase HelloWorldViewFluffy, que reside en site/views/fluffy/view.html.php. La vista va a hacer uso de HelloWorldModelFluffy en el archivo site/models/fluffy.php. Nota: la pantalla de la vista: site/views/fluffy/tmpl/default.php es necesaria para que este ejemplo funcione.

Romper cualquiera de estas convenciones en negrita dará lugar a errores o una página en blanco.


Acceso a un Componente Joomlaǃ

En primer lugar, debemos acceder a la plataforma de Joomla!, a la que siempre se accede a través de un único punto de entrada. Utilizando tu navegador web preferido, ve a la siguiente URL:

1 acceso de usuario <tusitio>/joomla/index.php
2 acceso de administrador <tusitio>/joomla/administrator/index.php

Ejemplo Hola Mundo!: localhost/joomla/index.php

Puedes utilizar la dirección URL del componente, o un Menú con el fin de navegar al componente. En este artículo vamos a discutir el uso de la dirección URL.

1 acceso de usuario <tusitio>/joomla/index.php?option=com_<nombre_componente>
2 acceso de administrador <tusitio>/joomla/administrator/index.php?option=com_<nombre_componente>

Ejemplo Hola Mundo!: localhost/joomla/index.php?option=com_helloworld

MVC Estructura Básica de Directorios

Los componentes se almacenan en un directorio dentro de la instalación de tu sitio Joomla!, específicamente en:

  • htdocs/<ruta_a_joomla>/components/com_<nombre_componente>/ .

El componente Hello World! debe ser almacenado en htdocs/<ruta_a_joomla>/components/com_helloworld/.

Un componente básico contendrá los siguientes archivos dentro de su directorioː

  • Un archivo html que es sólo un archivo de seguridad con un color de fondo: index.html
  • Un archivo php que representa el controlador en si mismo: controller.php
  • Un archivo php que carga la clase del controladorː <nombre_componente>.php
  • Un archivo php que representa al modelo itselfː models/<nombre_componente>.php
  • Otro archivo html para el control del acceso directo: models/index.html
  • Un archivo php que contiene la vista predeterminada: views/<nombre_componente>/tmpl/default.php
  • Un archivo xml para agregar los ítems del menú tipo: views/<nombre_componente>/tmpl/default.xml
  • Otro archivo html para el control del acceso directo: views/<nombre_componente>/tmpl/index.html
  • Otro archivo html para el control del acceso directo: views/<nombre_componente>/index.html
  • Un archivo php para mostrar la vistaː views/<nombre_componente>/view.html.php


JEXEC

La siguiente línea se encuentra comúnmente en el inicio de los archivos PHP de Joomla!:

<?php
    defined('_JEXEC') or die('Restricted Access');

Esto permite un punto de entrada seguro a la plataforma de Joomla!. JEXEC contiene una explicación detallada.

Tutoriales sobre el Diseño de un Componente MVC

Para aprender a diseñar tu propio Componente MVC, por favor estudia el tutorial para tu versión de Joomla!.