Back to blog home page

Which is the Best Seed App for Your Angular Project?

Posted by on Mar 18, 2015

The first step of application development – no matter what type of application you plan on writing – is always the same: get an initial version up and running. While it is possible to start from a blank editor and build out a scalable web application in the appropriate pattern for your language and selected tool chain, oftentimes there is a lot of tedious setup work that needs to take place before your application functions properly. Luckily programmers are always looking towards optimizing the more mind-numbing tasks of development. In this article we’ll take a look at what a seed application is, some of the seed applications available for AngularJS development, and what they present you with upon completion.

What is a seed?

Simply put, a seed is an application that builds out the framework that supports the application’s run time environment. For a Windows application, this would include framework code to get a window displaying on the screen. For a web application, like those coded in AngularJS, this often includes setting up a basic lightweight web server, routing, and basic templates to show that the entire setup is indeed functioning. While these projects can lead to a production-ready deployment system, they are more often used to simply get a workspace up and running so that your development team can begin iterating as soon as possible.

Angular-kickstart

Angular-kickstart is an opinionated build system that scaffolds your AngularJS project. It uses several different tools (SASS, gulp, bower, and node). Using gulp, it watches a client folder that contains the code for your application, and triggers a browser refresh each time a change is detected. Additionally, the use of gulp provides a build and deployment system sophisticated enough to tackle the entire software development life cycle – from continuous integration to production deployment.

Angular-seed

Angular-seed is an application skeleton for a “typical” AngularJS application. Angular-seed is built on top of node and bower, and builds out a basic AngularJS application running on Node.js. It sets up basic placeholder templates and code, and provides a testing environment to use as your application grows. While it contains a configuration file for continuous integration via Travis CI, you still need to configure the application to communicate correctly with your application’s git repository.

Yeoman

Yeoman is unique among the above options in that it is not specific to AngularJS, but rather is built to work with many popular JavaScript and web frameworks. It quickly builds a scaffold for your web app, integrating both build systems and package managers to manage your code’s growth. While options for the final product are configurable, the default AngularJS configuration uses grunt and bower, with Node.js serving as the web server. Yeoman itself is flexible enough to scaffold either the entire application, or just individual portions like Models or Controllers.

Conclusion

The introductory phases of any application involve a lot of tedious work. Getting the tool chain ready, enabling deployment, and setting up a testing environment are all crucial tasks that, while important, still detract from the overall goal of developing a web application. You can reduce the pain caused by these initialization steps by allowing a seed application to perform the work for you, allowing you to focus on the design and development of your web application. Ultimately choosing which seed project is going to depend upon the environment preferred by your development team, meaning there is no “correct” choice. In the end, the array of seed projects are all focused on the same task – getting your environment up and running so that you can spend your time on development and iteration instead of on your application’s environment.