Drupal Debug - Improve your developer experience

Slide 1

Slide 1 text

Drupal Debug Improve your developer experience Thomas Calvet - fancyweb

Slide 2

Slide 2 text

DevelopereXperience 2 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 3

Slide 3 text

Developer experience 3 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Kind of the same concept than the User eXperience applied to development ● The user is the developer ● But we are more demanding ● And the scope is larger

Slide 4

Slide 4 text

Drupal DX has even more aspects 4 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Several developer profiles ● Site builder ● Theme builder ● Custom module maker

Slide 5

Slide 5 text

So, whatisthe topic today? 5 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 6

Slide 6 text

This talk is about 6 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Your custom code ● Daily development ● Avoid repetitive tasks ● Help new Drupal developers

Slide 7

Slide 7 text

This talk is not about 7 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Admin part ● Core architecture / code ● Documentation ● Contribution

Slide 8

Slide 8 text

Examplesof DX features 8 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 9

Slide 9 text

Provide shortcuts 9 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Abstract implementations ● Functions, methods, classes, traits ● The goal is to hide a complexity

Slide 10

Slide 10 text

Throw exceptions 10 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Handle common users mistakes ● Be defensive ● Throw an exception ● With an useful message

Slide 11

Slide 11 text

Simple things 11 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● A small UI change ● An up to date PHPDoc ● Rename a test class ● Etc.

Slide 12

Slide 12 text

Whydoesitmatter? 12 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 13

Slide 13 text

Why does it matter? 13 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Less frustration ● Increased productivity ● A better reputation ● Attract more users

Slide 14

Slide 14 text

Return on experience 14 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 15

Slide 15 text

Who am I? 15 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Thomas Calvet - fancyweb ● 6 years experience in PHP ● Long time Symfony user and enthusiast ● New Drupal developer

Slide 16

Slide 16 text

Drupalisnot readyfor developmentout of the box 16 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 17

Slide 17 text

Missing concepts 17 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● No « debug » mode ● No « environment » management

Slide 18

Slide 18 text

Examples 18 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 19

Slide 19 text

Display exceptions and errors 19 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience sites/default content

Slide 20

Slide 20 text

Display exceptions and errors 20 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Step 1

Slide 21

Slide 21 text

Display exceptions and errors 21 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Step 2

Slide 22

Slide 22 text

Display exceptions and errors 22 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Step 3

Slide 23

Slide 23 text

Display exceptions and errors 23 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Step 4

Slide 24

Slide 24 text

Display exceptions and errors 24 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● A basic and common need ● Way too many steps for a new Drupal developer ● It should be enabled from the start in local

Slide 25

Slide 25 text

Drupal cache system 25 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience 13 tables of cache data

Slide 26

Slide 26 text

Drupal cache system 26 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Cache data content is unreadable

Slide 27

Slide 27 text

Drupal cache system 27 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Clearable caches with drush

Slide 28

Slide 28 text

Drupal cache system 28 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Hard to master ● Lots of terms : internal, dynamic, Twig, render, keys, tags, context, max age ● Even way harder to understand for the front developers

Slide 29

Slide 29 text

It leads to bad habits 29 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● You must clear a cache but you don’t know which one ● So you clear all cache ● Precious seconds wasted everytime

Slide 30

Slide 30 text

Are thereinitiatives? Yes! 30 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 31

Slide 31 text

From the community 31 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Drupal console commands ● drush commands ● Devel module

Slide 32

Slide 32 text

From the core 32 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● D8DX: Improving the D8 developer experience https://www.drupal.org/community-initiatives/drupal-core/d8dx ● List DX issues ● Provide a common vocabulary

Slide 33

Slide 33 text

Proposingsomethingnew 33 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 34

Slide 34 text

ekino/drupal-debug https://github.com/ekino/drupal-debug 34 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Open source third party library ● Improve your DX during the development process ● Help you develop better and faster ● Reuse well known and well tested open source components

Slide 35

Slide 35 text

Provide actions 35 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● An action is a class that does something ● Each action has an unique goal ● 16 actions at the moment

Slide 36

Slide 36 text

Drupaldevelopment configuration 36 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 37

Slide 37 text

Disable CSS & JS aggregations 37 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Before After

Slide 38

Slide 38 text

Disable CSS & JS aggregations 38 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience What it replaces

Slide 39

Slide 39 text

Override Drupal configuration 39 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Global $config variable ● Normally, you modify it in the settings.php file ● The library just overrides everything after the settings initialization

Slide 40

Slide 40 text

DisableDrupalcaches 40 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 41

Slide 41 text

Disable Drupal caches 41 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience What it replaces

Slide 42

Slide 42 text

Override Drupal settings 42 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Settings class singleton ● Normally, you modify it in the settings.php file ● The library just overrides everything after the settings initialization

Slide 43

Slide 43 text

Twigdevelopment configuration 43 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 44

Slide 44 text

Enable Twig debug 44 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Before After

Slide 45

Slide 45 text

Enable Twig debug 45 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience What it replaces

Slide 46

Slide 46 text

Override Twig configuration 46 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Twig configuration is defined by parameters ● Override those parameters before the container compilation ● Twig cache is also disabled with this way

Slide 47

Slide 47 text

Display more information in a prettierway 47 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 48

Slide 48 text

Display pretty exceptions 48 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Before

Slide 49

Slide 49 text

Display pretty exceptions 49 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience After

Slide 50

Slide 50 text

Display pretty exceptions 50 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Use Symfony HttpKernel component ExceptionListener ● Use Symfony Debug component ExceptionHandler ● Available after the environment boot, so very early

Slide 51

Slide 51 text

Enable Debug class loader 51 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Provide better exceptions messages for case sensitive filesystems

Slide 52

Slide 52 text

Enable Debug class loader 52 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Use the Symfony Debug component DebugClassLoader class ● Wrap your autoloader (a Composer ClassLoader instance most likely) ● Also does lightweight static analysis when a class is loaded

Slide 53

Slide 53 text

Display dump location 53 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Before

Slide 54

Slide 54 text

Display dump location 54 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience After

Slide 55

Slide 55 text

Display dump location 55 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Use the Symfony VarDumper component ● Define a custom handler

Slide 56

Slide 56 text

Enforcegood practices 56 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 57

Slide 57 text

Throw errors as exceptions 57 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Code example

Slide 58

Slide 58 text

Throw errors as exceptions 58 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Before

Slide 59

Slide 59 text

Throw errors as exceptions 59 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience After

Slide 60

Slide 60 text

Throw errors as exceptions 60 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● PHP errors must be handled ● Use the Symfony Debug Component ErrorHandler class ● Set a custom error handler that rethrow PHP errors as exceptions

Slide 61

Slide 61 text

Enable Twig strict variables 61 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Code example

Slide 62

Slide 62 text

Enable Twig strict variables 62 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Before

Slide 63

Slide 63 text

Enable Twig strict variables 63 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience After

Slide 64

Slide 64 text

Invalidatecaches automatically 64 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 65

Slide 65 text

Watch actions 65 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Detect files creation, alteration and deletion ● Invalidate a cache ● 3 actions at the moment

Slide 66

Slide 66 text

Watch container definitions 66 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Default watched files

Slide 67

Slide 67 text

Watch modules hooks implementation 67 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Default watched file

Slide 68

Slide 68 text

Watch routing definitions 68 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Default watched file

Slide 69

Slide 69 text

Watch systems 69 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● A file resource is tied to an extension (a module or a theme) ● A resources freshness checker system ● A file cache system ● A file backend cache system

Slide 70

Slide 70 text

How doesitwork? 70 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 71

Slide 71 text

It could not be a module 71 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Modules are handled too late in the boot ● Some actions would be impossible to implement ● It would need to be enabled on first use ● It would need to be managed to not be used on production

Slide 72

Slide 72 text

Use an alternative Kernel 72 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience Drupal front controller

Slide 73

Slide 73 text

Use an alternative Kernel 73 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Extend the Drupal Kernel ● Dispatch events ● Alter the container definitions

Slide 74

Slide 74 text

Substitutingthe original DrupalKernel 74 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 75

Slide 75 text

How does the substitution work? 75 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Create a copy of the DrupalKernel on the fly ● Use another name ● Replace __DIR__ references ● Alias the DrupalKernel with our DebugKernel

Slide 76

Slide 76 text

The substitution is great 76 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● The library works out of the box ● The Debug Kernel is used by any third party library that woud normally use the Drupal Kernel

Slide 77

Slide 77 text

The substitution is bad 77 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Compatibility problems ● Disable it to test a behavior with caches enabled ● Disable it for all your tests

Slide 78

Slide 78 text

Configuration 78 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 79

Slide 79 text

Default configuration 79 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Some actions are configurable with options ● Not mandatory because there are defaults values ● Configuration is done in a YAML file ● Some with environment variables

Slide 80

Slide 80 text

Requirements 80 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 81

Slide 81 text

Requirements 81 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Composer ● PHP >= 7.1 (last supported stable version) ● Drupal >= 8.6

Slide 82

Slide 82 text

What’snext? 82 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 83

Slide 83 text

Improvements 83 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● On existing actions ● Optional actions (opened PR) ● Configuration by action (opened PR)

Slide 84

Slide 84 text

More actions and features 84 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Watch themes hooks implementations ● Watch libraries (JS & CSS files) ● Support third parties actions (opened PR)

Slide 85

Slide 85 text

The hidden goal 85 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● A wake up call! ● To have a debug mode in the Drupal core ● To have more DX initiatives in the Drupal core

Slide 86

Slide 86 text

Final thoughts 86 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 87

Slide 87 text

An enriching experience 87 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● For me ● For Drupal ● For Symfony

Slide 88

Slide 88 text

Is the community interested? 88 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience ● Is it useful for a lot of developers? ● Find first users and testers ● Eventually find contributors

Slide 89

Slide 89 text

Thank you, for your attention. Any questions?

Slide 90

Slide 90 text

https://github.com/ekino/ drupal-debug 90 Drupal Dev Days Transylvania - Drupal Debug: improve your developer experience

Slide 91

Slide 91 text

WHAT DID YOU THINK? Locate this session at the Drupal Developer Days Transylvania 2019 website: https://cluj2019.drupaldays.org/schedule Take the survey! https://www.surveymonkey.com/r/drupaltransylvania THANK YOU!