Tag Archives: angular.js

Open Stories

Plunker: Open Editor Perfect for Angular.js


Some of the best open-source technologies are based on a great mix of things.

It usually comes after somebody with an entrepreneurial spirit confronts a problem due to old mentalities. As the old saying goes: “necessity is the mother of invention”.

Innovation is often about molding different pieces together and building something new out of it all, taking failure and turning it into the creation of something new.

3M’s post-it notes were created because one scientist named Spencer Silver failed at creating a strong adhesive for the aerospace industry. Instead, the result of his work was too weak to be used to mold together much of anything.

It was Art Fry, another 3M scientist, who was frustrated by how his paper bookmarks kept sliding out. Turning to what had been regarded as a failed adhesive, he realized that if he stuck the weak glue onto a paper, it could represent a temporary sticky paper, a way for one to mark one’s position—a bookmark that wouldn’t slide out.

That was the birth of Post-it notes, bathed in the spirit of innovation.

Plunker: A Primer in Open Innovation

Plunker with code(love)

Plunker with code(love)

In that spirit, Montreal-based Plunker is a good example of what happens when necessity strikes exactly the right person.

The creator, Geoff Goodman, is a programmer by calling, but not by profession. He works for one of the largest accounting firms in the world, but his true passion is building web technologies.

By day, you’ll see him plugging away at financial models for the sake of profit. At night, he’ll be driven to build things for the sake of passion.

He recently came across a pain point of his that needed solving. He had been using JSFiddle to help sandbox and prototype several versions of his code, but found that it was lacking for more complex Javascript frameworks such as Angular.js, which require more of a file-by-file approach where you can separate out different aspects of your code into a contained and organized multi-file system.

Geoff had been looking to build a timesheet application, but was frustrated by how JSFiddle’s sandbox couldn’t take on the more modern and complex Javascript frameworks that were required to make the application truly interactive.

So he set out and modified the Ace text editor, an open-source code-editor used by Cloud9 to help programmers build and prototype applications in the cloud.

Prior to finally installing Linux on top of my Chromebook, Cloud9 was the only way I could access node.js, and other tools that allow you to build out full web platforms, rather than simple display-only HTML/CSS pages.

The Ace text editor is open-source technology that aims to emulate the features of other text editors for code such as Sublime Text. Geoff built out an intuitive user interface with Ace that allows one to save one’s sandbox experiments (dubbed Plunks) and toggle easily between different Plunks, and different files within the Plunks. You can test your code, and see the live results instantly, which is quite gratifying for more complex applications that don’t load well in JSFiddle.

Modulus.io, responsible for scaling node.js applications, and MongoLab, which offers MongoDB have pitched in to help build out and scale the back-end for saving and accessing Plunks. The Angular.js team and tons of denizens of StackOverflow, a popular programming Q&A website, have used it to explain and teach code. Plunker has been an application built on open-source principles being helped throughout by a community that believes in it.

You can load up your plunks in Plunker with frameworks, including Angular.js, Bootstrap, and a whole host of others. You can save them for your own learning purposes, and watch what others have done with their plunks—this one taught me how to build with ng-table, an Angular.js function that extends tables to some nifty properties such as sorting, filtering, and pagination within tables.

Plunker’s been visited by hundreds of thousands of people, and used by many to learn and to teach programming. Plunker started with one person, frustrated at his own pain point. This is the beauty of the open Internet—something that allows solutions to spring from anywhere, supported by a community of people who believe that building is beautiful—and that sharing is caring.