Ok, this time around lets talk about some of the little apps that make our lives a easier – they may not be worthy of putting on a resume but we all have found apps that make our lives as front-end developers a little easier.
XML Notepad 2007 – Simple XML Viewer & Editor
A simple XML editor – stop going blind by looking at thousands of lines of XML – this little app does a great job of revealing things to you via collapsible nodes. It allows you to insert / edit / create nodes and even drag them around. Not always necessary but always very handy. You can even go so far as to create an XSLT to preview your data.
Download XML Notepad 2007 from http://www.microsoft.com/en-us/download/details.aspx?id=7973.
OpenOffice Calc – Export data as XML
Ever tried to use Excel to export a spreadsheet as XML? Sometimes it works – mostly only when you create your own schema – I honestly like how you can drag and drop XML nodes to spreadsheet columns. However, it doesn’t always work and any error messages you get are cryptic and don’t easily point you in the right direction.
OpenOffice 4 has greatly simplified exporting data as XML. You can export any spreadsheet as XML without any configuration beforehand. Perfect and easy! You have to do two things – 1) Download and install OpenOffice 4, and 2) Download the Simple XML exporter (follow the directions on the Simple XML export site to install it).
A couple of things that I noticed with the Simple XML Export tool is that it will attempt to convert your column names into XML-friendly values. For example special characters are converted to hashes. Spaces in names are converted to a dash, etc. I suppose this is only natural due to the “configuration-less” nature of the export.
SQL Lite Database Browser
If you’ve ever done heavy WebSQL work you’ll now that the SQL view in Chrome quickly bogs down to the point where its completely unusable. Well, this little gem will let you view your SQL file – query it, manipulate the data however you like. Its a great tool for development and testing.
Download SQL Lite Database Browser here.
To find Chrome’s SQL database on windows:
- C:\Users\[Your User Name]\AppData\Local\Google\Chrome\User Data\Default\databases\
Custom Scroll Bars in Desktop Browsers
Designers love to replace native widgets with their own designerly stuff. A few weeks ago I had to duplicate an artistic scroll button / slider. Because I needed IE 7+ support I couldn’t use my go-to which would have been iScroll.
I went through a few of the different scrolling libraries out there and spun my wheels for a bit. I went on to try Slider, NiceScroll, Scroller, enScroll and glanced at jQueryTools and jQueryUI. In the end I settled on something called “jQuery custom content scroller”. It didn’t give me IE 7 compatibility – but in that case I stopped caring as “overflow:auto” worked just as well – sometimes a designer has to give a little as there’s only so much that we as devs can reasonably do.
One thing that I immediately appreciated about it that the other scrollers failed on was the ability to change the dimensions of the scroll handle. The other libraries didn’t take into account the new dimensions of the handle and so they wouldn’t correctly calculate when the handle reached the bottom of the slider track preferring instead to stop the handle in the middle of the track. “jQuery custom content scroller” in fact takes a look at the existing handle dimensions thus allow it to be dragged appropriately.
Anyway, if you’re looking for a flexible scroller for your desktop websites then I suggest giving it a shot.
Download jQuery custom content scroller here.
XMap Image Map Editor
Not everyone has a GUI HTML editor with nifty tools like a GUI-based image mapper. xMap is a free stand-alone tool that offers a GUI-based method of creating image maps.
Download XMap here.
RELOAD SCORM Player
Great tool that will load your SCORM packages within a SCORM 1.2-compliant environment. It keeps track of the all CMI data so that you can test if you’ve integrated your SCROM wrapper correctly.
Download RELOAD SCORM Player