Hyvä Checkout Development - 15 April 2024 (1 day)
After the success of Hyvä Themes, we now have the Hyvä Checkout - a fresh MageWire-based checkout mechanism, extensible, flexible and much more. However, new tech also requires a learning curve. With our course, you can shorten that curve and get started quickly.
- Courses included: 1
- Total video time: 11 hours
- Access period: 1Y
- € 459 for 1 year
- € 42 per hour of video available to you
What do you get with this training:
You'll get a copy of the course materials, including slides, student notes, plus the code used during the training.
No labs. Additional guidance instead.
During the day, there will be no lab exercises. We will focus on knowledge transfer only and be as efficient as possible with the available time. Applying the knowledge in practice can always be done afterwards - and we offer you the option to ask any questions after the training (for instance via Skype or mail). Our experience is that with this method you can jump to results quicker.
More subjects?
Do you have any specific subject that you want to be dealt with during the training? Let us know and we are happy to integrate that subject into the program.
| Price | €459.00 |
|---|---|
| Starting date | Apr 15, 2024 |
| Ending Date | Apr 15, 2024 |
Included courses
Magento 2 Hyvä Checkout Development
Status: Complete
Last updated: 2024-04-19
Number of lessons: 74
Number of slides: 276
Videos: 11 hours
Preview this course
Want to see what this course is like? Checkout our Courseware Demo to preview this course and others.
Course content
Magento 2 Hyvä Checkout Development
- Introduction
- Course introduction
- Meet Hyvä
- Hyvä and checkouts
- Hyvä Checkout
- Requirements for this course
- My Development Setup
- Getting started
- Magewire installation
- Assignment: Install MageWire
- Troubleshooting MageWire installation
- What is MageWire?
- Hyvä Checkout installation
- Configuring Hyvä Checkout
- Create a custom Hyvä Theme
- Customize styling
- Debugging MageWire
- Using the LiveWire DevTools
- MageWire
- Example module with MageWire
- Binding handlers
- Magewire with lists
- Modifiers
- `wire:select` modifier
- Assignment: Create a simple counter component
- Example counter with MageWire
- Example counter with MageWire (advanced)
- Magewire being `dirty`
- Switch a block template in Magewire
- Magewiring forms
- Magic actions
- Add Hyva styling to your component
- Combining MageWire with Alpine
- Initializing content via `wire:init`
- How MageWire loads data
- MageWire HTTP calls
- Component classes
- MageWire, ViewModel or Block?
- Component hooks
- Client-side hooks
- Events and listeners
- JavaScript events
- Magento events
- Different events, different scenarios
- Hydrators
- Nesting components
- Nesting components with same class
- Strong typing and Magewire
- Dom Diffing issues
- Magewire scenarios
- A product finder based on Magewire
- Adding Magewire to the minicart
- Hyva Checkout architecture
- Hyva Checkout architecture overview
- The XML layout of Hyva Checkout
- Blocks, ViewModels and Components
- Steps and step evaluation
- Conditions
- Customizing things
- Something went wrong while trying to load the checkout
- Events
- JavaScript events in checkout
- Magento observable events
- MageWire events
- Form manipulation
- Modifying form fields in the Admin
- Additional EAV shipping address field
- Registering a form modifier
- Common actions in form modifiers
- Form events
- Example: Changing Tailwind classes
- Creating new fields
- Form components
- Magewiring the address
- Checkout scenarios
- Checkout progress bar
- Reordering steps in the checkout
- Additional step in the checkout
- In-store pickup
- JS customization
- Entanglement
- The Magewire JavaScript object
- Payment methods
- Payment methods