Trouble with Smart Quotes, etc

[ninjabreadman]

Someone sent you here because you were probably having trouble with smart directional (aka angled or curly) quotes. Most often this is an issue with Macs because they do “smart punctuation” replacement, including in TextEdit, the default text editor.

This is mostly a problem for quotes, where it changes quotes (") to their directional alternatives (“ or ”). Here is their support document on the topic. When writing prose, this is generally a good idea. In writing code, it’s not.

In Windows, such smart replacement done at a program level on certain word processors, like Microsoft Word, but not in things like Notepad, the default text editor for Windows. This is why it’s more of a problem for Mac users.

Straight double quotes (") are different characters from open and close quotes (“ or ”). They look very similar to us, but the JavaScript/Node.js parser doesn’t think so. Straight quotes have the code points of U+0022 or U+0027, but directional quotes have completely separate code points.

If you’re having trouble with smart quotes, you’ll need to start using a proper text editor that doesn’t allow the system to automatically insert directional quotes. The default editor on Mac (called TextEdit) is much more of a note taking or word processing program (much more like WordPad) than a text editor for code. It doesn’t understand code, and does things that break it. Use a true text editor like Atom, BBEdit, TextMate, etc. Or more sophisticated tools like Coda. Pick one, download it, install it, and use that to open/edit/save your config and other code files. (NB: I recommend Atom because it is supported and distributed by GitHub, is free, and is well-supported and open-source, with a good plugin architecture and community. YMMV.)

Once you’ve downloaded and installed Atom (by moving it to your ~/Applications folder on your Mac) you can run it then open the file, or right-click a file and select “Open with…” and choose Atom. Not only will it not break your code, it will colour-code (called “syntax-highlighting”) it, show you where brackets/braces match, and can help to make your code legible (called “Beautify” in Atom).

In order to edit remotely on (for example) a Raspberry Pi on your local network, you can use an SFTP client like FileZilla or CyberDuck. SFTP will need to be enabled on your RPi. You can then connect to the RPi and edit files remotely (not download, edit, upload; both programs have an “edit” option that will let you edit and save remotely in an editor … change it to Atom for js/css/html files in the preferences). This should allow you to edit files on your MM remotely.

[Mykle1]

@ninjabreadman

Damn, why didn’t I think of this tutorial? :-)

[ninjabreadman]

@Mykle1 Thanks! I keep seeing it mentioned in the forums, and wanted to give us all a quick way to refer people to help. I’d already written most of it with all of my responses here so I decided to rearrange them into a freestanding post.

[Mykle1]

@ninjabreadman

Excellent idea, sir. I’m only sorry you thought of it first. ;-)