fluid-digital.com @fluid_digital
Magento Ecommerce Agency
Magento2CreatingACustomModule
MattEdwardsTechnicalDirectorFluidDigital
@fluid_digitalfluid-digital.com
Magento1vsMagento2
ModuleFileStructure
@fluid_digitalfluid-digital.com
CreatinganewModule
Moduledirectory:app/code/Company/ModuleName
@fluid_digitalfluid-digital.com
RegisterYourModule
Registeryourmodule:registration.php
@fluid_digitalfluid-digital.com
StartAddingInRequiredDirectories
@fluid_digitalfluid-digital.com
Addetc/module.xml
ModuleName:Fluid_BlogVersionNumber:1.0.2
@fluid_digitalfluid-digital.com
SetupandUpgradeScripts
Setup/InstallSchema.php - initialmodulesetupscriptSetup/UpgradeSchema.php – usedforanymoduleupgrades
@fluid_digitalfluid-digital.com
CreatingYourPages
URLstructureforM2iscontrolledbythedirectoryname,filenameandthefrontName setinetc/frontend/routes.xml
/blog/index/index(or/blog)/blog/categories/index(or/blog/categories)
@fluid_digitalfluid-digital.com
@fluid_digitalfluid-digital.com
Creatingthelayout
Eachpageneeds itsownlayoutXMLfile
ThelayoutXMLfilenamesmatchthepreviouslysetURLstructurebutwithunderscoresusedforseparators
frontName_directoryName_controllerName.xml
blog_index_index.xml - usedforthebloglandingpage• frontName – blog• Directory– Index• FileName – Index.php
blog_article_view.xml – usedforthearticlespecificpage• frontName - blog• Directory– Article• FileName – View.php
@fluid_digitalfluid-digital.com
LayoutXMLFile
@fluid_digitalfluid-digital.com
BlockFiles
JustasinMagento1,blockfilescontainfunctions thatareaccessibletotheviewfiles
Theyareusedasaconnectionbetweentheviewandthemodels
HencetheearliertermusedtodescribethedesignpatternMVVM-ModelViewViewModel
@fluid_digitalfluid-digital.com
ModelsModelsinMagento2areverysimilartoMagento1andprovideyouwithCRUDfunctionalityCreate-read-update-delete
Requiredfilesareasfollows:
Model/ModelName.phpModel/Resource/ModelName.phpModel/Resource/ModelName/Collection
@fluid_digitalfluid-digital.com
TemplateFiles
Frontend templatefilesliveinview/frontend/templatedirectory
PrettymuchthesameaMagento1
@fluid_digitalfluid-digital.com
WebFiles(CSS,JS&Images)CSS,JSandimagefilesforamodulearestoredinthedirectory:view/frontend/web/
cssjsimages
LikeMagento1theseareaddedtothepageinthelayoutXMLfileexceptthesyntaxisslightlydifferent
@fluid_digitalfluid-digital.com
FrontendPreview/blog
@fluid_digitalfluid-digital.com
Composer
ComposerallowsyoutoeasilymanagepackagesinMagento
InstallMagento2veryeasilywiththefollowingcommand:composercreate-project--repository-url=https://repo.magento.com/magento/project-community-edition.
Allowsindividualmodules tobeeasilyadded, removedorupgrade
UpgradeMagento2versionbysimplyediting therootcomposer.json filethenrunning composerupdate
@fluid_digitalfluid-digital.com
Howdoescomposertieintoourmodule
Weneed toaddtoourmoduleacomposer.json file
Thisneedstobeaddedtothemodule rootdirectory
Easilyinstallandupdateourmodulecomposer requirefluid/blogcomposerupdate
ConnectstoexternalVCSsuchasgithub
fluid-digital.com @fluid_digital
Magento Ecommerce Agency
Questions?