Adding an existing Angular.js seed project to Webstorm 6.0

My journey into JavaScript land has begun. The first thing I had to do was get an Angular.js seed project up and running in the WebStorm IDE. This is a no brainier, but useful to some if you are starting out. The first step in the process was to install the Angular.js plugin which will help you in development by adding Auto-complete for ng-attributes and other Angular features.

Open up WebStorm and select the configure option:

Screen Shot 2013-05-08 at 3.58.33 PM

Navigate to Plugins and double click:

Screen Shot 2013-05-08 at 4.01.26 PM

Navigate to the bottom of the panel and select the “Browse Repositories..” button. This spawns a new window. Double click on the Angular.js plugin:

Screen Shot 2013-05-08 at 4.03.24 PM

download, install and restart.
Screen Shot 2013-05-08 at 4.04.04 PM

Now, click on “Open Directory” and point to the directory with your seed project.

Screen Shot 2013-05-08 at 3.12.28 PM

You may need to perform some extra configuration in WebStorm, in my case it has to do with Git and an “Unregistered Git root”.
Screen Shot 2013-05-08 at 3.12.02 PM

I resolved the error by  clicking on the Event Log button at the bottom of the WebStorm IDEScreen Shot 2013-05-08 at 4.32.43 PM

and selected the “Ignore VCS root errors” option, which gets rid of the pesky error alert.

Screen Shot 2013-05-08 at 4.32.53 PM

And there you have it, get to work.

#UPDATE –

Here’s an excellent tutorial on how to install and configure Apache, MySql, PHP and PhpMyAdmin on OSX 10.8 (Mountain Lion)

OH JUST IN CASE:

To remove an existing project, select the project in the Recent Projects bin and press delete.
Screen Shot 2013-05-08 at 3.41.50 PM

On the Mac, you have to hold down the Function key while pressing the Delete key. Happy coding.

2 thoughts on “Adding an existing Angular.js seed project to Webstorm 6.0

  • August 11, 2013 at 8:24 pm
    Permalink

    Here is a pretty nifty angular seed with a cleaner directory layout and modules loaded asynchronously with RequireJS. The most important part is, it loads controllers in a per-demand basis, meaning: there is no overhead in loading bunch of unnecessary controllers before you need. Definitely, give it a shot.

    Reply
    • August 12, 2013 at 2:26 pm
      Permalink

      Thanks Mohammad. I have definitely played with the particular seed, but i have not needed the awesome-ness that Require.js provides, one day I hope to use it.

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

%d bloggers like this: