Yireo - Developer training

Open main menu

Get trained by Yireo on

PWA Studio

ReactJS training by Yireo

ReactJS training by Yireo

Adobe PWA Studio is alive and kicking: It is not a one-click solution though. But that's not its goal either: It serves as a framework for React developers to build their own GraphQL-driven frontend for Magento, using the libraries within PWA Studio as a jumping point. This training guides you into working with PWA Studio and its elements.

Jisse Reitsma

Your teacher will be Jisse Reitsma

This training will be held with Jisse Reitsma as your guide. Jisse is the founder of Yireo, three times Magento Master, partner of ExtDN, trainer and author. Since 2017, Jisse has been developing in React, building various smallish React apps, working with Magento PWA Studio, building the Yireo courseware portal in React and many other things. He is your man when it comes to exploring the possibilities of React.

Pick the learning method that fits you best

Because everyone has different needs

 

On Demand

  • 73 lessons with 9+ hours of video
  • Student notes (367+ pages)
  • Accessible at any moment
  • Learn at your own pace
259
per year per individual

Blended Learning

  • Everything under On Demand
  • Teacher support via email & slack
  • Prioritized requests for new lessons
  • Get the personalized help that you need
369
per year per individual

Custom Training

  • Everything under Blended Learning
  • Economical for groups of 5 and more
  • Freely debate company-specific topics
  • Online or on-site at your company

Custom pricing

per training

There are no scheduled live trainings available

At this moment, there are no trainings scheduled in our agenda. However, we are always busy with planning more, so make sure to check out our online agenda. Alternatively, checkout our on-demand content or feel free to contact us for a custom in-company training.

Current video lessons in one single view

We are constantly updating our courseware, but the following is a real-life snapshot

LessonChapterVideo lengthCreatedAction
Introducing PWA PWA in general 18m 05s 08 Jul 2021Watch for free
Other PWA providers PWA in general 10m 46s 08 Jul 2021Watch for free
PWA Studio and extensibility PWA in general 12m 14s 08 Jul 2021Watch for free
Status of Magento GraphQL PWA in general 08m 50s 17 Feb 2022Watch for free
Architectural choices PWA in general 16m 43s 08 Jul 2021Watch for free
Hybrid React solutions   PWA in general 12m 08s 08 Jul 2021Get access
Introduction to PWA Studio Overview of PWA Studio 16m 32s 28 Apr 2022Watch for free
React essentials React essentials 09m 49s 08 Jul 2021Watch for free
Redux essentials React essentials 10m 51s 17 Feb 2022Watch for free
Introducing Apollo client   Apollo client 08m 56s 08 Jul 2021Get access
Getting started with Apollo Client   Apollo client 16m 10s 08 Jul 2021Get access
Making Apollo calls Apollo client 12m 12s 08 Jul 2021Watch for free
Including GraphQL files   Apollo client 15m 32s 08 Jul 2021Get access
Other Apollo topics   Apollo clientn/a08 Jul 2021Get access
Apollo Client v3   Apollo clientn/a08 Jul 2021Get access
Minimum requirements Kickstart PWA Studio 08m 59s 17 Feb 2022Watch for free
Development tools   Kickstart PWA Studio 05m 31s 17 Feb 2022Get access
Prepare your Magento instance   Kickstart PWA Studio 11m 43s 17 Feb 2022Get access
Installing PWA Studio   Kickstart PWA Studio 16m 27s 08 Jul 2021Get access
First look at PWA Studio   Kickstart PWA Studio 11m 38s 08 Jul 2021Get access
Configuring PWA Studio   Kickstart PWA Studio 13m 40s 08 Jul 2021Get access
Reviewing the .env file   Kickstart PWA Studio 07m 19s 08 Jul 2021Get access
Upgrading PWA Studio   Kickstart PWA Studio 15m 03s 08 Jul 2021Get access
Overview of Buildpack   Buildpack 08m 48s 08 Jul 2021Get access
Introducing Venia Venia 18m 35s 08 Jul 2021Watch for free
Extending Venia Venia 27m 04s 08 Jul 2021Watch for free
Overriding components with the Fooman resolver   Venia 11m 23s 08 Jul 2021Get access
Changing the logo   Venia 11m 16s 08 Jul 2021Get access
Using prices   Venia 02m 58s 08 Jul 2021Get access
mergeClasses   Venia 08m 08s 08 Jul 2021Get access
Adding a new route   Venia 07m 07s 08 Jul 2021Get access
Working with the Mask component   Venia 17m 19s 08 Jul 2021Get access
Toasting   Venia 04m 54s 08 Jul 2021Get access
Best practices with Venia   Venian/a08 Jul 2021Get access
Checkout in Venia   Venia 14m 40s 08 Jul 2021Get access
css-strategies   Venian/a08 Jul 2021Get access
Adding a custom Store View   Venian/a08 Jul 2021Get access
Page Builder integration   Venian/a08 Jul 2021Get access
showing-cms-block   Venian/a08 Jul 2021Get access
Peregrine overview   Peregrine 04m 43s 08 Jul 2021Get access
App or RootComponent?   Peregrinen/a08 Jul 2021Get access
Talons of Peregrine   Peregrine 09m 59s 08 Jul 2021Get access
Example with product talon   Peregrine 07m 51s 08 Jul 2021Get access
Routing in PWA Studio   Peregrine 05m 46s 17 Feb 2022Get access
Context within PWA Studio   Peregrine 13m 36s 08 Jul 2021Get access
Redux within PWA Studio   Peregrine 11m 17s 08 Jul 2021Get access
How the homepage shows CMS content   Peregrinen/a19 Jan 2022Get access
Build it without Venia   Build it your own 11m 04s 08 Jul 2021Get access
Implementing Venia and Peregrine partially   Build it your own 09m 40s 08 Jul 2021Get access
Target interception   Target interception 05m 06s 08 Jul 2021Get access
Creating a target interceptor Target interception 08m 16s 17 Feb 2022Watch for free
Venia targets   Target interception 09m 02s 08 Jul 2021Get access
Peregrine targets   Target interception 09m 09s 08 Jul 2021Get access
Buildpack targets   Target interception 09m 19s 08 Jul 2021Get access
Targetables   Target interception 11m 08s 17 Feb 2022Get access
Declaring custom targets   Target interceptionn/a08 Jul 2021Get access
PWA Studio extensions   Target interceptionn/a08 Jul 2021Get access
Overview of UPWARD UPWARD 09m 46s 08 Jul 2021Watch for free
Running UPWARD UPWARD 12m 06s 06 Nov 2021Watch for free
UPWARD YAML configuration   UPWARD 09m 57s 17 Feb 2022Get access
Automatic image optimization UPWARD 09m 29s 08 Jul 2021Watch for free
Running Venia without UPWARD UPWARD 12m 39s 08 Jul 2021Watch for free
In production   In production 09m 43s 08 Jul 2021Get access
Using PM2   In productionn/a08 Jul 2021Get access
Server Side Rendering   In production 16m 03s 08 Jul 2021Get access
Varnish caching   In productionn/a08 Jul 2021Get access
Using StoryBook for your PWA Studio project   Storybookn/a08 Jul 2021Get access
Running a PWA Studio project   Tips and tricksn/a08 Jul 2021Get access
Handy Yireo extensions   Tips and tricksn/a08 Jul 2021Get access
Hybrid React solutions   Tips and tricksn/a08 Jul 2021Get access
Adobe Experience Manager   Adobe and Reactn/a30 Jul 2021Get access
Adobe and React   Adobe and Reactn/a08 Jul 2021Get access
Conclusion   Summary 01m 59s 08 Jul 2021Get access

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

These are the options we give you:

At your place or ours?

Everyone learns at her/his own pace. We provide both in-house training and public training throughout Europe - whatever suits your team best. When 3 or more developers are attending, a custom training is often more economical. Contact us for more details.

You'll get courseware

Every workshop is accompanied with official Yireo coursematerial. Attendees are sent a digital version of this material after the training. It contains slides, comments and references. Additionally, our GitHub repos contain numerous more code samples.

Online classrooms

Online trainings are also our training: Via Zoom or Google Hangout sessions, our teacher is able to connect with your team. The benefit here is that the team is able to connect from various places itself as well, timeframes are more flexible. Afterwards, a video recording will be shared with all attendees for reference.

On-demand self-paced training

This training is also available as an On-Demand training: Via numerous video lessons, including accompanying student notes (equalling a book on their own), you'll learn about the topics in your own pace. And when you bump into questions, you can fall back to the teachers guidance.

Why Yireo?

  • Professional trainings at affordable prices
  • Active with numerous open source projects
  • Passionate, enthousiastic, knowledgable

We have trained 5000+ developers in numerous disciplines since 2005

Training topics

  • Introducing PWA
  • Other PWA providers
  • PWA Studio and extensibility
  • Status of Magento GraphQL
  • Architectural choices
  • Hybrid React solutions
  • Introduction to PWA Studio
  • React essentials
  • Redux essentials
  • Introducing Apollo client
  • Getting started with Apollo Client
  • Making Apollo calls
  • Including GraphQL files
  • Other Apollo topics
  • Apollo Client v3
  • Minimum requirements
  • Development tools
  • Prepare your Magento instance
  • Installing PWA Studio
  • First look at PWA Studio
  • Configuring PWA Studio
  • Reviewing the .env file
  • Upgrading PWA Studio
  • Overview of Buildpack
  • Introducing Venia
  • Extending Venia
  • Overriding components with the Fooman resolver
  • Changing the logo
  • Using prices
  • mergeClasses
  • Adding a new route
  • Working with the Mask component
  • Toasting
  • Best practices with Venia
  • Checkout in Venia
  • css-strategies
  • Adding a custom Store View
  • Page Builder integration
  • showing-cms-block
  • Peregrine overview
  • App or RootComponent?
  • Talons of Peregrine
  • Example with product talon
  • Routing in PWA Studio
  • Context within PWA Studio
  • Redux within PWA Studio
  • How the homepage shows CMS content
  • Build it without Venia
  • Implementing Venia and Peregrine partially
  • Target interception
  • Creating a target interceptor
  • Venia targets
  • Peregrine targets
  • Buildpack targets
  • Targetables
  • Declaring custom targets
  • PWA Studio extensions
  • Overview of UPWARD
  • Running UPWARD
  • UPWARD YAML configuration
  • Automatic image optimization
  • Running Venia without UPWARD
  • In production
  • Using PM2
  • Server Side Rendering
  • Varnish caching
  • Using StoryBook for your PWA Studio project
  • Running a PWA Studio project
  • Handy Yireo extensions
  • Hybrid React solutions
  • Adobe Experience Manager
  • Adobe and React
  • Conclusion

Audience

Webdesigners
Frontend developers
Programmers

Requirements

Skilled in HTML, CSS and JavaScript
Skilled with React (props, local state, hooks, routing, life-cycle)
Skilled in ES6 syntax (arrow functions, destructors, let/const)
Ability to run React on your local environment
Some knowledge of Redux, Apollo Client and GraphQL is recommended

Frequently Asked Questions

There is a minimum number of attendees listed. What does this mean?

The training is only held when there is a number of attendees. This number is usually 4 but sometimes we bring this down to 2 or 3. This minimum number simply means that if a class is not "full", either you get a refund or your ticket is transferred to another date.

Jisse Reitsma

The teacher: Jisse Reitsma

Thus it came to be

When Jisse started with Magento, he already had years of experience programming in Joomla (back in the days when Joomla was actually the #1 CMS - believe it or not). Back then, open source cart solutions were lacking and Magento 1.0 brought a lot of hope.

Quickly Jisse dived into the new architecture: In 2009, he built his first extensions, among which the fundaments of a bridge between Joomla and Magento (MageBridge) and various project-specific extensions (among which payment providers and custom MVC/EAV modules).

A relieve

Over the years, he experienced what most Magento developers experienced with M1: A lot of power, but also frustration. After a couple of years, it no longer was cutting-edge and it barely adopted new developer standards. When the new Magento 2.0 alpha 1 came out, Jisse started playing with it. And he was relieved to see modern tools in its architecture: Composer, PHP namespacing, testability, CLI-driven management, proper design patterns.

Again, after building some modules and dummy projects, the first Magento 2 developer training was given in January 2017 (two months after the official release) and numerous M2 trainings have followed for both backend developers, frontend developers and devops.

Frontend sagas

Currently, with Magento 2 being several years old now, the fuzz is no longer about its backend architecture: It is the frontend that matters. Jisse has given numerous frontend development trainings, where people complain about LESS (and not SASS) being used, loading times to be slow (while in fact M2 allows for enough tuning to make it bloody fast), an archaic combo of Knockout/RequireJS (while they both serve their purpose in regards to backwards compatibility).

PWA is the new keyword. Jisse has dived into React, Redux & service workers in combination with GraphQL and NodeJS tools. He is currently working in various initiatives to help developers embrace the new frontend stack (ExtDN, Vue Storefront, DEITY). Also, he has added Docker and Kubernetes to his vocabulary.

As of yet, it is fair to say that Magento holds little surprises for Jisse. He is your guy to train you or your developers properly in both backend and frontend technology.

Training

Extensions

GitHub organizations

Legal information

Other Yireo sites

Get Social

About Yireo