Magento 2 Hyvä Theme Development - On Demand Training

In stock
SKU
v11
€259.00

This is a pilot only, without videos. Videos are scheduled in Q1 2022.

259 per year
22 per month (billed once a year)
24 per hour of video content available to you

Full details on this course (and its variations) can be found here: https://www.yireo.com/training/magento2-frontend-development-hyva-themes

Included courses

Magento - Hyvä Themes

Status: Complete
Last updated: 2022-05-07
Number of lessons: 72
Number of slides: 311
Videos: 10.8 hours

Preview this course

Want to see what this course is like? Checkout our Courseware Demo to preview this course and others.

Preview all courses

Course content

Magento - Hyvä Themes

  • Introduction
  • Introduction to Hyvä Themes
  • Overview of Hyvä theme packages
  • Overview of Hyvä modules
  • Hyvä admin
  • Quick start
  • Project kickstart
  • Requirements for Hyvä
  • Development tools for Hyvä
  • Installation of Hyvä packages
  • Creating a new Hyva theme
  • Extending the `Hyva/default` theme
  • Discovering the theme
  • Using browser syncing
  • Tailwind CSS
  • Introducing Tailwind CSS
  • Quick start without Hyva
  • Using Windy for Tailwind CSS development
  • Hyvä build modes
  • Tailwind configuration file
  • Configuring breakpoints
  • Configuring colors
  • Tailwind and PostCSS
  • Purging CSS classes
  • Configuring fonts
  • Tailwind plugins
  • Using the prose plugin
  • Using apply
  • Tips and tricks
  • Just-In-Time compilation
  • Hyva_CmsTailwindJit module
  • Extending Tailwind
  • Tailwind 3 upgrade
  • Using PHPStorm for Tailwind development
  • ViewModel classes
  • Using ViewModels
  • Creating a ViewModel for Hyva
  • Working with icons
  • Alpine JS
  • Introducing AlpineJS
  • Basic syntax
  • `x-model` directive
  • Magics
  • The `$el` magic
  • The `$nextTick` magic
  • `x-ref` directive
  • Watching variables
  • `x-cloak` directive
  • `x-spread` directive
  • State management in AlpineJS
  • Copying a slider from alptail
  • Events in AlpineJS
  • Hyva private content
  • Depending on `window.hyva`
  • Loading a CMS Block via GraphQL
  • MageWire
  • Installation
  • Example module with MageWire
  • Checkout with Hyva
  • Checkout options
  • Hyvä checkout aka React checkout
  • Customizing the React checkout
  • Fixing the cart ID
  • Fix duplicate React versions
  • Fix the vendor folder
  • Overriding components
  • React or Preact developer tools
  • React checkout architecture
  • Using context in the React checkout
  • Using the React checkout in production
  • Dealing with CORS issues
  • Compatibility modules
  • Compatibility modules
  • Rewriting Luma scripts to Alpine
  • Using compatibility modules
  • Creating a custom compatibility module
  • Converting an Example Widget module
  • 11-widgets
  • Introduction to Hyvä widgets
  • Tips & tricks
  • Performance tuning
  • Setting equal heights