BLOG

Rapid Prototyping with AngularJS & Bootstrap

27 Nov 2014, by Moe in Developer

With the rapid growth of technology comes along the rapid growth of implementing that technology. In today’s world we have so many people with great ideas and even the people to fund those ideas. However, investors have become weary of investing in merely an idea, they want to see something more than that, something that gets them excited at the prospect of increasing their ROI significantly. Now a days you are also competing with others who may have similar ideas so you need a way to distinguish yourself and put yourself ahead of the game and that’s where prototyping comes in.

I’m talking about prototyping, where a sort of proof of concept is created but at the same time has some of the core features of a finished product. The reason people don’t go with prototypes is that they still take a decent amount of time to develop and may not yield anything in the end. So we need to increase the speed of developing these prototypes while maintaining a low cost. For most web applications I would suggest using AngularJS and Bootstrap.

AngularJS makes writing JavaScript easy by allowing us to read and write data to the view quickly and easily. Boostrap gives us an easy to work with UI and layout system. So most of the work is spent primarily on pumping out functional features with mock data. We can also quickly add free libraries that make Bootstrap and Angular work hand in hand almost effortlessly. At this point we are really just throwing things on the screen with bootstrap components while using an angular controller to manage the app. Since we are prototyping, efficiency, testing, best practices are of no concern so that saves us a lot of time as well.

Now we have a functional prototype that is able to show the features in action, rather than slideshows, documents, or merely discussion. The benefit is that now we can test our app in a controlled environment and make changes quickly as well. And if our prototype is a success we can even take that and use it as a skeleton for our full app.

In conclusion, we can leverage AngularJS and Bootstrap to rapidly develop a functional prototype with mock data in a short time span. I threw this together in about 30 minutes just as an example: http://codepen.io/MoeBDC/full/zxGqyy .

LEAVE A COMENT