Proof of Concept Cordova integration with Brackets

This post is more than 2 years old.

The past few days I've been working on a new Brackets extension that integrates with the Cordova command line tool. I've got a rough draft of it ready with almost every feature prepared so I thought I'd go ahead and let people know in case they wanted to start hacking on it. As it is not complete yet I've not added it to the extension manager, but once I wrap the last feature I'll go ahead and submit it. You can find the code for the extension on GitHub:

The extension relies on the Cordova CLI to exist, so keep that in mind, and it assumes you've already set up some mobile SDKs already. This extension doesn't remove the need to go through those steps, it merely serves to help you use those tools from within Brackets. Once loaded, you get a new icon in the right side menu:

It is a bit hard to see, but the icon is grayscale. Switching to a Cordova project switches the state to enabled.

Clicking the icon opens up a bottom panel with two tabs: Platforms and Plugins. Platforms is just that - a list of currently installed platforms for the project that shows which are enabled.

All I'm doing here is wrapping calls to the CLI. To be clear, I don't think the Cordova CLI is hard to use, but I think having a quick visual look at my Cordova settings is pretty useful. Note that there is poor visual feedback currently in the extension. The very first time you use a platform, like Firefox OS, the CLI will fetch the bits remotely. That can take 30-60 seconds. My extension doesn't provide any good visual feedback that it is working. It will correctly update the UI when done, but you don't get a loading indicator. For platforms already installed system-wide though it will be super quick. Also, Run doesn't actually work well now. I emulate more often anyway.

The next tab is Plugins. This will allow you to list, remove, and add plugins. Currently only list works.

The search field will hit and use autocomplete. I may even "fudge" it a bit since "accelerometer" doesn't match the plugin it uses (device-motion). You won't believe how many times that screws me up.

Anyway, I think this plugin could be useful more for the "what am I using" feature than actually firing off builds and modifying platforms. Let me know what you think. I wrote the code somewhat quickly so it has not been linted yet. I plan on doing that before my "official" release for 1.0.

Raymond Camden's Picture

About Raymond Camden

Raymond is a senior developer evangelist for Adobe. He focuses on document services, JavaScript, and enterprise cat demos. If you like this article, please consider visiting my Amazon Wishlist or donating via PayPal to show your support. You can even buy me a coffee!

Lafayette, LA

Archived Comments

Comment 1 by Robert Zehnder posted on 7/8/2014 at 5:00 PM

Looks awesome, Ray.

Comment 2 by Salvatore fusto posted on 7/8/2014 at 6:53 PM


Comment 3 by Raymond Camden posted on 7/11/2014 at 1:58 AM

Support for adding plugins and removing contacts is in. Roughly 60% of the work for it is there. You can't search yet, so you need to know the exact ID. For removing, it works, but doesn't handle the case where you try to remove X and Y needed it.

Comment 4 by Adrian Perez posted on 7/21/2014 at 12:33 PM

That's an interesting idea, I'll take a look at it. It will probably come in handy and I could contribute to it :)