Whether taking a quick note on a random task or idea, or banging out a chunk of markup for an enterprise-scale application, I often find myself relying on Notepad++ as a quick and easy way to capture stuff.  For braindumps, nothing beats it.  For those not already familiar with Notepad++, you can get more info here.

When it comes to utilizing Notepad++ as a full-fledged solution for web development, it falls short of IDEs such as Dreamweaver, Visual Studio, or Eclipse.  Each of these applications contain a host of powerful functions, utilities, and file/asset management resources that are not native to Notepad++.

For the freelancers of the world, small dev/design shops, or even established teams within larger organizations, the cost of upgrading or purchasing licenses may simply be too high.

On the other hand licensing may not be the issue at all, particularly with Eclipse.  Instead, performance, configuration, or memory-consumption headaches may be what plagues your team.  Now, before a flame war ensues on the merits of Eclipse, let me just clarify that I’m a big fan of the platform.  But, I do know I’m not the only one who’s encountered their fair share of headaches trying to get plugins (Subclipse, I’m talking to you) to behave reliably, particularly on team projects where synchronization is essential.  This also certainly isn’t to say that Dreamweaver and VS are free of such issues.

If you’re looking for a lightweight IDE that is fast, functional, and free, then rolling your own with Notepad++ might be just the solution you need.  In the following steps, I’m going to show you how to re-purpose this great little app as a self-contained IDE capable of tackling the most demanding projects.

Step 1: Download and Install

To get started, let’s first download and install all of the things you’re going to need.  I won’t go into the details of setting up a subversion server in this post since there’s plenty of documentation out there on the subject.  But if you encounter any major hurdles with it, feel free to leave a comment and I’ll see if I can answer your questions.  So, let’s get everything downloaded and installed:

• Notepad++ (executable)
• Notepad++ Explorer Plugin (dll zip)
• Notepad++ Compare Pluging (dll zip)
• Notepad++ FTP Synchronize Plugin (dll zip)
• Subversion Server
  
• Tortoise SVN Client

Once you’ve got everything downloaded and installed,the next step is to create a repository for your project files.  Once you’ve done you’re initial commit and your project is running happily in subversion, you’re ready to start tweaking Notepad++.

Step 2: Configure Notepad++ Settings

Enable Auto-complete

There are a few adjustments you can make to get Notepad++ to behave more like the big commercial IDEs.  The first is to enable Notepad++’s auto-complete (aka IntelliSense).  Go to: Settings -> Preference… -> Backup/Auto-completion.  Check the option Enable Auto-completion on each input and make sure the radio option is set to Function completion.  Now, when you begin typing in markup, you’ll be greeted with a convenient auto-complete menu to speed things up.

Adjust Language Support (optional)

Although Notepad++ supports a LOT of languages, some developers may find it necessary to make some adjustments to the syntax highlighting in order to accommodate languages not natively supported.  For example, if you open a .Net-based ASPX or ASCX file, or a file in Adobe Flex’s MXML format, you’re not going to get syntax highlighting.  No worries, we’re going to fix that right now.

What you’ll want to do is open C:\Program Files\Notepad++\langs.xml.  The langs.xml file is where all the syntactial magic happens.

The easiest (although not totally 100% perfect) method to get Notepad++ to play with your language is to find a language that’s similar to the one you need support for.  For example, I work with ASPX files quite a bit, but most of the elements within those ASPX files are straight up HTML.  So, all I have to do is scroll down in Langs.xml and find <Language name=”html”></Language>.  In the ext param, add the extensions you want to support.  In this case, I’d add aspx and ascx (e.g. ext=”html htm dhtml xhtml shtml ascx aspx”).  Save Langs.xml and re-open any of your ASPX or ASCX files Notepad++.  You’ll be pleased to see syntax highlighting working as expected.

There are instances where this quick-and-dirty approach won’t quite work because a language simply has too many unique tags/rules/etc.  In this case you’ll want to create your own language definition in the Langs.xml.  But that’s for another post.

Step 3: Configure Notepad++ Workspace

Now that we’ve got the core settings taken care of, the last thing remaining is to adjust the workspace.  First, go up to Plugins -> Explorer -> Explorer.  This will pop up a pane that enables you to browse your local file directories without having to leave Notepad++.  Next, go up to Plugins -> FTP_synchronize -> Show FTP Folders.  This will add a tab in your file explorer view for FTP connections.  Enter your FTP login details and you can then transfer files directly to/from your web server via Notepad++.

Step 4: Get To Work!

Now it’s time to get coding.  But, you’re probably wondering about the other two things you installed (Tortoise SVN and the Compare plugin).  Now is the time they come into play.

As you begin creating and editing files in your project, Tortoise enables you to commit changes to your subversion repository, roll back changes, branch, merge, so on and so forth.  The cool part is, now that you’ve got your file explorer displaying in Notepad++, you have access to all of the Tortoise menus directly in Notepad++ as well.  Simply right-click on any file and you’ll get the Tortoise source control menu options.

Finally, the compare plugin will come in handy when you need to compare versions of a file.  Whether it’s comparing a working copy against a repository copy, or duplicate files in a local folder, the compare plugin is pretty adept at displaying differences.

That’s it!  Everything’s configured and you have yourself a shiny new IDE.  And best of all, it’s totally free.

Tweet This Buzz This Post Digg This Post Facebook Stumble This Post