Here at Ubiq we struggled with the path we would take in developing our device managing dashboard – a web application. This is likely because of our combined experience in web development – limited. The purpose of this software is to allow the owner of a device or devices to setup, configure and observe the use of each or many of them. We had a few requirements that we wanted to achieve. The first was that we could make a single page application, thereby limiting the amount of time a user spent moving between whole web-pages. Second, we wanted a tool that would allow for modular development.
Angularjs, with regards to our first requirement, is an excellent instrument. The ‘directive’, a construct specific to the library, allows for the manipulation and implant of custom html elements into the overarching structure of an application or webpage. Each directive, given a descriptive name, can make your index file easily readable and comprehensible. In making use of the ‘Attribute’ directives one can add functionality to native html objects or using ‘Element’ directives you can make entirely new ones. With the former you could make a particular view appear or disappear on the change of a value. The latter can conceal html within a single html tag. Together, they can efficiently display multiple in a single page. Angularjs will only call for the specific, concealed, html file required by the directive when it is to be displayed. If it has been displayed before the file will be in the cache. This makes the user experience almost seamless.
These directives also contributed to the attainment of our second requirement, modularity. By being able to separate the html of large, yet distinct elements we could also then separate the business logic of the application. A second library specific feature is the ‘service’ or ‘factory’. We used these to limit the access of our controllers to specific APIs, each controller associated with a ‘directive’. The controllers allow for data to be bound to the html. The APIs allow for controller-to-controller and app-to-server communication. With this we were able to maintain distinct responsibilities between the disparate pieces of our application.
In conclusion, we are coming to the end of our opening salvo of development on the Dashboard application. The learning curve was steep. Much research had to be done in order for us to feel confident in our approach with Angularjs. However, the end result, in our minds is an aesthetically appealing and useful application that should present little difficulty with respect to bug fixing and updating as the company progresses forward in response to customer desires.