macOS: Preview source code files in Finder with Quick Look plugins

By

macOS Finder offers a possibility to preview the files of any type without opening them with Quick Look. By default Quick Look supports most commonly used file formats which may not be enough if you are a developer and you want to preview source code files i.e. Java or Python or any other un-common file types.

Quick Look plugins

Quick Look can be extended with plugins to allow previewing the content of any file format. Plugins can also add additional functionality to Quick Look like for example syntax highlighting.

The list of freely available Quick Look plugins for developers can be found here: https://github.com/sindresorhus/quick-look-plugins

The most useful ones from my point of view:

  • Preview files with no extension with QLStephen:

    brew cask install qlstephen

Example: preview .gitignore:

4-ql-gitignore.png

  • Preview Markdown files in Finder with QLMarkdown:

    brew cask install qlmarkdown

Example: preview README.md:

5-ql-md.png

  • Syntax highlighting for source code files with QLColorCode

    brew cask install qlcolorcode

Example: preview JavaScript file:

3-ql-hl.png

Note: Are looking for tools to help you being more productive? Read about tools that are essential to me on macOS: macOS: essential tools for (Java) developer

Tips and Tricks

Quick Look in fullscreen

The default key binding for Quick Look is Spacebar If you you want to preview the file in fullscreen press Option+Spacebar. To leave the fullscreen press Esc.

Change default editor for selected file types

To change the default app for the selected file type (also in Quick Look):

1-ql-open-with.png

  1. Select the file in Finder
  2. Show file info with Command+I
  3. Set Open With to your application (e.g. Atom)
  4. Click Change All to apply changes to all files of that type

2-ql-file-info-open-with.png

Now when you for example preview the file with Quick Look your default editor will be the one you just selected.

More macOS tips:

macOS: essential tools for (Java) developer
macOS: Annotate - simple yet productive screenshots tool

Popular posts from this blog

Parameterized tests in JavaScript with Jest

By
Parameterized tests are used to test the same code under different conditions. One can set up a test method that retrieves data from a data source. This data source can be a collection of objects, external file or maybe even a database. The general idea is to make it easy to test different conditions with the same test method to avoid duplication and make the code easier to read and maintain. Jest has a built-in support for tests parameterized with data table that can be provided either by an array of arrays or as tagged template literal .
Read more