Netbeans and Drupal 8 — Setup and Review

,

Netbeans and Drupal are still a winning combination as both move up to version 8. At least for me Netbeans + Drupal equals the best combination out there for doing serious work.

Think of your ultimate toolkit for Drupal 8 development. What would it include? Drupal 8 is built on Symfony, themed with Twig and is mobile-ready, which means HTML5 and CSS3. Composer is now the most common tool of choice, a de facto standard, for getting up and running with a Drupal 8 site. You’ll want SASS support most likely. Though not part of Drupal per se, more and more themes depend on SASS. And these days you almost certainly have at least git and possibly Grunt, Gulp, Bower and other tools as part of your workflow.

No problem with any of those. Netbeans already supported Composer, Symfony and Twig out of the box back with version 7.1 or so when I first started using it. Netbeans is SASS-ready and also is ready to run with tools like Grunt, Gulp, and so forth. With the Netbeans 8.1 update, all of that comes with Netbeans out of the box.

What does that mean?

When I say that it’s “ready,” I mean that it auto-detects those tools. For instance, it finds your SASS gem automatically, has syntax highlighting and so forth. In the case of git, it highlights changes from the committed version. You still have to install those tools separately, but once they’re on your machine, Netbeans will play nice with them.

Is it the best IDE out there? Probably not. That said, I’ve tried PHP Storm, which seems to frequently top the list of favorites. I found it as good as Netbeans, but not better. At least not enough better to switch. I’ve also tried Eclipse (never could get the debugger working — ironic), Code Lobster and several others, and I always come back to Netbeans. Other people’s experiences differ, but I’ve found it the easiest to use. Above all the debugger has always just worked great for me and that is the key tool I want in an IDE.

Drupal IDE Requirements

So a good IDE should be able to offer the following:

  1. Standard IDE goodness — syntax highlighting, code completion, code hints, brace match, code collapsing and all that.
  2. Debugger with breakpoints and profiling
  3. Support for Symfony, the PHP framework that Drupal 8 will be built on for major components of Drupal 8. This is completely new to Drupal.
  4. Support for Twig, the templating language that will be the default template engine in Drupal 8. Again, this is completely new to Drupal.
  5. Support for the SASS extensions to CSS3, in particular in its SCSS flavor. SASS is not really baked into Drupal like the others, but it is becoming more and more common for themes to be built upon SASS. So if you’re going to use one of the more common and powerful base themes (Omega, Adaptive Theme, Zen), you may in the future want SASS syntax highlighting and so forth.
  6. Support for PHP Composer. Composer manages dependencies and checks to make sure crucial dependencies are available. So since we’re going to need Symfony, Twig and SASS, you might was well have Composer. Installing Twig using Composer, for example, is dead easy.
  7. Awareness of the Drupal API and Drupal coding conventions for modules and themes.
  8. Strong support for HTML5.

Netbeans Components: Twig, Symfony, Composer, HTML5 support

Netbeans has long been a serious, full-featured IDE, but Netbeans 8.1 hassupport for Symfony, Twig and HTML5. It also includes support for Composer and will auto-detect SASS, Gulp, Grunt, Node and Bower. So we have numbers 1, 3, 4, 5, 6 and 8 covered out of the box. Of course, you have to actually install Composer (*nix or Mac; Windows), Twig, Symfony and so on. Those are not included with Netbeans. As I’ve already mentioned, installing Twig using Composer, for example, is dead easy. If Symfony throws errors try just downloading the tarball and intalling manually. When you install Composer, it prefers to see OpenSSL (or Windows binaries) running on your system, which it probably is. If not, you can easily install it, but for Composer to see it, you also need to make sure that the PHP OpenSSL extension is active.

Debugging Support

I have often found that getting debugging to work well in a PHP IDE can be trying. Over multiple versions from 7.0 to 8.1 (July 2016), it has been pretty simple in Netbeans for me. First we have to install XDebug. Getting XDebug to run and stop at breakpoints and all that requires modifying your php.ini, but there are straightforward instructions for Windows, Linux and Mac from Netbeans.org and good instructions on Drupal.org as well. The Drupal.org instructions have some settings that aren’t strictly necessary, like setting xdebug.remote_handler = dbgp which is actually the default anyway. (See also, an alternative set of Mac-only instructions with images and everything). There are also extensions for Firefox, Chrome , Safari and Opera that help invoke the debugger or improve integration with the IDE.

Tweaking Netbeans: Default Project Directory and Fonts

One minor annoyance is that Netbeans seems to hardcode the project location, so on my default Windows 8 install, it always wants to start new projects in C:\Users[username]\Documents\Netbeans Projects which would all be fine and good, except that I want it to start new projects in D:\Documents\htdocs. To fix this, you need to find the projectui.properties file (in my case located in C:\Users[username]\AppData\Roaming\NetBeans[version]\config\Preferences\org\netbeans\modules and add this line:

projectsFolder=D:\\Documents\\htdocs

Obviously, you’ll substitute the path you need. It also doesn’t matter where in the file you put that line; every time you open and close Netbeans, it’s going to save it wherever it wants (but it will remember to save it and keep the setting).

I find the default IDE font size absurdly small on my high-res laptop. You can change the fonts for code within the editor just from the settings, but to change the actual interface fonts – menus, file navigator, etc – you need to edit the netbeans.conf file. In my case that’s in C:\Program Files\Netbeans 8.1\etc. You simply have to set “fontsize 16” or whatever in your netbeans_default_options. Once set, it should look like this

netbeans_default_options="-J-client -J-Xss2m -J-Xms32m -J-XX:PermSize=32m -J-Dapple.laf.useScreenMenuBar=true -J-Dapple.awt.graphics.UseQuartz=true -J-Dsun.java2d.noddraw=true -J-Dsun.java2d.dpiaware=true -J-Dsun.zip.disableMemoryMapping=true --fontsize 16"

Making Netbeans “Drupal Aware” (API and coding standards)

Now we want to make Netbeans Drupal-friendly. Jaime Holly’s Netbeans Drupal Dev Tool provides that (Drupal 7 only). The best way to get this is from github, and the easiest way to do that is to download the .nbm file. To do that just go the file location on Github and click on “View Raw” and it should download to your machine. Then just go to Tools >> Plugins >> Downloaded and add it. Jaime provides excellent documentation on his site, on Drupal.org and a video tutorial as well.

Finally, this page and this one have instructions on how to change the settings in the IDE so that code naturally conforms to Drupal coding standards for formatting.

7 Responses to “Netbeans and Drupal 8 — Setup and Review”

  1. Milto Noones

    Have you been able to set a breakpoint in a Twig template?

  2. Spindles

    @Milto

    As far as I can tell,debugging twig seems nigh on impossible. What you can do is use dump($var) in the code and then use the symfony debugger to inspect that variable.

  3. That’s a bummer. My duties have taken me away from Drupal for a while so I’m sort of out of the loop. I hope to get back to some Drupal projects in January, but it’s troubling what people say about debugging Twig :-(

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>