In these videos we use Bower, but since their recording Bower has been deprecated in favor of Yarn. I hope to put together some videos on Yarn in the near future, but for now, here is a brief explanation on how to migrate from Bower to Yarn.
Video Updates
Below is a list of additional bits of information for this video, including parts where time has shown that additional explanation is required. If updates to Drupal affect how the video will be interpreted, there will also be updates here.
Bower has been deprecated
Added on December 23, 2017
The answer to the first question is actually 'true'
Added on July 11, 2017
I'm guessing I got caught up in the negative there. But the answer is that blocks DO NOT have their own public-facing URL.
Normalize is no longer available in Bower
Added on March 06, 2017
Sorry about that, you will need to use the NPM package manager instead for this.
Code needs updating for latest version of Drupal
Added on January 02, 2017
One viewer mentioned that when they used:
$request = \Drupal::service('request');
The page did not work. However, they were able to replace it with the following to get it to work:
$request = \Drupal::service('request_stack')->getCurrentRequest();
This video isn't cut properly
Added on December 29, 2016
This video isn't cut properly, and should end at about 45 seconds. But it keeps going all the way through the 'How "media queries" work to pull in different CSS based on conditions in the browser' video. Sorry about that! Someday I will fix this but at the moment you can choose to watch all of videos as a unit or move on at about 45 seconds.
If you have issues, try the minified version of retina.js
Added on November 21, 2016
One viewer had an issue in Chrome with the un-minified version of retina.js, but was able to use the minified version without a problem.
The word "array" is used instead of "hash" or "dictionary"
Added on October 25, 2016
A viewer pointed out that the YAML structure in this video is actually using a "dictionary" (or "hash") instead of arrays. In PHP, both arrays and dictionaries are called arrays, which is where I got confused here. But, as mentioned on this docs page, elsewhere this structures is not called an array.
Files in the "Coder" folder are now in the "Change Management and Version Control" resource pack
Added on October 13, 2016
After this series was published, we split up the single resource pack so that each video series now has its own resource pack. All the files you see in this video can be found in the resource pack for "Change Management and Version Control."
If you get an extra line, try using trim()
Added on October 13, 2016
Some text editors may add an extra line to the end of the CSV file when saved. You can strip this back out again by wrapping the $data
variable with trim()
, so:
$data = trim($data);
This video is cut off, but not by much
Added on October 13, 2016
At the very end of this video, the video cuts out, but all we do in the part you don't see is save the updated CSS by clicking the Save button.
There is no longer a file with service_container_prod()
Added on October 13, 2016
In this video we dig into /sites/default/files/php/service_container/service_container_prod
to see a list of registered services. In the latest versions of Drupal 8, this file no longer exists. You can still search the file base for services, but they are no longer gathered together in a single easy-to-search file. You'll instead find them in their respective $module.services.yml
files.
Note that the "strstr()" function is case-sensitive
Added on October 13, 2016
If you find yourself confused by the results of this search function, it may be because the function we're using to search - strstr()
is case-sensitive. You can replace this with stristr()
(there's an added 'i' in there) for the case-insensitive version.
Issue with title fail has been fixed in Panels
Added on October 13, 2016
According to a viewer, the issue with the heading tags not wrapping around each other has been fixed and a class (pane-title
) is now used. Yea!
Apology to designers
Added on October 13, 2016
Many designers care about color and slight variations. In this video I assumed that the designer did not care so much, and realize in retrospect that the assumption may have been insulting.
Please note that I am dealing here with a design that I made, and so while I am speaking more broadly, I am really addressing my own flaws and the shortcuts I personally take when creating designs in Photoshop. I did not mean to imply that other designers are not more diligent and purposeful than I am when choosing colors, and should have chosen my wording more carefully. My goal with these videos is to help learners draw broad principles about the process of developing for the web, but sometimes I draw from too small a sample size and say the wrong thing.
So designers, please accept my apologies. I know now that many of you are choosing that slightly different grey on purpose. Three cheers for a subtle and pleasantly varied color palette!
Apology to designers
Added on October 13, 2016
Many designers care about color and slight variations. In this video I assumed that the designer did not care so much, and realize in retrospect that the assumption may have been insulting.
Please note that I am dealing here with a design that I made, and so while I am speaking more broadly, I am really addressing my own flaws and the shortcuts I personally take when creating designs in Photoshop. I did not mean to imply that other designers are not more diligent and purposeful than I am when choosing colors, and should have chosen my wording more carefully. My goal with these videos is to help learners draw broad principles about the process of developing for the web, but sometimes I draw from too small a sample size and say the wrong thing.
So designers, please accept my apologies. I know now that many of you are choosing that slightly different grey on purpose. Three cheers for a subtle and pleasantly varied color palette!
The "alt" attribute required for "img" tags
Added on October 13, 2016
In this video I mention that the only attribute required by the img
tag is src
, but alt
is also technically a required attribute. Leaving it out won't break your site, but we add it in later anyway for accessibility reasons so if you want to add it in now, go for it!
"Div" is actually short for "division"
Added on October 13, 2016
In this video I mention that "div" is short for "divider," which is close but wrong. A viewer pointed out that it's actually "division." Thanks!
"Custom Formats" is actually the "Custom Formatters" module
Added on October 13, 2016
As one viewer pointed out, there is no "Custom Formats" module. I did mean "Custom Formatters" in this case. Thanks, viewer!
You may need to enable administrative permissions to work with Page Manager
Added on October 13, 2016
One viewer mentioned that they needed to add administrative permissions to a role in order to work with Page Manager.
May need to adjust capitalization in filename and class
Added on October 13, 2016
One viewer mentioned that they needed to change Blindd8ServiceProvider to BlindD8ServiceProvider (the D in D8 is capitalized) in both the filename and class name in order for it to work.
You may need to use the ".selectize-input:before {}" selector
Added on October 13, 2016
One viewer was unable to get the .selectize-input:after
selector to work for hiding the border, but found that .selectize-input:before
did work.
16 times 3 actually equals 48
Added on October 13, 2016
At the end of this video I state that 16 x 3 is 36. I was clearly wrong.
At the very end, I should have said "configuration"
Added on October 13, 2016
This video is about exporting configuration, but at the very end of the video I accidentally say "do an export of your entire content" instead of "do an export of your entire configuration."
May need to add PATH variable for this to work
Added on October 13, 2016
One viewer using Windows had an issue getting bower to install normalize.css and was able to fix it by running the following on the command prompt:
set PATH=%PATH%;C:\Program Files (x86)\Git\bin;
Multiple changes necessary to register a page in the latest Drupal 8
Added on October 13, 2016
Adding a page via a module is something that's changed dramatically since this video was first made. We talk about many of these later on in the series, but to make it explicit here, among these changes are the following:
- Drupal now uses PSR-4 instead of PSR-0, making for a simpler directory structure.
- Modules now use the the
src
folder instead of thelib
folder. So now the folder structure will be/src/Controller/mycontroller.php
- The routing.yml file now uses the key
_controller
instead of_content
. - The
hook_menu()
hook has been replaced by numerous parts. The most important omission here is the use of the links YAML files, like*.links.task.yml
, as mentioned here. Details on converting an item inhook_menu()
to the newrouting.yml
file and the various*.links.*.yml
files can be found here.
Possibly change second argument to an array in the listener
Added on October 13, 2016
A viewer suggested that it might be a good idea to change this line:
$headers->set('Content-Length', strlen($response->getContent()));
To the following:
$headers->set('Content-Length', [strlen($response->getContent()) ]);
The change is that the strlen($response->getContent())
is wrapped in brackets, making it an array.
Classy and Stable are no longer visible
Added on October 13, 2016
While Classy and Stable are still Drupal core's base themes, they are no longer visible or selectable from the /admin/appearance
page.
The color change in the header was added for accessibility reasons
Added on October 13, 2016
In this video I wrongly associate the change in the header background color with the shift to using an SVG for the logo. Instead, it was noted by a viewer that the change was implemented to improve accessibility.
The "url()" and "l()" functions have been deprecated
Added on October 13, 2016
On line 52, there is the following line:
$event->setResponse(new RedirectResponse(url('<front>')); // This
is what we do in D8 instead of drupal_goto('');
Instead of using url()
, you will now need to use different code, as indicated in this change record, for example:
\Drupal\Core\Url::fromUri('internal:/')->toString()
For recent PHP versions, use "mysqli_connect()" instead of "mysql_connect()"
Added on October 13, 2016
If you are running a more recent version of PHP, you may not be able to use functions that begin with the prefix mysql_
. If you replace all of these functions with mysqli_
, they should work properly. So, for example, mysql_connect()
will become mysqli_connect()
.