Category Archives: davidwalsh

Undo File Changes with Git

One of my favorite features in modern text editors is their ability to integrate tools to format code upon every save.  When you’re working on legacy projects, however, auto-formatting can be a problem; if you open a file that you don’t explicitly change, the file may still get modified by the formatter.  This all leads to git status showing a bunch of file modifications that you don’t want.

To quickly undo file changes with git, execute the following two commands:

read more

Best Time Tracking and Invoicing Apps that Will Do The Work For You (Sponsored)

Time tracking, expense tracking, and invoicing, are important tasks in running a business. Yet, they represent non-billable hours expended. Moreover, if they are taking up too much of your time, it’s hurting your bottom line.

Some project managers and business owners might be familiar with these processes. However, some web designers and creatives can feel intimidated by these time-consuming tasks.

When a process is taking too much of your time, your first instinct is to try harder. That’s fine, but there’s usually a better way. In this case, it’s investing in one or two apps that will do most of your work for you; and in many cases, do it better.

read more

Checkout the Previous Branch with git

Command line shortcuts are can be a huge time saver, which is why I like creating bash aliases and and enjoy other tricks I’ve found.  I do have a list of tasks I don’t yet have a shortcut for, like easy switching between my current branch and the previous branch.  I have to do this often when I update master via remote pull and then rebasing a feature branch, and since many of my branch names include a hard to remember bug number, switching between branches is a pain.

read more

Custom, Embeddable Site Search with Swiftype

As hard as we try to make our website navigation and content structure as logical as possible, a large percentage of users would prefer a simple search box to find what they need.  That being the case, we need to ensure that site search is as accurate and smart as possible.  Oftentimes developers will try to roll their own site search (yuck), use an open source utility (usually yuck), or reach to Google Site Search, which will soon be unavailable.  Search is hard but that’s where a service like Swiftype can come to the rescue.  Swiftype is a site search and third party content search service that allows you to provide incredible search capabilities to your users in very little time.

read more

Add CSS and JavaScript Files to Phabricator Extensions

Every open source framework has its own methods of extending functionality; some make extending incredibly easy and others…not so much.  Most of the time it comes down to how well the framework is documented.  Phabricator did an awesome job of making necessary classes extendable but it’s fair to say it would be great if the framework had a bit better documentation (PRs welcome, I bet!).

In creating my own extension, I needed to add JavaScript and CSS files to the page.  Unfortunately the Adding New CSS and JS documentation states “This document is intended for Phabricator developers and contributors. This process will not work correctly for third-party code, plugins, or extensions.”  I found that to not be true.  The following is how I added JavaScript and CSS assets for my extension.

Place Asset Files in Your Extension Directory

Each extension I create is placed in its own directory with all dependencies within that directory:

  • extensions
    • my-extension
      • my-extension.php
      • my-extension.css
      • my-extension.js

      You could further place CSS and JS files into their own directories if you’d like.  Each CSS and JS file should have a @provides comment by which you’ll refer to it when it’s time to require it:

      /**
       * @provides my-extension-js
       */
      

      I choose to add -js and -css to the reference name for ease in maintenance.

      Use require_celerity_resource to Require the File

      In the function which represents the view you’d like the assets injected into, you’ll use require_celerity_resource with the @provides asset name:

      protected function renderLoginForm(AphrontRequest $request, $mode) {
       // Add CSS and JS resources to the page
        require_celerity_resource('bmo-auth-css');
        require_celerity_resource('bmo-auth-js');
      
        // ....
      }
      

      During Build, Move Asset Locations

      Phabricator expects all JavaScript and CSS files to be in its /webroot/rsrc/js/ and /webroot/rsrc/css/ directories so you’ll need to move your extension assets during the build process.  I added the following to my Dockerfile to do just that:

      # Move static resources to phabricator, add files to celerity map array
      COPY auth/my-extension.css /app/phabricator/webroot/rsrc/css/my-extension.css
      COPY auth/my-extension.js /app/phabricator/webroot/rsrc/js/my-extension.js
      

      With your JavaScript and CSS files in this location, the require_celerity_resource function can find your assets by name.

      Updated the Celerity Map

      To bust cache and index your files, you’ll need to run the following command:

      phabricator/ $ ./bin/celerity map
      

      read more