Magento 2 Hyvä Theme Development On Demand Training

In stock
SKU
v11
€259.00
  • Courses included: 1
  • Total video time: 11 hours
  • Access period: 1Y
  • € 259 for 1 year
  • € 24 per hour of video 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

More Information
Price €259.00
Access period 1 year

Included courses

Magento 2 Hyvä Theme Development

Status: Complete
Last updated: 2024-09-25
Number of lessons: 81
Number of slides: 325
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 2 Hyvä Theme Development

  • Introduction
  • Introduction to Hyvä Themes
  • Overview of Hyvä theme packages
  • Overview of Hyvä modules
  • Hyvä Admin
  • Assignment: Install Hyva Admin
  • Quick start
  • Running a project in Hyvä
  • Requirements for Hyvä
  • Assignment: Prepare your Magento environment for Hyva
  • Development tools for Hyvä
  • Assignment: Install of the relevant development tools
  • Installation of Hyvä packages
  • Assignment: Install Hyva
  • Assignment: Remove the demo content
  • Creating a new Hyva theme
  • Assignment: Create a new Hyva theme
  • Extending the `Hyva/default` theme
  • Discovering the `Hyva/default` theme
  • Using browser syncing
  • Tailwind CSS
  • Introducing Tailwind
  • Quick start
  • Assignment: Kickstart a simple non-Magento app using Tailwind
  • Using Windy for Tailwind CSS development
  • Hyvä build modes
  • Tailwind configuration file
  • Configuring breakpoints
  • Configuring colors
  • Working with PostCSS
  • Optimizing CSS classes
  • Purging Magento modules
  • Configuring fonts
  • Tailwind plugins
  • Using the prose plugin
  • Assignment: Make sure your WYSIWYG output displays properly
  • The workings of `@apply`
  • Tips and tricks
  • Just-In-Time Mode
  • Hyva_CmsTailwindJit module
  • Tailwind 3 upgrade
  • Using PhpStorm for Tailwind development
  • ViewModel classes
  • Using ViewModels
  • Creating a ViewModel for Hyva
  • Assignment: Create a ViewModel
  • Working with icons
  • Alpine JS
  • Introduction to AlpineJS
  • Basic syntax
  • `x-model` directive
  • Magics
  • The `$el` magic
  • The `$nextTick` magic
  • `x-ref` directive
  • Watching variables
  • `x-cloak` directive
  • `x-spread` directive
  • Nested data
  • AlpineJS state
  • Copying a slider from alptail
  • JavaScript events in Hyva
  • Hyva private content
  • Depending on `window.hyva`
  • Mixing AJAX call with events
  • Loading a CMS Block via GraphQL
  • Checkout with Hyva
  • Checkout options
  • Hyvä 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
  • Rewrite Luma scripts to Alpine
  • Using compatibility modules
  • Creating a compatibility module
  • Converting an Example Widget module
  • Widgets
  • Introduction to Hyvä widgets
  • Tips & tricks
  • Performance tips
  • Equal heights solutions