5/17/2014 Comments angular large scale applicationsThe wrong wayI found it interesting to start writing this article by explaining the wrong way of designing an angular application. The so common way to design an application is to group your modules (controllers, routes, services, factories, directives etc). The controllers to be in a controllers.js file, the services to be in a services.js file and so on. None can say that this is a bad design, but you will notice in the near future that this is not a so maintainable design because it's hard to find and amend a route that is inside the routes.js file and this file has more than 100 routes. Imagine that you are the developer of a hotel booking app for a tourism company and there is a client that is trying to book a very pricey room and is came across with a serious bug and can't move on the booking. The owner of the application (your client) is calling you and inform you of this bug and that it needs to be fixed asap. For you the only clue of this bug is the booking page. You have to open the routes.js and see which controllers are taking part of the booking process...doh!!! there are so many routes in there and is hard to find the correct one. Next, you have to open the controllers.js file and see what is happening with the relevant controllers...dohh!!! again...so many controllers. a mess!! Finally you succeed on uploading a hot fix and the next step is to refactor the application :). A better waythis 'better way' meets the modularity. In a very brief description, you have to organize your application into several directories and each directory will be a 'module'. So, you can have for instance a module for authentication (login, register, logout), a module for profile (create my profile, edit my profile) and so forth.
Each module could have a js file for controllers and routes (module.js), an html file for templating, unit test files, e2e test files etc. So, in continue of the above example of the booking application, if you have a similar issue, you have to go into the booking module and try to find and fix the issue. By this way, the application is much more maintainable and extendable.
Comments
|
AuthorI am an Angular GDE, content creator who loves sharing knowledge TagsAll Angular Angularjs General Graphql Ionic Javascript .net Nodejs Typescript |