Transform Magento 2 Admin Grids & Forms course image

Transform Magento 2 Admin Grids & Forms

Custom data management in the admin got you down? Learn how to simply build grids & forms in Magento 2 with UI Components.

43 lessons

4h 28m

View enrollment options

If you've tried building admin grids & forms, you've most likely gotten lost along the way. You start building out a grid, then everything seems to fall apart. The documentation is non-existant, and every blog post you stumble upon is either outdated, confusing, or didn't at all explain what is going on.

It's copy -> paste -> prayer.

Wouldn't it be better if you were able to build out grids, without confusion? I've put so many hours to solve this problem, and the result is this course. Finally learn Magento admin grids & forms once & for all.

Meet Mark, the course teacher

Transform your knowledge of Magento Admin Grids & Forms

Build a custom admin grid & form with UI Components, and understand it all

The OMG moment you've been waiting for

Sick of copying & pasting someone elses admin grid implementation from Stack Overflow or Magento Stack Exchange, only to not at all understand what is going on?

This course breaks down building an admin grid, one step at a time. Finally "get" what's going on in that huge block of admin grid XML.

  • Learn visually

    By watching the instructor program in front of your eyes, you will learn faster than trying to source and read documentation.

  • Full source code

    After watching the lessons, easily reference the source code on GitHub to build out features for your upcoming projects.

Code example of custom UI Component

Start simple, then keep going

This course doesn't assume you know what is going on with these admin grids. It starts with the basics of setting up user access controls and database structures, then progresses through lessons with increased difficulty.

  • Concise XML syntax

    Most blog articles & documentation use a longer-form XML syntax to create admin grids, causing you to type for days. This course uses the more concise syntax, saving you time, typing & debugging.

  • Understand without overwhelming

    Admin grids can be very overwhelming. Rather than throwing the entire kitchen sink at you, we'll go over each specific concept together, one lesson at a time.

Admin grid sample video

“This Admin course was great! I'm very happy to be inside M.academy learning all of this. I'm anxious to learn more. Thank you a lot for sharing your knowledge.”  

Course curriculum

Each video lesson can be played back & referenced as many times as you wish at slow or fast speed, tech-friendly closed captions, and includes full source code.

Includes Spanish translations provided by Google Translate

43 lessons

4h 28m

Admin Grids

Overview & expectations of the FAQ module
Free preview
Overview & expectations of the FAQ module
Prep environment for admin grid development
Free preview
Prep environment for admin grid development
Create the module & define dependencies
Free preview
Create the module & define dependencies
Create admin user resource permissions
Free preview
Create admin user resource permissions
Create admin menu items
Create admin menu items
Create an admin route
Create an admin route
Create an admin controller
Create an admin controller
Set an admin page menu & title
Set an admin page menu & title
Create a model, resource model & collection
Create a model, resource model & collection
Create a new database table
Create a new database table
Populate a database table with data
Populate a database table with data
Create a virtual class for the grid collection
Create a virtual class for the grid collection
Create the simplest admin grid
Create the simplest admin grid
Exercise: Add additional columns to an admin grid
Exercise: Add additional columns to an admin grid
Implement an alternate component for an admin grid column
Implement an alternate component for an admin grid column
Create an admin grid actions column
Create an admin grid actions column
Exercise: Transform the admin actions column into a dropdown
Exercise: Transform the admin actions column into a dropdown
Create an admin edit controller action
Create an admin edit controller action
Create an admin delete controller action
Create an admin delete controller action
Make an entire admin grid row into a clickable action
Make an entire admin grid row into a clickable action
Add paging, column toggles & stickiness to the admin grid
Add paging, column toggles & stickiness to the admin grid
Add bookmarks to the admin grid & diagnose caching issues
Add bookmarks to the admin grid & diagnose caching issues
Exercise: Sort an admin grid by a column value
Exercise: Sort an admin grid by a column value
Add filters to an admin grid
Add filters to an admin grid
Set default filters on an admin grid
Set default filters on an admin grid
Add a fulltext search box to an admin grid
Add a fulltext search box to an admin grid
Add a primary action button to an admin grid
Add a primary action button to an admin grid
Create an admin controller for addming new records
Create an admin controller for addming new records
Set up the UI for admin grid inline editing
Set up the UI for admin grid inline editing
Create an admin grid inline edit controller action
Create an admin grid inline edit controller action
Set up the UI for an admin grid mass action delete
Set up the UI for an admin grid mass action delete
Handle an admin grid mass action delete submission
Handle an admin grid mass action delete submission

Admin Forms

Create a UI Component DataProvider class in PHP
Create a UI Component DataProvider class in PHP
Render the admin form UI Component with page layout XML
Render the admin form UI Component with page layout XML
Create the structure of an admin form UI Component
Create the structure of an admin form UI Component
UI Component templates & definitions
Free preview
UI Component templates & definitions
Define the UI Component namespace & data scope with settings
Define the UI Component namespace & data scope with settings
Define a UI Component Data Provider using dataSource
Define a UI Component Data Provider using dataSource
Define the data source as a dependency to the UI Component
Define the data source as a dependency to the UI Component
Render a fieldset and text form inputs
Render a fieldset and text form inputs
Creating & rendering select dropdown form fields
Creating & rendering select dropdown form fields
Create a Save button for an admin form UI Component
Create a Save button for an admin form UI Component
Create a form save action with pseudo code
Create a form save action with pseudo code
Implement the admin form save action logic
Implement the admin form save action logic
Create a Back button to cancel an admin form submission
Create a Back button to cancel an admin form submission
Creating admin form validation rules
Creating admin form validation rules

Enroll in the course

Start learning M2 today

Choose the best option for you & your team.

This course All courses
Team
$ 897
one-time payment for your team
 

  • Train up to 5 on your team

  • Lifetime access to this course

  • Free updates for life

  • Full source code

Enroll your team
Individual
$ 299
one payment for lifetime access
 

  • License for a single user

  • Lifetime access to this course

  • Free updates for life

  • Full source code

Enroll in this course

“Thanks for yet another great course Mark. Although I'm more frontend-focused, it was great to follow through with this Admin course. Your explanations are very clear and precise, making it very easy to follow through. Looking forward to more courses related to this series.”  

Lewis Charlton
Lewis Charlton Lewis Charlton
Certified Frontend Magento Developer, Interjar

Frequently asked questions

What will I get out of this course?
Upon completing this course, you will have all of the basic knowledge to build your own custom admin grid in Magento 2. This includes setting up user access controls, the database & model structure, the simplest admin grid, and then expanding on the grid by adding pagination, filters, sorts, bookmarks, and other implementing other admin grid UI Components.
What do I need to know to take this course?
This course assumes you have a solid knowledge of Magento 2 backend programming. This is more of an intermediate or advanced course, so if you are a beginner to Magento, you may struggle to follow along.
Do I need a development environment setup?
Yes, this course assumes you have a running development environment of Magento setup and running locally. If you don't already have a development environment setup, please set one up before enrolling in the course. M.academy has a free course, Set Up a Magento 2 Development Environment with Docker.
What version of Magento is this based on?
This course was created using concepts featured in Magento version 2.4. If a new best-practice approach is introduced in a future version of Magento 2, the course will be updated appropriately.
Will I receive anything upon course completion?
Upon completion of the course, you'll receive a certificate of completion signed by the course instructor. This demonstrates to potential employees that you have the basic underlying knowledge to build an admin grid in Magento 2. If your employer offers continuing education stipends, you may also be able to use this certificate to get the cost reimbursed by your employer.
What if I need a business invoice?
Invoices now contain fields for company name and VAT number. As long as you add your company name at checkout, you will automatically receive a business invoice emailed to you after purchase.