Subscribe Rss:


Sunday, August 11, 2013

Web apps Best Practices: I’ve Been Doing

I’ve been working on a  webapp that uses Jquery, AngularJS  for a few months now.  As many developers who pick up new things such as  Yeoman, Bower. 

I learned about Yeoman, Bower & Dev work flow from these video tutorials 

and adapted these into my web apps projects.Here are the areas where I’m improving my web development, with the aid of the latest and greatest tools:

Your Shell, sexy - Make your shell sexy and understandable, you can try one of these

Project layout - It’s important how you structure your directories. You are adding a new feature, and you immediately know where its directives, controllers, and models go. You need to fix a bug in a feature you have not touched in a year, and you know exactly where to look Here’s one example of a proposed structure, it includes lots of good things like tests and places for all the essential parts:

  • app/ – all of the files to be used in production
    • css/ – css files
    • img/ – image files
    • index.html – app layout file (the main html template file of the app)
    • js/ – javascript files
      • app.js – application
      • controllers.js – application controllers
    • lib/ – angular and 3rd party javascript libraries
    • partials/ – view partials (partial html templates)
  • config/ – config files for running unit tests with Testacular/Karma
  • scripts/ – handy shell/js/ruby scripts (run unit tests and dev server)
  • test/ – test source files and libraries

My web app structure : If you prefer to start the app with a static web server, then you try This plugin requires Grunt ~0.4.0

For creating the web apps in robust, then you can use  Yeoman - Modern work flows for web apps which comes with Yo, Grunt & Bower.

No comments :

Post a Comment