Overview & expectations of the FAQ module

Welcome to the Build a Magento Admin Grid Course! In this course, we will focus on building an admin grid using the newer method, which involves UI components. This method gives you access to the entire library of UI components in Magento, many of which are dedicated to be used in the admin area. The main component used to create an admin grid is the listing grid, which implements many related components that are readily available.

Advantages of Using UI Components

UI components integrate and communicate with each other effectively, something that is not possible in the older style of building admin grids. One of the great aspects of building admin grids with UI components is that you don’t need to be intimately familiar with all of the different components and their JavaScript implementations. Almost all of the admin grid functionality is built with XML, so you only need to know the different nodes and XML attributes that you can call and set values on. This makes it simple to integrate complex components together and build advanced functionality that would typically take longer to develop.

Building an FAQ Module

Before we start building an admin grid, let’s go over the requirements for the module we will be building. The user story or summary is as follows: “As an admin user, I’d like to be able to create, edit, and delete Frequently Asked Questions (FAQs) and Answers concerning this store or ordering process in general, so that we can eventually display them on the front end of our website for visitor consumption and to ease customer support requests.” We will be building an FAQ module that contains questions and answers to frequently asked questions.

The admin grid should provide CRUD (create, read, update, delete) functionality for admin users, as well as granular user access controls to determine whether a specific admin user can view, save, or delete questions.

Visual Mock-Up

A visual mock-up of the admin grid shows a list of FAQs, with the ability to select them, conduct mass actions, filter related data, and control column visibility. The admin grid should also have basic pagination and the ability to search FAQs.

Technical Assumptions

It’s a good idea to define technical assumptions upfront to prevent any questions or confusion later on in the project. For the scope of this course, we will only focus on building a functional admin grid, not specific admin forms or front end site implementations. These topics will be covered in subsequent courses.

Fields for FAQs

  1. Question (text data type): A basic field that contains the question.
  2. Answer (text data type): A basic field that contains the answer.
  3. Is_published (boolean): A drop-down that can be toggled to Yes or No. This field will be used to control whether or not the FAQ will display on the front end of the site.
  4. Created_at and Updated_at (datetime fields): Auto-populated fields that contain the date and time when the question is created or updated, respectively.
  5. Search Box: A search box that queries the contents of the question field.
  6. Additional Filters: Filters that show FAQs matching specified criteria.
  7. Pagination: A setup to accommodate any number of records.

Time Estimates

For experienced developers, building this module can take between 3 and 5 hours. For beginner or intermediate developers, it may take between 5 and 8 hours or longer. Don’t worry if it takes longer, as the more you work with admin grids, the more they will start to make sense, and you will find yourself building these admin grids faster in the future.

Complete and Continue  
Extra lesson content locked
Enroll to access all lessons, source code & comments.
Enroll now to Unlock