Angular Rapid Development

Tommy Cresine

Automate All The Things

Learn Gulp & Slush

• Gulp is a code over configuration task automation framework as a replacement for Grunt. It has significant improvements to performance by utilizing Node streams.
• Slush is a scaffolding tool using Gulp as a replacement for Yeoman.
• Using these tools will help you write better Javascript in the end. Rather than configuring a giant object to do all that work for you without understanding how it's really working. 

What Gulp Should Do

• Lint your code
• Run tests
• Process your stylesheets (LESS, SASS, etc)
• Inventory and inject application files and bower dependencies automatically for you.
• Process your templates as jade, insert them into template cache
• Process management via PM2
• Live reload

And much more.....

PM2

A process manager for Node.js that provides robust management tools and a built-in load balancer.

• List your processes in one JSON file (api, mongo, etc).
• Programmatically start and interact with your processes.
• Streaming logs in a separate prompt `pm2 logs`
• Automatically restart on fail or file changes.

Structuring Your Project

Within your app there should be 2 types of modules:

State

Component

• States represent applications states using ui-router or even the new angular router when it comes. 
• Each state has it's own controller and configuration.

• Components are any reusable component. Treat everything like it's reusable.
• It's better than putting overly complicated nesting within modules and creating circular dependencies.
• If it's not a view state or controller for a view state it should go here (directives, services, filters).

Bird's Eye View

Components  Structure

States  Structure

Next Steps

• Utilize nested states and resolves for working with data. Keep controllers thin.
• Self aware models are the best way to go (Restangular).
• Always continue assessments and improvements to development pipeline and/or scalability of your application. 

Thank You!