Code Editors

Atom is a free open-source “hackable” text and code editor developed by GitHub. Configure Atom for JavaScript and Web Development

Brackets is a a modern, open source text editor that understands web design. TIP: if you are fairly new to markdown and/or would like a live preview while you edit, checkout this Markdown Preview plugin for Brackets.

Sublime Text is a fast, stable editor with a huge number of features and plugins termed packages.

Vim logo

Visual Studio Code is a free code editor from Microsoft and is available for Linux, Mac OSX, and Windows. This editor has a growing community and new features with each release. One feature I recently discovered is the live markdown preview, Ctrl+Shift+V.

Configuration Considerations

If you’re running under Windows and work with Git, create and edit shell scripts, etc., you may want to consider setting the default line endings to Unix instead of Windows.

Line Endings
WindowsCR LF

The Windows version of Sublime Text 3 is set to use Windows line endings by default. You can set Unix as the default in Sublime Text 3 as follows:

  1. From the Menu, select Preferences (alt + n)
  2. Select Settings – User
  3. Add the following to the Preferences.sublime-settings file *

        "default_line_ending": "unix"

* If there are pre-existing settings in the Preferences.sublime-settings file, the curly braces are not needed since they already surround the settings. The Sublime Text settings files are in json format.

TIP: Convert line endings from Windows to Unix with the dos2unix command using Cygwin, a Unix like command-line interface for Windows.

# find all files inside current directory
# and execute dos2unix on them
$ find . -type f -exec dos2unix {} \;

Further reading, I like Jeff Atwood’s blog post from 2010, The Great Newline Schism.

Line Ending Plugins

Sublime Text comes with all the tools for handling line endings built in. What about the others?

Atom – As of version 1.0.8 you can change the default line endings for new files. Select File | Settings | Packages | Core Packages | line-ending-selector. Select Settings, Default line ending setting. You can also convert line endings for an open file selecting LF or CRLF at the bottom right hand corner status area.

Brackets – An extension to convert line endings may be needed. The brackets-newline extension worked for me. The default line endings adjusts to the OS it’s running on. There doesn’t seem to be a way to set default line endings for new files.

Visual Studio Code – Use an .editorconfig file and the respective EditorConfig for VS Code extension. For example,

root = true

indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

indent_style = tab
tab_width = 4

indent_size = 2

trim_trailing_whitespace = false

Line endings can be converted by selecting LF or CRLF at the bottom right hand corner status area. Like Brackets, the default line endings adjusts to the OS it’s running on and there doesn’t seem to be a way to set default line endings in the core settings.

Sublime Text


For those of you that are interested and for my own records, my Sublime Text settings file. The Fira Code fonts are a great addition to a developer work station.

    "caret_style": "phase",
    "color_scheme": "Packages/Colorsublime-Themes/Facebook.tmTheme",
    "detect_indentation": false,
    "detect_slow_plugins": false,
    "fade_fold_buttons": false,
    "font_face": "Fira Code",
    "font_size": 14,
    "highlight_line": true,
    "line_padding_bottom": 3,
    "line_padding_top": 3,
    "tab_size": 4,
    "theme": "Material-Theme.sublime-theme",
    "trim_trailing_white_space_on_save": true,
    "use_tab_stops": true

I have also modified the Facebook.tmTheme file so the background color matches the sidebar.

Packages/Colorsublime – Themes/Facebook.tmTheme



Emmet toolkit for web-developers. Usage cheat-sheet

HTML-CSS-JS Prettify — HTML, CSS, JavaScript and JSON code formatter for Sublime Text 2 and 3.


Loading Disqus Comments ...
Loading Facebook Comments ...