background

Magento 2 Frontending course

Een vlot maar grondig overzicht van frontend-ontwikkeling in Magento 2

Een vlot maar grondig overzicht van frontend-ontwikkeling in Magento 2

Het ontwerpen van thema’s in Magento 2 biedt veel flexibiliteit. Hiervoor moet je echter wel verschillende concepten begrijpen, zoals thema-overerving, LESS-compilatie, XML-layout en Block- en ViewModel-klassen. Met onze training krijg je alle informatie die je nodig hebt om je eigen thema aan te passen en uit te breiden.

11+

Hours of video

118

Lessons

371

Pages

Jisse Reitsma

Your teacher Jisse Reitsma

Jisse Reitsma is de ontwikkelaar van meer dan 90 Yireo-extensies en meer dan 200 Loki-extensies. Hij geeft al jaren technische Magento-trainingen, waarbij de nadruk ligt op best practices en hoogwaardige code. Naast zijn vermogen om complexe technologie te doorgronden, is hij bedreven in het voor iedereen begrijpelijk maken van deze kennis. Bij hem kun je rekenen op diepgaande begeleiding en tal van praktische tips.

Pick your On-Demand Magento video course

And you can start right away

On-Demand Preview
€ 0
No strings attached
  • Access to 24 preview lessons
  • More than 248+ minutes of video
  • Student notes where available
  • Free access before diving in full
On-Demand Solo
€ 245
per year per individual
  • Full access to this course
  • More than 11+ hours of video
  • Student notes of 371+ pages
  • Learn at your own pace
On-Demand Bulk
€ 699
per year per individual
  • Access to 100+ hours of Magento courses
  • Student notes of 5559+ pages
  • Ideal if you want to grasp everything

Or go for a teacher-led session

Because everyone has different needs

Classroom
Live Training
See our schedule below
  • Everything under On-Demand Standard
  • Instructor-led classroom
  • Benefit from a real-time interaction
  • Ask any question that you have
Agency
In-House
per training per agency
  • Everything under On-Demand Standard
  • Economical for groups of 5 and more
  • Freely debate company-specific topics
  • On-site at your company office
Agency
Online
per training per agency
  • Everything under On-Demand Standard
  • Ideal for online or hybrid teams
  • Recordings available afterwards
  • Online via Zoom, Teams or similar
background

Join our upcoming training in Baarn

maandag, januari 11, 2027 - donderdag, januari 14, 2027

Schedule for live training

Date
jan 11 - jan 14
Training
Magento Frontend Development Bootcamp
NL
Location
Details

Passen deze data je niet goed? Wil je overschakelen naar een andere taal?
Neem gerust contact met ons op om te kijken welke andere mogelijkheden er zijn.

Magento training topics

Explore your topics of choice

  • Introduction to
  • Development tools
  • Development performance
  • Deployment modes
  • Static content deployment
  • Setting the Magento root
  • Troubleshooting tips
  • Relevant database tables
  • Theme location
  • Creating a theme
  • Parent themes
  • Theme inheritance
  • Theme structure
  • Theme vs module
  • File view.xml
  • Introduction to PHTML templates
  • Using the MageSpecialist DevTools
  • Using mage2tv/cache-clean
  • Overriding a PHTML template
  • Creating a new template
  • PHTML vs HTML templates
  • Debugging PHTML templates
  • Understanding the root template
  • Escaping values in templates
  • XML layout concepts
  • Comparison with Magento 1
  • XML layout essentials
  • Review of homepage demo
  • Handles and handle types
  • Understanding page layouts
  • Adding labels to containers
  • Using containers
  • Adding a new page layout
  • The head section in the layout
  • Blocks in the layout
  • Layout updates
  • Moving elements
  • Removing elements
  • Rendering child elements in blocks
  • Reordering elements
  • Using block templates
  • Block arguments in the XML layout
  • Adding Google fonts
  • Common XML layout modifications
  • Understanding root.phtml
  • Overriding layout
  • Adding FontAwesome
  • Overriding the logo
  • Adding menu-items to the main or the top menu
  • Text blocks
  • Troubleshooting layout issues
  • Setting up Store Views for translation
  • Translating content
  • Translating system strings
  • Using inline translations
  • Creating a custom language pack
  • How JavaScript translations work
  • Module essentials
  • Creating a Block
  • Using ViewModels
  • ViewModels vs Blocks
  • Extending AbstractBlock
  • Working with CMS Blocks
  • Example: Show products that are on sale
  • Assigning variables
  • Example: Adding a product to the footer
  • Layout name vs layout alias
  • Customizing email templates
  • Adding a block to an email template
  • Using Yireo EmailTester
  • CSS strategies
  • How CSS is added via the XML layout
  • Magento its LESS strategy
  • LESS basics
  • To copy Fotorama into a LESS file
  • Removing calendar.css and others
  • One single CSS or separate CSS files?
  • Understanding the @magento_import directive
  • Example module with some LESS
  • LESS compilers
  • Debugging var/view_preprocessed/
  • Including critical CSS
  • CSS responsiveness - the Magento way
  • Best practices for overriding LESS files
  • Using SASS instead of LESS
  • SASS basics
  • Grunt vs Gulp
  • Using Grunt for LESS compilation
  • Grunt tips
  • Frontools Gulp usage
  • Using subodha his Gulp
  • bobmotor Gulp usage
  • General performance tips
  • JS bundling
  • Caching blocks
  • Magento theme type
  • Troubleshooting themes
This course has been updated for compatibility with Magento 2.4.9+

Watch a preview now

See for yourself

Introduction to
Development tools
Development performance

Of blader door alle lessen in ons cursusportaal

We werken ons lesmateriaal voortdurend bij, maar hieronder volgt een momentopname uit de praktijk
Introduction to free 09m 34s
Development tools free 12m 34s
Development performance free 17m 28s
Deployment modes free 24m 04s
Static content deployment 16m 35s
Setting the Magento root free 07m 06s
Troubleshooting tips
Relevant database tables
Theme location free 03m 40s
Creating a theme free 08m 11s
Parent themes free 10m 19s
Theme inheritance free 23m 11s
Theme structure 02m 19s
Theme vs module free 06m 48s
File view.xml
Introduction to PHTML templates 04m 33s
Using the MageSpecialist DevTools free 08m 54s
Using mage2tv/cache-clean free 04m 29s
Overriding a PHTML template free 11m 08s
Creating a new template 13m 03s
PHTML vs HTML templates 05m 44s
Debugging PHTML templates 06m 07s
Understanding the root template
Escaping values in templates
XML layout concepts 07m 24s
Comparison with Magento 1 04m 19s
XML layout essentials 17m 31s
Review of homepage demo free 08m 58s
Handles and handle types 21m 58s
Understanding page layouts 25m 08s
Adding labels to containers 15m 42s
Using containers 14m 48s
Adding a new page layout
The head section in the layout 10m 25s
Blocks in the layout 14m 09s
Layout updates 19m 17s
Moving elements 07m 56s
Removing elements 02m 55s
Rendering child elements in blocks 19m 17s
Reordering elements 08m 57s
Using block templates 14m 16s
Block arguments in the XML layout 20m 02s
Adding Google fonts
Common XML layout modifications
Understanding root.phtml
Overriding layout 04m 38s
Adding FontAwesome
Overriding the logo 21m 02s
Adding menu-items to the main or the top menu
Text blocks 05m 48s
Troubleshooting layout issues
Setting up Store Views for translation free 09m 48s
Translating content 17m 20s
Translating system strings free 09m 16s
Using inline translations
Creating a custom language pack
How JavaScript translations work 20m 10s
Module essentials
Creating a Block
Using ViewModels free 15m 42s
ViewModels vs Blocks free 07m 48s
Extending AbstractBlock 01m 50s
Working with CMS Blocks free 13m 55s
Example: Show products that are on sale
Assigning variables
Example: Adding a product to the footer
Layout name vs layout alias
Customizing email templates 16m 00s
Adding a block to an email template free 04m 15s
Using Yireo EmailTester 03m 09s
CSS strategies free 05m 54s
How CSS is added via the XML layout free 05m 47s
Magento its LESS strategy
LESS basics 04m 25s
To copy Fotorama into a LESS file 09m 25s
Removing calendar.css and others free 04m 04s
One single CSS or separate CSS files? 04m 31s
Understanding the @magento_import directive 15m 50s
Example module with some LESS 09m 57s
LESS compilers 09m 59s
Debugging var/view_preprocessed/ 06m 28s
Including critical CSS
CSS responsiveness - the Magento way free 15m 41s
Best practices for overriding LESS files 09m 31s
Using SASS instead of LESS
SASS basics
Grunt vs Gulp
Using Grunt for LESS compilation 16m 28s
Grunt tips
Frontools Gulp usage
Using subodha his Gulp 05m 03s
bobmotor Gulp usage
General performance tips
JS bundling
Caching blocks 07m 12s
Magento theme type
Troubleshooting themes

These videos are available as an On-Demand video training (with notes). See the pricing for details.

This course has been updated for compatibility with Magento 2.4.9+
Target group

Target group

  • Technische webwinkeliers
  • Stagiairs
  • Webdesigners
  • Frontend-ontwikkelaars
  • Junior backend-ontwikkelaars
ruben-zuidervaart.jpg
Zelfs als je denkt dat je wel het een en ander van Magento weet, weet Jisse je nog steeds nuttige details te vertellen waar je nooit bij stil had gestaan.
Ruben Zuidervaart (Epartment)
Requirements

Requirements

  • Ervaring met het Magento 2-beheerderspaneel
  • Een lokaal draaiende installatie van Magento 2
  • Basiskennis van objectgeoriënteerd PHP en XML
  • Vaardig in HTML en CSS

These are the options we give you

Bij u of bij ons?

Iedereen leert in zijn of haar eigen tempo. Wij bieden zowel trainingen op locatie als openbare trainingen aan in heel Europa – wat het beste bij uw team past. Als er drie of meer ontwikkelaars deelnemen, is een training op maat vaak voordeliger. Neem contact met ons op voor meer informatie.

Je ontvangt cursusmateriaal

Elke workshop gaat gepaard met officieel cursusmateriaal van Yireo. Deelnemers ontvangen na afloop van de training een digitale versie van dit materiaal. Het bevat presentatiedia, toelichtingen en bronvermeldingen. Daarnaast bevatten onze GitHub-repositories nog talrijke andere codevoorbeelden.

Online lessen

Ook online trainingen behoren tot ons aanbod: via Zoom- of Google Hangouts-sessies kan onze docent contact leggen met uw team. Het voordeel hiervan is dat het team zelf ook vanaf verschillende locaties kan inloggen en dat de tijden flexibeler zijn. Na afloop wordt een video-opname met alle deelnemers gedeeld, zodat ze deze later nog eens kunnen bekijken.

On-demand-training in eigen tempo

Deze training is ook beschikbaar als on-demand-training: via talrijke videolessen, inclusief bijbehorende aantekeningen (die op zichzelf al een heel boek vormen), leer je de onderwerpen in je eigen tempo. En als je ergens tegen vragen aanloopt, kun je terugvallen op de begeleiding van de docenten.

ingmar-de-vos.jpg
Een vlotte, diepgaande introductie in Hyvä Checkout en Magewire. Jisse is echt een ervaren en deskundige docent die cursussen geeft aan kleine groepen, met genoeg ruimte voor vragen en voor de inbreng van alle deelnemers
Ingmar de Vos (Mountain IT)

Customer quotes

Deze trainingen vormen een snelkookpan van wat een developer anders in een jaar zou leren Sabine de Vos (Modern Minds)
Jisse legt de relevante techniek op een begrijpelijke manier uit die in de praktijk erg bruikbaar is. De training is intensief, van hoog niveau en van grote toegevoegde waarde, omdat belangrijke concepten helder worden gemaakt en je veel nuttige tips krijgt. Oscar Hilbelink (Madia)
De training maakte pure abstractie behapbaar en verteerbaar Marko Beenink (Mountain IT)
Read more quotes of our customers
background

Yireo could be the right partner for you

We have trained 5000+ developers in numerous disciplines since 2005

  • Professional training at affordable prices
  • Truely active with numerous open source projects in the community
  • Trainings, bootcamps, hackathons, events
  • Passionate, enthousiastic, knowledgable in the right combination

Some of the customers that we have trained in the past years

bold-commerce.png
frmwrk.jpg
pushon.png
and-digital.png
netz98.png
bluebirdday.png
tig.png
limesoda.png
ceezoo.jpg
flint-studios.jpg
vogels.png
gerrits.png
See a more complete listing of our customers

Frequently Asked Questions

Er wordt een minimumaantal deelnemers vermeld. Wat houdt dit in?

Wanneer deze cursus in de vorm van een klassikale training wordt georganiseerd, gaat deze alleen door als het minimumaantal deelnemers is bereikt. Dit aantal is meestal 4, maar soms verlagen we dit naar 2 of 3. Dit minimumaantal betekent simpelweg dat als een cursus niet „vol“ is, u uw geld terugkrijgt of dat uw ticket wordt overgezet naar een andere datum. Bij on-demand cursussen (videocursussen) is dit aantal niet van toepassing.

Hebben jullie een PPP-korting?

Ja, we bieden inderdaad een PPP-korting (Purchasing Power Parity) aan. Voer gewoon `PPP` in als kortingscode en de korting wordt automatisch toegepast op je winkelmandje. We gebruiken de Big Mac-index om de prijzen opnieuw te berekenen. Let op: wanneer je bestelt tegen een specifiek PPP-tarief, moet het land dat je opgeeft in je factuuradres exact overeenkomen met het land van waaruit je de website bezoekt (met andere woorden: je IP-adres moet overeenkomen met het land waarvan je zegt dat je daar vandaan komt).