WebStorm JavaScripting & Noding Workflow Webinar Recording

Today the JetBrains team wrapping up final processing for my webinar from last week. You can check out the webinar via their JetBrains Youtube Channel:

JavaScriptFor even more information be sure to check out the questions and answers on the JetBrain WebStorm IDE blog entry. Some of the questions include:

  • Q: How to enable Node.js support in PhpStorm (PyCharm, IntelliJ IDEA, RubyMine)?
  • Q:How to enable autocompletion for Express, Mocha and other libraries?
  • Q: Is it possible to debug a Node.js application that runs remotely? Is it possible to debug when your node and the rest of the dependencies (database, etc.) are running in a VM environment like Vagrant?
  • Q: Does the debugger support cluster mode?

…and others all here.

Deploy a Framework Friday #4 Some Node.js .gitignore Cloud 9 IDE Sharing toward Cloud Foundry / Iron Foundry Deployment

Today’s “Deploy a Framework Friday” is a little bit of a diversion. Today Richard (@rseroter) and I dove into Cloud9IDE (@Cloud9IDE) to try out some pair programming with the online IDE sharing. We made some minor progress with Matt (@matt_pardee) & Eric (@ang3lfir3) jumping in for a few minutes. The intent of this effort was to pull together a little code to deploy, as Richard wrote about a few months ago in the article “Deploying Node.js Applications to Iron Foundry using the Cloude9 IDE“.

Here’s a video of us all fumbling through attempting to get the .gitignore file setup.

Richard Seroter (@rseroter) and I (@adron) took a stab at sharing some code, with the attempt to do some pair programming. We made a little progress, and even had some people join us live via Twitter and edit some of the code with us. For a short play by play, check out the blog entry here: http://compositecode.com/2012/08/03/deploy-a-frame…dry-deployment/


  1. Why did the .gitignore not show up on Richard’s Screen?
  2. What were the intermittent errors that came up?
  3. Why did it say I was setup for “premium” but I couldn’t use express?
  4. Is it supposed to be that the other person can’t make changes while someone is chatting?

I’m not sure what happened (anyone at Cloud 9 IDE know what happened) when the .gitignore totally disappeared  but in the video you can see that I committed and pushed the .gitignore file. I had to recreate it to get anything to show up, and initially it didn’t seem to share either. I’m not sure how that is supposed to work, but am assuming something wasn’t setup correctly in the first place.

As for express I’ll be giving that a try a little bit later.

Next Steps Toward Deployment

Over the next few weeks or so, Richard and I will be going back and forth building a Node.js based web application for deployment from Cloud 9 IDE to our Iron Foundry Environment. Overall, this will be a slightly drawn out “Deploy a Framework Friday“, with its own sub-parts to the series.

We’ll culminate the project in an open source project that will be available on Github and also with a summary on the Iron Foundry Blog. In one of our pending blog entries we’ll draw up the architecture of the application we’ll be building out. So stay tuned!

NOTE: Working in conjunction with these other bloggers / blogs:

JavaScript Development Environments (Unabridged Results)

About two weeks ago I put together an initial list of JavaScript Tools & IDEs. Over the last week at OSCON, talking to a number of people who are into and using JavaScript on a daily basis, I’ve come up with a larger list of tools and IDEs.

Browsers On Your Dev Machine

Tools I’m Using…

Tools I’m Trying Out…

Suggestions From The Twitterverse! Thanks Everybody.

  • JoshuaPoehls (Joshua Poehls) JS Fiddle, Jasmine, JS Test Driver
  • davidalpert (David Alpert) Firebug + Aptana
  • xinmyname (Andy Sherwood) Chirpy, Web Workbench
  • encosia (Dave Ward) VS2010, PhpStorm, Notepad2, Vim, & Textmate depending on the project…
  • danemorgridge (Dane Morgridge) Macvim, Textmate, and Chrome
  • lazycoder (Scott Koon) WebStorm, vim Chrome dev tools, Google Closure Compiler
  • jerrysievert (Jerry Seivert) Textmate, jshint bundle which activates on save.
  • liammclennan (Liam Mclennan) Sublime Text 2, CoffeeScript and Shell Scripts
  • lucisferre (Chris Nicola) Vlm, js Vlm Plugins, & Jetbrain’s Stuff.

JavaScript Development Environment

JavaScript is pretty easy to develop with, usually only a browser and a text editor is the only thing needed. But seriously, that’s a bit slow going. It helps a lot of have certain tools, editors, debuggers, or other pieces to make the development move along smoothly. So far, over the last few months of doing a little JavaScript here and there I’ve accrued the following tools to help with my JavaScript Development. First a few descriptions of what I’ve been using and and why, then toward the end I’ll provide a full list of tools.

Web Browsers: Primarily there is Firefox, Internet Explorer, Safari, Opera, and Chrome. I’d almost say it doesn’t matter which one you use to view the web in. With Internet Explorer 9 they’re all pretty fast with JavaScript and all render the latest HTML fairly well. Albeit none are 100% complete some are much more complete than others. But since this is about JavaScript I’m focusing on that aspect.

Debugging: Of the web browsers the top two for the last few years have been Firefox with Chrome coming in second. One of the main reasons is because of Firebug in both browsers. It originally came out for Firefox if I recall correctly and then became available for some others. Even though Firebug is mainly a player on Firefox each of the browsers have pretty extensive debugging capabilities now for Javascript. I’ve not tested Opera too much for debugging, but each of the others I know have the ability to set break points, actually pinpoint where real errors in code are, and more.

IDEs: WebStorm by Jetbrains is awesome for JavaScript. Matter of fact many of their IDEs are great for JavaScript. Visual Studio is also pretty decent once you add the various plug ins/add ons for JavaScript to gain more Intellisense support and other features.  Overall these are the primary IDEs that I’ve been using for development of JavaScript and they’ve all served me pretty well. Do I long for more capabilities and options in the IDEs? Sure, but overall the IDEs today are much improved over just the last couple of years.

Integrated Development Environments, Browsers, and Addons

  • Visual Studio 2010 w/ ReSharper 6
  • WebStorm by Jetbrains
  • Rubymine by Jetbrains
  • Firefox
  • Chrome
  • Internet Explorer
  • Opera
  • Safari
  • Firebug
Over the next few days I’ll be attending OSCON, picking up a lot more tools, tricks, and other JavaScript goodies, so will post a follow up to this blog entry. Please feel free to add any suggestions or comments and I’ll add those to the “unabridged” list that I put together!

VS2010 Tools (These Are Awesome, Get em’)

I’m a little late to this party, but thanks to Somasegar’s “VS 2010 Productivity Improvements, Part IV” and Mathew Johnson’s “Changing Visual Studio’s Color Palette” on the Visual Studio Platform Blog.  I’ve now got Visual Studio looking like this:  (Click on the image to view full size)

Visual Studio 2010

I picked up the Embers Theme on studiostyles which I found easy on the eyes, but without some of the color bleed that the other theme Somasegar suggested.  However, everyone’s eyes are a bit different, so pick and choose as you will.

The classes and methods shown with color coding on the left hand side of the code window is done with VS10x Code Map.  The image below shows the code window with the code map showing.  This can be really handy when you have a large class file or are just trying to navigate around the file easily.   (Click on the image to view full size)

VS10x Code Map

The next tool that is a must have is the Visual Studio 2010 Pro Power Tools.  Some of the key features for this tool include:

  • Document Well – If you aren’t sure what this is, go check out the more info.  This is a pretty awesome feature, the download is worth this alone!
  • Searchable Add Reference – Everyone needs this at some point in time or another.  It is a huge pain in the ass to find references, this resolves 99% of that pain!
  • Ctrl+Click Go To Definition – Yes please, thanks!  I want my hands on the keyboard, not the mouse.  :/

Another tool, that sounds very very similar is the PowerCommands for Visual Studio 2010.  This adds must have right click features (yes, I know I just fussed about right clicking and using the mouse, but these features are needed regardless so I suppose a right click menu is acceptable.  But would rather have them as short cut keys).  Some of the key ones that are huge lifesavers are:

  • Show All Files – This isn’t the standard show all files that shows hidden files, it does that but does it for the entire solution!  🙂  I dig it.
  • Undo Close – Ever close a code file by accident, this will get that file opened back up ASAP.  In true keyboard short cut fashion it is available as Ctrl+Shift+Z.
  • Collapse Projects – Nuff’ Said!!!!!
  • Open Command Prompt – This is nice, again, keyboard only dictates that command prompts will be being opened!

They’ve absolutely improved my day to day coding and am sure they’ll be a great help for anyone that lives in the code regularly.  So go check em’ out, I promise you will not regret the time spent.

kick it on DotNetKicks.com Shout it