Step 9: Setting up an Admin Backend

5.0 version
Maintained

Setting up an Admin Backend

Adding upcoming conferences to the database is the job of project admins. An admin backend is a protected section of the website where project admins can manage the website data, moderate feedback submissions, and more.

How can we create this fast? By using a bundle that is able to generate an admin backend based on the project’s model. EasyAdmin fits the bill perfectly.

Configuring EasyAdmin

First, add EasyAdmin as a project dependency:

1
$ symfony composer req "admin:^2.0"

To configure EasyAdmin, a new configuration file was generated via its Flex recipe:

config/packages/easy_admin.yaml
1
2
3
4
5
6
#easy_admin:
#    entities:
#        # List the entity class name you want to manage
#        - App\Entity\Product
#        - App\Entity\Category
#        - App\Entity\User

Almost all installed packages have a configuration like this one under the config/packages/ directory. Most of the time, the defaults have been chosen carefully to work for most applications.

Uncomment the first couple of lines and add the project’s model classes:

config/packages/easy_admin.yaml
1
2
3
4
easy_admin:
    entities:
        - App\Entity\Conference
        - App\Entity\Comment

Access the generated admin backend at /admin. Boom! A nice and feature-rich admin interface for conferences and comments:

Tip

Why is the backend accessible under /admin? That’s the default prefix configured in config/routes/easy_admin.yaml:

config/routes/easy_admin.yaml
1
2
3
4
easy_admin_bundle:
    resource: '@EasyAdminBundle/Controller/EasyAdminController.php'
    prefix: /admin
    type: annotation

You can change it to anything you like.

Adding conferences and comments is not possible yet as you would get an error: Object of class App\Entity\Conference could not be converted to string. EasyAdmin tries to display the conference related to comments, but it can only do so if there is a string representation of a conference. Fix it by adding a __toString() method on the Conference class:

patch_file
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
--- a/src/Entity/Conference.php
+++ b/src/Entity/Conference.php
@@ -43,6 +43,11 @@ class Conference
         $this->comments = new ArrayCollection();
     }

+    public function __toString(): string
+    {
+        return $this->city.' '.$this->year;
+    }
+
     public function getId(): ?int
     {
         return $this->id;

Do the same for the Comment class:

patch_file
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
--- a/src/Entity/Comment.php
+++ b/src/Entity/Comment.php
@@ -48,6 +48,11 @@ class Comment
      */
     private $photoFilename;

+    public function __toString(): string
+    {
+        return (string) $this->getEmail();
+    }
+
     public function getId(): ?int
     {
         return $this->id;

You can now add/modify/delete conferences directly from the admin backend. Play with it and add at least one conference.

Add some comments without photos. Set the date manually for now; we will fill-in the createdAt column automatically in a later step.

Customizing EasyAdmin

The default admin backend works well, but it can be customized in many ways to improve the experience. Let’s do some simple changes to demonstrate the possibilities. Replace the current configuration with the following:

config/packages/easy_admin.yaml
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
easy_admin:
    site_name: Conference Guestbook

    design:
        menu:
            - { route: 'homepage', label: 'Back to the website', icon: 'home' }
            - { entity: 'Conference', label: 'Conferences', icon: 'map-marker' }
            - { entity: 'Comment', label: 'Comments', icon: 'comments' }

    entities:
        Conference:
            class: App\Entity\Conference

        Comment:
            class: App\Entity\Comment
            list:
                fields:
                    - author
                    - { property: 'email', type: 'email' }
                    - { property: 'createdAt', type: 'datetime' }
                sort: ['createdAt', 'ASC']
                filters: ['conference']
            edit:
                fields:
                    - { property: 'conference' }
                    - { property: 'createdAt', type: datetime, type_options: { attr: { readonly: true } } }
                    - 'author'
                    - { property: 'email', type: 'email' }
                    - text

We have overridden the design section to add icons to the menu items and to add a link back to the website home page.

For the Comment section, listing the fields lets us order them the way we want. Some fields are tweaked, like setting the creation date to read-only. The filters section defines which filters to expose on top of the regular search field.

These customizations are just a small introduction of the possibilities given by EasyAdmin.

Play with the admin, filter the comments by conference, or search comments by email for instance. The only issue is that anybody can access the backend. Don’t worry, we will secure it in a future step.

1
$ symfony run psql -c "TRUNCATE conference RESTART IDENTITY CASCADE"

  • « Previous Step 8: Describing the Data Structure
  • Next » Step 10: Building the User Interface

This work, including the code samples, is licensed under a Creative Commons BY-NC-SA 4.0 license.