best practices for developing javascript for sharepoint

Feb 12, 2012 at 1:51 AM

Hey Mark,
Can you share some of what you;ve learned about how best , most productive, way to devlop javascript for sharepoint?

If I have keep my javascript in a document library, It's mot easy to edit it with visual studio. Ther'es no
file--> open with, vs2010 as far as i know.

What editor did you use when developing spservices? VS2010 is OK, but it would be great to have refactoring , intellisensese, etc..

Any tips on this?

Feb 13, 2012 at 1:24 PM


Best practices can be misleading, as there are often quite a few good practices, some of which may make sense for you in your environment and others which may not.

As for my development, I use SharePoint Designer 2007 on a WSS 3.0 environment to do most of the work. I then test things out in MOSS, SharePoint Foundation and 2010 Enterprise. I'm an old school coder, so the amount of color coding and hints for script that I get in SharePoint Designer is fine for me; all the fancy Intellisense and refactoring tools just get in my way.

One trick you can use is to map a drive to your Document Library. That way you can open your script files with your tool of choice.


Feb 13, 2012 at 1:44 PM

Mark Rackley provides some good options for getting started with jQuery (but the points are valid for JavaScript in general) on his blog at SharePoint Hillbilly.

Feb 13, 2012 at 1:59 PM

I'm with Marc here, most of my development is done directly in SharePoint Designer. I've also found a good browser based tool with console input is also valuable so that I can run code directly against the SharePoint environment to force hit breakpoints to see what's going on inside the code. FireBug has been my tool of choice, but most modern browsers have good developer tools that include a console.

Another good tool to grab is NotePad++. It allows you to have a bit more color coding that SPD and you can download plugins that connect directly into JS minifiers and/or JSLint so when you're done you can validate and compact your code. This works best with the mapped folder idea Marc discussed in his post. I just wish JSLint would include an assume jQuery option now that it is such a popular JS framework.

Feb 13, 2012 at 6:06 PM
Wanted to comment on my setup...

I like a more full featured IDE... I use Eclipse with the excellent Aptana plugin, which provides a full fledged IDE for JavaScript coding...

My usage with SharePoint is as follows:
  • I have a project in Eclipse where I develop all code locally on my PC. My code is also version controlled to a CVS server.
  • I have a mapped drive to a personal site on SharePoint that I consider my Development environment.
  • My project has an 'ant' build file with a custom target called "Deploy" which basically just copies my source directly to my Development SharePoint environment. I can then test on the browser.
My setup then allows me to "package" updates (in zip files) that can be distributed to other sites (I have very littel dependencies on workflows or other "server-side" customizations. I realize this is perhaps over-kill for simple customizations, but works well for me (I'm already a long time user of Eclipse for non-java programing).

Paul T

Feb 13, 2012 at 9:42 PM

Hi all,

Thanks for sharing your approaches.

My favourite setup is to use Visual Studio 2010 for coding and startup the VS development http server on my local machine on a fixed port (use project settings). In your HTML file you can refer to JS and CSS files on your localhost,e.g. <script src="http://localhost:35000/myproject/app.js></script>. Now I can just code in VS and hit CTRL-refresh in the browser to do a refresh. Once development/testing is complete, I package/compress the JS files (e.g. with Jammit) and put them on SP. So you need 2 HTML files: one for development, refering to CSS/JS sources on localhost and one for production, refering to build files on production.

I use Git and GitHub as repository (simply Git Init in your project file).


Feb 14, 2012 at 12:34 PM

Another thing I should have mentioned: I frequently put SPServices through JSLint. I don't always listen to everything it tells me (the page says "Warning!JSLint will hurt your feelings.") but it gives me a lot of good suggestions on what I need to be doing better.

Using JSLint may not make a lot of sense for small pieces of script, but for anything of decent size, it'll help enforce some discipline. If you're part of a development team, agree on what settings you'll all use and discuss which options you all will set on or off.


Feb 15, 2012 at 12:44 PM

Hey, thanks everyone for the IDeas. I think the mapped folder will save me a lot of time when wrting javascript in vs2010.