How I use Evernote as a code snippet organiser

As a web developer, I often use the same snippets of code on multiple websites.

To make my life easier, I like to save these snippets of code in one place so when I need to use them its just a case of copying them and pasting them into my code editor.

I know there are pieces of software specifically for organising your snippets of code, such as Cacher, but many of these tools aren’t free. And I don’t know about you but I don’t like investing in tools that when there’s a free alternative that works just as well.

For me, a free alternative that works amazingly well as a code snippet organiser is Evernote. As I’m sure you all know, Evernote is a free note taking app, and I use it a lot in my business for things like jotting down ideas and making notes from online courses I’m taking. But what you might not know is that you can add code blocks to your notes so you can paste in pieces of code and keep their formatting.

In this post, I’m going to show you how I use Evernote as a code snippet organiser. 

I created a new notebook in Evernote

First things first I created a brand new notebook in Evernote called Code, and this is where I keep all of my coding snippets.

You could create a notebook for each type of code your saving, like one for HTML, one for CSS, one for Javascript, etc. But having one notebook specifically for my code snippets works for me.

I create a new note with a code block for each code snippet

When I want to save a new code snippet, I start by creating a new note in my Code notebook. I normally give the note a descriptive title so I know exactly what it does.

So let’s say for example I wanted to save the code snippet that allows me to display an image using the image field type in Advanced Custom Fields (my favourite plugin!). I might make the title of this note “ACF image“.

Within the body of this code, I can insert a code block by clicking on Insert (+) and then Code Block.

Then, I can paste my code snippet into the code block I have just added.

Sometimes I’ll add additional notes to help me out when I need to use the code. So if we use the Advanced Custom Fields image example again, I might make a note to say that the return format must be set to image ID in order for this code to work.

I use tags to help with organisation

Another feature of Evernote that I like to use to further aid with organising my snippets is tags.

So, for example, if the code snippet is related to Advanced Custom Fields, I would tag that note “ACF”. Or, if I’m working on a website that uses the Genesis framework, then I would tag that note “Genesis”.

Then, when I’m working on a website, I can use these tags to help me find the specific code I’m looking for.

Pin for later?