PWA Studio course
A proper outline of Venia, Peregrine, UPWARD and much much more
A proper outline of Venia, Peregrine, UPWARD and much much more
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.
9+
Hours of video
63
Lessons
351
Pages
Your teacher Jisse Reitsma
Jisse Reitsma is the main man behind Yireo. Author, trainer and developer. He is board member of Mage-OS Nederland and a three-times Magento Master.
Pick your On-Demand Magento video course
And you can start right away
On-Demand Preview
€
0
(USD 0)
No strings attached
- Access to 17 preview lessons
- More than 222+ minutes of video
- Student notes where available
- Free access before diving in full
On-Demand Solo
€
259
(USD 297)
per year per individual
- Full access to this course
- More than 9+ hours of video
- Student notes of 351+ pages
- Learn at your own pace
On-Demand Bulk
€
1249
(USD 1436)
per year per individual
- Access to 93+ hours of Magento courses
- Student notes of 5212+ pages
- Ideal if you want to grasp everything
Or go for a teacher-led session
Because everyone has different needs
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
Magento training topics
Explore your topics of choice
- 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
- 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
- Peregrine overview
- App or RootComponent?
- Talons of Peregrine
- Example with product talon
- Routing in PWA Studio
- Context within PWA Studio
- Redux within PWA Studio
- Build it without Venia
- Implementing Venia and Peregrine partially
- Target interception
- Creating a target interceptor
- Trusted vendors
- Venia UI 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
- Server Side Rendering
- Summarizing Magento PWA Studio
This course has been updated for compatibility with React 18 and Magento 2.4.7-p1
Watch a preview now
See for yourself
Introducing PWA
Other PWA providers
PWA Studio and extensibility
Or browse through all lessons in our courseware portal
We are constantly updating our courseware, but the following is a real-life snapshot
Hybrid React solutions
12m 08s
Introducing Apollo Client
08m 56s
Getting started with Apollo Client
16m 10s
Including GraphQL files
15m 32s
Apollo Client v3
Development tools
05m 31s
Prepare your Magento instance
11m 43s
Installing PWA Studio
16m 27s
First look at PWA Studio
11m 38s
Configuring PWA Studio
13m 40s
Reviewing the .env file
07m 19s
Upgrading PWA Studio
15m 03s
Overview of Buildpack
08m 48s
Overriding components with the Fooman resolver
11m 23s
Changing the logo
11m 16s
Using prices
02m 58s
mergeClasses
08m 08s
Adding a new route
07m 07s
Working with the Mask component
17m 19s
Toasting
04m 54s
Best practices with Venia
Checkout in Venia
14m 40s
CSS strategies
Adding a custom Store View
Page Builder integration
Peregrine overview
04m 43s
App or RootComponent?
Talons of Peregrine
09m 59s
Example with product talon
07m 51s
Routing in PWA Studio
05m 46s
Context within PWA Studio
13m 36s
Redux within PWA Studio
11m 17s
Build it without Venia
11m 04s
Implementing Venia and Peregrine partially
09m 40s
Target interception
05m 06s
Trusted vendors
Venia UI targets
09m 02s
Peregrine targets
09m 09s
Buildpack targets
09m 19s
Targetables
11m 08s
Declaring custom targets
PWA Studio extensions
UPWARD YAML configuration
09m 57s
In production
09m 43s
Server Side Rendering
16m 03s
Summarizing Magento PWA Studio
01m 59s
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 React 18 and Magento 2.4.7-p1
Target group
- Webdesigners
- Frontend developers
- Programmers
A crash course by Yireo is like to be Neo learning Kung FuTjitse Efdé (Vendic)
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
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.
The training made pure abstraction manageable and digestibleMarko Beenink (Mountain IT)
Customer quotes
Jisse gave a very interesting, practical and well-constructed story about the Magento 2 jungle Peter Keijsers (Experius)
Jisse understands how you can put your brain to work and keep you constantly on the edge of your seat Kayne Spikker (Modern Minds)
Structured training measured my general knowledge of e-commerce and Magento is verbal. Goal achieved! Erwin de Groot (Vendic)
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
Frequently Asked Questions
There is a minimum number of attendees listed. What does this mean?
When this course is organized in the form of a classroom-training, it is only held if there is a minimum 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. With On-Demand courses (video courses), this number is not applicable.
Do you have any PPP discount available?
Yes, we do have a PPP (Purchasing Power Parity) discount available. Just enter `PPP` as a coupon code and the discount will be applied to your cart. We are using the Big Mac Index to recalculate prices. Note that - when ordering for a specific PPP rate - the country that you're entering in your billing address needs to match the exact country that you are visiting from (in other words: your IP needs to match the country you say you're from).
