ShooFlyBuzz https://www.shooflydesign.org/buzz/javascript-for-web-designers-now-available%20Notify%20me%20about%20new%20comments%20on%20this%20page%20break%26tbs%3Dqdr%3Am%26hl%3Dzh-TW%26ct%3Dclnk en macOS Hot Corners Support Modifier Keys! https://www.shooflydesign.org/buzz/macos-hot-corners-support-modifier-keys <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/macos-hot-corners-support-modifier-keys">April 11, 2019</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/macos-hot-corners-support-modifier-keys">macOS Hot Corners Support Modifier Keys!</a></h2></div></div></div><div class="field field-name-field-featured-image"><img src="https://www.shooflydesign.org/sites/default/files/images/featured/hot-corner-modifiers.jpg" width="1390" height="1084" alt="" /></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>The Sweet Setup just posted <a href="https://thesweetsetup.com/how-to-set-up-and-use-hot-corners-on-macos/">an article on Hot Corners</a>, a feature of macOS where you can shove your mouse cursor into a corner of the screen to make something happen. I use this to lock my screen or to start the screensaver, but it's easy to trigger accidentally. No more, thanks to a hot tip in their article. If you hold a modifier key (command, option, etc) while selecting the action you want, it will require that key to be down to trigger the corner. I had no idea about this, but I'm trying it now.</p> </div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/macos-hot-corners-support-modifier-keys" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/applemac">Apple/Mac</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-91 even"><a href="/content/tagged/hidden-features">hidden features</a></div> </div> </div> Thu, 11 Apr 2019 17:37:01 +0000 Joe Chellman 132 at https://www.shooflydesign.org React Routing with Apache https://www.shooflydesign.org/buzz/react-routing-with-apache <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/react-routing-with-apache">November 20, 2018</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/react-routing-with-apache">React Routing with Apache</a></h2></div></div></div><div class="field field-name-field-featured-image"><img src="https://www.shooflydesign.org/sites/default/files/images/featured/apache-react.png" width="1012" height="449" alt="" /></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>I've been working on a single page app in React for the past several months, currently in alpha testing. It uses <a href="https://reacttraining.com/react-router/web/guides/quick-start">React Router</a> to handle its routing, and is bootstrapped with <a href="https://github.com/facebook/create-react-app">Create React App</a>, which makes getting started as easy as they tell you.</p></div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/react-routing-with-apache" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/javascript">JavaScript</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-90 even"><a href="/content/tagged/react">react</a></div> </div> </div> Tue, 20 Nov 2018 23:15:14 +0000 Joe Chellman 131 at https://www.shooflydesign.org Configuring PhpStorm to debugging command line PHP scripts https://www.shooflydesign.org/buzz/configuring-phpstorm-to-debugging-command-line-php-scripts <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/configuring-phpstorm-to-debugging-command-line-php-scripts">March 4, 2017</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/configuring-phpstorm-to-debugging-command-line-php-scripts">Configuring PhpStorm to debugging command line PHP scripts</a></h2></div></div></div><div class="field field-name-field-featured-image"><img src="https://www.shooflydesign.org/sites/default/files/images/featured/xdebug-artisan-s.png" width="1590" height="1022" alt="" /></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>Working for years with Drupal's command-line tool <a href="http://drush.ws/">drush</a>, and more recently with Laravel's <a href="https://laravel.com/docs/artisan">artisan</a>, I've had occasion to interface with Xdebug in my favorite IDE, <a href="https://www.jetbrains.com/phpstorm/">PhpStorm</a>. Here's how I am currently working with all of these tools together.</p> <p>Incidentally, if you've never tried a real debugger in your projects, you can check out my talk from WordCamp Orange County, <a href="http://wordpress.tv/2016/01/07/joe-chellman-lets-debug-for-real/">"Let's Debug for Real"</a>, which was recorded from the audience, or a higher-fidelity version from a JavaScript perspective, my lynda.com course <a href="https://www.shooflydesign.org/training/debugging-the-web-javascript">Debugging the Web: JavaScript</a>.</p> <p>Here's how this will work: you'll do some initial configuration in PhpStorm and your local web stack, set a breakpoint somewhere in your code, then run your command line script from within PhpStorm. If all goes well, execution will stop at the breakpoint and you'll be off to the debugging races.</p> </div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/configuring-phpstorm-to-debugging-command-line-php-scripts" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/programming">Programming</a></div><div class="field-item odd"><a href="/buzz/topic/software">Software</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-88 even"><a href="/content/tagged/laravel">laravel</a></div> <div class="term tid-89 odd"><a href="/content/tagged/phpstorm">phpstorm</a></div> <div class="term tid-32 even"><a href="/content/tagged/drush">drush</a></div> </div> </div> Sun, 05 Mar 2017 07:05:03 +0000 Joe Chellman 128 at https://www.shooflydesign.org JavaScript and jQuery Course Updates on lynda.com and LinkedIn Learning https://www.shooflydesign.org/buzz/javascript-and-jquery-course-updates-on-lyndacom-and-linkedin-learning <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/javascript-and-jquery-course-updates-on-lyndacom-and-linkedin-learning">October 20, 2016</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/javascript-and-jquery-course-updates-on-lyndacom-and-linkedin-learning">JavaScript and jQuery Course Updates on lynda.com and LinkedIn Learning</a></h2></div></div></div><div class="field field-name-field-featured-image"><img src="https://www.shooflydesign.org/sites/default/files/images/featured/linkedin-1620x1080.jpg" width="1620" height="1080" alt="" /></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>Two of my courses on lynda.com were updated recently, and next week, with a free LinkedIn account, you'll be able to watch them, and the rest of the lynda.com training library, for free! They're running the <a href="https://learning.linkedin.com/week-of-learning">Week of Learning</a> promotion next week, from October 24 - 30, to promote <a href="https://www.linkedin.com/learning">LinkedIn Learning</a>, which is the entire lynda.com catalog geared toward the LinkedIn audience.</p></div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/javascript-and-jquery-course-updates-on-lyndacom-and-linkedin-learning" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/javascript">JavaScript</a></div><div class="field-item odd"><a href="/buzz/topic/training">Training</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-51 even"><a href="/content/tagged/lyndacom">lynda.com</a></div> </div> </div> Thu, 20 Oct 2016 18:28:41 +0000 Joe Chellman 127 at https://www.shooflydesign.org Easier Site Deployments on Pantheon with Terminus https://www.shooflydesign.org/buzz/easier-site-deployments-on-pantheon-with-terminus <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/easier-site-deployments-on-pantheon-with-terminus">May 18, 2016</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/easier-site-deployments-on-pantheon-with-terminus">Easier Site Deployments on Pantheon with Terminus</a></h2></div></div></div><div class="field field-name-field-featured-image"><img src="https://www.shooflydesign.org/sites/default/files/images/featured/terminus-splash.jpg" width="450" height="277" alt="" /></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>Learn how to use the command line toolkit Terminus to make deployments of Drupal, WordPress, and Backdrop sites on Pantheon faster and easier.</p> </div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/easier-site-deployments-on-pantheon-with-terminus" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/drupal">Drupal</a></div><div class="field-item odd"><a href="/buzz/topic/wordpress">WordPress</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-86 even"><a href="/content/tagged/pantheon">pantheon</a></div> <div class="term tid-87 odd"><a href="/content/tagged/command-line">command line</a></div> </div> </div> Thu, 19 May 2016 05:17:00 +0000 Joe Chellman 126 at https://www.shooflydesign.org Using Node.js module with Drupal 7 and Heroku https://www.shooflydesign.org/buzz/using-nodejs-module-with-drupal-7-and-heroku <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/using-nodejs-module-with-drupal-7-and-heroku">January 21, 2016</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/using-nodejs-module-with-drupal-7-and-heroku">Using Node.js module with Drupal 7 and Heroku</a></h2></div></div></div><div class="field field-name-field-featured-image"><img src="https://www.shooflydesign.org/sites/default/files/images/featured/drupal-node-heroku.png" width="940" height="364" alt="" /></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>I've recently needed to run a Node.js service alongside a Drupal 7 site to allow for a live-chat style of commenting. None of the current ecosystem of Drupal-integrated chat modules looked good for this particular website, but by greatly simplifying the comments UI and displaying it alongside a live video broadcast, we got something pretty good.</p></div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/using-nodejs-module-with-drupal-7-and-heroku" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/drupal">Drupal</a></div><div class="field-item odd"><a href="/buzz/topic/planet-drupal">Planet Drupal</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-85 even"><a href="/content/tagged/nodejs">nodejs</a></div> </div> </div> Thu, 21 Jan 2016 20:41:58 +0000 Joe Chellman 125 at https://www.shooflydesign.org Breakpoints Aren't Just For Breaking https://www.shooflydesign.org/buzz/breakpoints-arent-just-for-breaking <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/breakpoints-arent-just-for-breaking">December 16, 2015</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/breakpoints-arent-just-for-breaking">Breakpoints Aren&#039;t Just For Breaking</a></h2></div></div></div><div class="field field-name-field-featured-image"><img src="https://www.shooflydesign.org/sites/default/files/images/featured/webkit-post-preview.png" width="1050" height="649" alt="" /></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>A debugger is essential for helping understand how code works. In my lynda.com course <a href="http://www.shooflydesign.org/training/debugging-the-web-javascript">Debugging The Web: JavaScript</a>, I go over the essential parts of learning how to use one. These concepts are the same across pretty much all debuggers in common use, but there are also different helpful options available in each one that can be helpful.</p></div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/breakpoints-arent-just-for-breaking" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/applemac">Apple/Mac</a></div><div class="field-item odd"><a href="/buzz/topic/javascript">JavaScript</a></div><div class="field-item even"><a href="/buzz/topic/programming">Programming</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-83 even"><a href="/content/tagged/webkit">webkit</a></div> <div class="term tid-84 odd"><a href="/content/tagged/safari">safari</a></div> </div> </div> Wed, 16 Dec 2015 18:40:02 +0000 Joe Chellman 124 at https://www.shooflydesign.org Multi-line Comments in Apache Configuration Files https://www.shooflydesign.org/buzz/multi-line-comments-in-apache-configuration-files <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/multi-line-comments-in-apache-configuration-files">December 10, 2015</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/multi-line-comments-in-apache-configuration-files">Multi-line Comments in Apache Configuration Files</a></h2></div></div></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>Apache .conf files only really support single-line comments, starting with the pound sign (#). I came up with a silly hack for multi-line comments that seems to work, so I'm putting it out there either to help other people, or be brutally taken down by people who are more savvy than I am.</p> <p>Basically, make up a non-existent runtime variable and use it in an <code>&lt;IfDefine&gt;</code> block. Because the variable doesn't exist, nothing between the tags should be executed. So for example:</p></div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/multi-line-comments-in-apache-configuration-files" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/software">Software</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-81 even"><a href="/content/tagged/apache">apache</a></div> <div class="term tid-82 odd"><a href="/content/tagged/configuration">configuration</a></div> </div> </div> Thu, 10 Dec 2015 08:34:09 +0000 Joe Chellman 123 at https://www.shooflydesign.org Web Inspector Improved in Safari 9 https://www.shooflydesign.org/buzz/web-inspector-improved-in-safari-9 <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/web-inspector-improved-in-safari-9">October 1, 2015</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/web-inspector-improved-in-safari-9">Web Inspector Improved in Safari 9</a></h2></div></div></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>I haven't upgraded to El Capitan, and may not for a while, but the latest version of Safari is 9.0, and is available for OS X Mavericks, aka 10.9. I upgraded to stay current with the security fixes, and have been pleasantly surprised to see a much improved Web Inspector.</p> <p><img src="/sites/default/files/web-inspector-safari-9.png" width="1098" height="491" alt="The web inspector in Safari 9" /></p></div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/web-inspector-improved-in-safari-9" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/applemac">Apple/Mac</a></div><div class="field-item odd"><a href="/buzz/topic/software">Software</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-80 even"><a href="/content/tagged/web-inspector">web inspector</a></div> </div> </div> Thu, 01 Oct 2015 18:36:47 +0000 Joe Chellman 120 at https://www.shooflydesign.org Quick Tip: Faster Element Inspection with Safari and iOS Simulator https://www.shooflydesign.org/buzz/quick-tip-faster-element-inspection-with-safari-and-ios-simulator <div class="field field-name-date-linked-h1 field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h1><a href="https://www.shooflydesign.org/buzz/quick-tip-faster-element-inspection-with-safari-and-ios-simulator">June 25, 2015</a></h1></div></div></div><div class="field field-name-title field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><h2><a href="/buzz/quick-tip-faster-element-inspection-with-safari-and-ios-simulator">Quick Tip: Faster Element Inspection with Safari and iOS Simulator</a></h2></div></div></div><div class="field field-name-body field-type-text-with-summary field-label-hidden"><div class="field-items"><div class="field-item even"><p>Chrome and Firefox are probably the gold standard for friendly web developer tools, but I still use Safari all the time. It's the best option for debugging sites on iOS using the <a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/GettingStarted/GettingStarted.html#//apple_ref/doc/uid/TP40007874-CH2-SW7">remote debugging features</a>. You open your site in Safari running in the iOS simulator, and in the Develop menu, like this:</p></div></div></div><div class="field field-name-node-link field-type-ds field-label-hidden"><div class="field-items"><div class="field-item even"><a href="/buzz/quick-tip-faster-element-inspection-with-safari-and-ios-simulator" class="">Read more »</a></div></div></div><div class="field field-name-taxonomy-vocabulary-1 field-type-taxonomy-term-reference field-label-inline clearfix"><div class="field-label">Categories:&nbsp;</div><div class="field-items"><div class="field-item even"><a href="/buzz/topic/software">Software</a></div></div></div><div class="field field-name-field-tags field-type-taxonomy-term-reference field-label-inline clearfix"> <div class="field-label">Tags:&nbsp;</div> <div class="field-items"> <div class="term tid-79 even"><a href="/content/tagged/debugging">debugging</a></div> <div class="term tid-80 odd"><a href="/content/tagged/web-inspector">web inspector</a></div> </div> </div> Thu, 25 Jun 2015 22:54:15 +0000 Joe Chellman 119 at https://www.shooflydesign.org