Come creare un'estensione Hello World in Magento 2

Creeremo un'estensione molto semplice in Magento 2. Al termine, l'output dell'estensione dirà "Ciao Weblizar, questa è la tua prima estensione Magento Hello World! ” nel contenuto del blocco su un percorso frontend personalizzato. Impariamo come creare un'estensione in magento 2 con hello world come output.

Requisiti :

Nella lista, hai l'ultima versione di Magento 2 che è attualmente 2.1. È installato sul tuo sistema locale.

Prima di iniziare lo sviluppo di un'estensione Magento 2, ci sono due cose che le persone spesso dimenticano e ti consigliamo di fare:

1. Disabilita la cache Magento

Disabilitare la cache di Magento durante lo sviluppo ti farà risparmiare tempo perché non dovrai svuotare manualmente la cache ogni volta che apporti modifiche al tuo codice.

Il modo più semplice per disabilitare la cache è andare su Admin => System => Cache Management => selezionare tutti i tipi di cache e disabilitarli.

2. Metti Magento in una modalità sviluppatore

Dovresti mettere Magento in una modalità sviluppatore per assicurarti di vedere tutti gli errori che Magento ti sta lanciando.

Per fare ciò, apri il tuo terminale e vai alla radice di Magento 2. Da lì dovresti eseguire il seguente comando:

php bin/magento deploy:mode:set developer

Come creare un'estensione in Magento:

Creazione dei file e delle cartelle di estensione:
Configurazione dell'estensione
Il primo passo è creare la cartella dell'estensione e i file necessari per registrare un'estensione Magento.
1. Crea le seguenti cartelle:

• app/codice/Weblizar
• app/codice/Weblizar/Helloworld

La cartella Weblizar è lo spazio dei nomi dell'estensione e Helloworld è il nome dell'estensione.
Nota: se non hai la cartella del codice nella directory dell'app, creala manualmente.

2. Ora che abbiamo una cartella di estensione, dobbiamo creare un file module.XML nella cartella app/code/Weblizar/Helloworld/etc con il seguente codice:

<?versione xml=”1.0″?>
<config xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xsi:noNamespaceSchemaLocation=”urn:magento:framework:Module/etc/module.xsd”>
<module name=”Weblizar_Helloworld” setup_version=”1.0.0″></module>
</config>

3. Per registrare il modulo, creare un file registration.php nella cartella app/code/Weblizar/Helloworld con il seguente codice:

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE,
'Weblizar_Helloworld',
__DIR__
); ?>

4. Apri il tuo terminale e vai alla radice di Magento 2. Esegui da lì il seguente comando:

php bin/configurazione magento: aggiornamento

Se vuoi assicurarti che l'estensione sia installata, puoi andare su Admin => Stores => Configurazione => Avanzate => Avanzate e verifica che l'estensione sia presente nell'elenco oppure puoi aprire app/etc/config.php e controlla l'array per la chiave 'Weblizar_Helloworld', il cui valore dovrebbe essere impostato su 1.

Creazione di un controllore

1. Per prima cosa dobbiamo definire il router. Per fare ciò, crea un file route.XML nella cartella app/code/Weblizar/Helloworld/etc/frontend con il seguente codice:

<?versione xml=”1.0″?>
<config xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xsi:noNamespaceSchemaLocation=”urn:magento:framework:App/etc/routes.xsd”>
<ID router=”standard”>
<route id=”helloworld” frontName=”helloworld”>
<module name="Weblizar_Helloworld" />
</percorso>
</router>
</config>

Qui stiamo definendo il nostro router frontend e il percorso con un id "helloworld".

L'attributo frontName sarà la prima parte del nostro URL.

In Magento 2 gli URL sono costruiti in questo modo:
<frontName>/<controler_folder_name>/<controller_class_name>

Quindi nel nostro esempio, l'URL finale sarà simile a questo:

ciaomondo/indice/indice

2. Ora creiamo il file del controller Index.php nella cartella app/code/Weblizar/Helloworld/Controller/Index con il seguente codice:

<?php

spazio dei nomi Weblizar\Helloworld\Controller\Indice;

usa Magento\Framework\App\Action\Context;

Class Index estende \Magento\Framework\App\Action\Action
{
protetto $_resultPageFactory;

funzione pubblica __construct(Context $context, \Magento\Framework\View\Result\PageFactory $resultPageFactory)
{
$questo->_resultPageFactory = $resultPageFactory;
genitore::__construct($contesto);
}

funzione pubblica esegui()
{
$resultPage = $this->_resultPageFactory->crea();
restituisce $risultatoPagina;
}
}

In Magento 2 ogni azione ha la sua classe che implementa il metodo execute().

Creazione di un blocco

Creeremo una semplice classe di blocco con il metodo getHelloWorldTxt() che restituisce la stringa "Hello world".

1. Crea un file Helloworld.php nella cartella app/code/Weblizar/Helloworld/Block con il seguente codice:

<?php
spazio dei nomi Weblizar\Helloworld\Block;

class Helloworld estende \Magento\Framework\View\Element\Template
{
funzione pubblica getHelloWorldTxt()
{
return 'Ciao Weblizar, questa è la tua prima estensione magento di ciao mondo!';
}
}

Creazione di un layout e file modello

In Magento 2, i file di layout e i modelli vengono inseriti nella cartella di visualizzazione all'interno dell'estensione. All'interno della cartella di visualizzazione, possiamo avere tre sottocartelle: adminhtml, base e frontend.
La cartella adminhtml viene utilizzata per l'amministratore, la cartella frontend viene utilizzata per il frontend e la cartella di base viene utilizzata sia per i file admin che per i file frontend.

1. Innanzitutto, creeremo un file helloworld_index_index.XML nella cartella app/code/Weblizar/Helloworld/view/frontend/layout con il seguente codice:

<pagina xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance” xsi:noNamespaceSchemaLocation=”../../../../../../../lib /interno/Magento/Framework/
Visualizza/Layout/etc/page_configuration.xsd” layout="1colonna">
<corpo>
<nome contenitore di riferimento=”contenuto”>
<block class=”Weblizar\Helloworld\Block\Helloworld” name=”helloworld” template=”helloworld.phtml” />
</referenceContenitore>
</corpo>
</pagina>

Ogni pagina ha una mano di layout e per la nostra azione del controller, l'handle di layout è helloworld_index_index. È possibile creare un file di configurazione del layout per ogni handle di layout.

Nel nostro file di layout, abbiamo aggiunto un blocco al contenitore dei contenuti e impostato il modello del nostro blocco su helloworld.phtml, che creeremo nel passaggio successivo.

2. Crea un file helloworld.phtml nella cartella app/code/Weblizar/Helloworld/view/frontend/templates con il codice seguente:

<h1><?php echo $this->getHelloWorldTxt(); ?></h1>

$questa variabile fa riferimento alla nostra classe di blocco e stiamo chiamando il metodo getHelloWorldTxt() che restituisce la stringa 'Hello world!'.

E questo è tutto. Apri l'URL /helloworld/index/index nel tuo browser e dovresti ottenere qualcosa del genere e

Clicca qui per scaricare l'estensione Hello World Magento