angularjs Tag

Disclaimer: this approach won’t be suitable for everybody, please factor in your particular requirements before using it.

The Why

Towards the end of 2018, our client started to move our codebase from AngularJS to Angular 7+ (now 8). While this, in itself, is a great move, it completely broke our A/B testing capabilities. (What's A/B Testing?) Implementing deep changes  to our Angular applications would be much more challenging. The methods we used to amend code on bootstrap of AngularJS applications are no longer available in Angular2+. If you are interested in A/B testing in AngularJS applications, you can read about our previous approach and Adobe setup. While some A/B testing can, and should, be done from the backend, this article will focus on the frontend approach.
07 August, 2019 /

Learn more >

Web analytics tools are used to understand the behaviour of website visitors, and A/B testing is a technique that uses such tools to optimise a site. The tools facilitate this by giving you a means to measure and analyse site traffic and conversion.

Adobe Target is a real-time metrics-collection and reporting tool that is one of the most widely-used client-side analytics platforms available. In this blog, I'm going to talk about how to create an A/B test using Adobe Target and AngularJS, where the  'B' version is swapped-in using Angular decorators.
29 May, 2018 /

Learn more >

battlehack-logo WHAT A WEEKEND! I’m still recovering from the 24 hours of coding and the unhealthy amount of coffee and snacks I’ve ingested during this hackathon. Two weeks ago, Melbourne was host to the first Battlehack of 2015. “What’s a Battlehack?” I hear you ask. Well Battlehacks are competitions sponsored by Braintree (a Paypal company) where teams of developers face off over 24 hours to create the most creative hack that benefits the local or global community. The venue, which was the Plaza Ballroom on Collins St was well worth a mention. The vast ballroom was decked out with food stations, sleep and massage stations, and most importantly, our hacking stations, or tables of 4 for the long night ahead.
13 February, 2015 /

Learn more >

blindfold I recently did some preliminary work adding accessibility support to an existing Angular application. At the start of this work I knew very little about website accessibility, and I suspect the evolution of my thinking during the process would be common amongst other developers who have been in the same situation. Specifically:
  1. Initial annoyance at having to do it
  2. Slow progress reworking sections of markup
  3. Growing satisfaction that the app was becoming accessible to a broader audience
  4. The realisation that the codebase itself was actually better off for the process
In this post I’ll talk about the 3 things that I’ve done so far during this journey to an accessible Angular app: accessible icons, keyboard navigation and finally, ARIA support.
26 November, 2014 /

Learn more >

stringonfinger In my previous post on getter methods and Angular.js I showed how complex calculations can be hidden behind simple Javascript properties. One downside to this technique is that we can start to get a little blasé about when calculations are actually being executed. This can in-turn lead to performance issues. In this post I'm going to talk about expensive calculations in rich object models - be they hidden behind getter methods or just regular methods - and how we can use memoization to reduce the impact that these calculations have on performance. Memoization isn't something that you should use all the time, but for use-cases involving long chains of calculations it can be an effective optimization technique, especially within a framework like Angular. If you don't feel like reading, you can always jump to the part of my ng-conf presentation that covers memoization, or go straight to the Github project. Either way, I'm assuming that you're familiar with the foundational concepts I introduced in the first post in this series.
14 March, 2014 /

Learn more >

[caption id="attachment_5153" align="alignnone" width="384"]Image Sadly not all getters can be giant robots[/caption] In my earlier posts on Rich Object Models and Angular.js and Angular Identity Maps I've shown how, by introducing a rich object model to your Angular.js application, you can begin to employ more sophisticated techniques for modelling your business domain. In this post I'm going to demonstrate how we can simplify business logic by using getter methods to hide complex calculations behind properties. Furthermore, we'll do it in a way that slots in nicely with our existing rich-object model. If you don't feel like reading, you can check out the section of my ng-conf presentation that covers this or go straight to the Github project.
07 March, 2014 /

Learn more >

angularIdentityMap In my previous post on Rich Object Models and Angular.js I introduced a simple strategy for setting up rich object-models in Angular.js. It turns out that once we've introduced the notion of a rich object-model, a number of more advanced object-oriented programming techniques become easy to implement. The first of these that I'm going to discuss is identity maps. In this post I'm going to talk about what an identity map is, why you might need one, and I'll introduce a simple identity map implementation for Angular.js. I'm going to assume you've already read my foundational post. If you'd like to see the portion of my talk at ng-conf devoted to identity maps, jump to the video.
28 February, 2014 /

Learn more >

[caption id="attachment_4953" align="alignnone" width="640"]screenshot Another sort of rich model[/caption] Angular.js is deliberately un-opinionated about how you should structure your data models. Whilst it lays out very clear guidelines for directives, controllers and services, it also makes a selling-point of the fact that it can bind to plain-old Javascript objects with plain-old properties. Services are singletons, so it can be unclear as to if and how you can group per-object state and behaviours.  Consequently, people tend to fall back to services that deal in very simple JSON objects - i.e. objects that contain only data, not behaviour. However, building the sorts of rich interfaces that our users demand means that we sometimes need to more fully leverage the MVC pattern. Put differently, for some problems it can be useful to have a rich object model that provides both data and behaviour. Recently at ng-conf, I presented a simple approach I've used for using rich object models with Angular.js. This technique leverages existing frameworks, maintains testability, and opens up a range of possibilities for more succinct and easy-to-understand code. In this post I'll outline the underlying approach, but you can also find some (very simple) helper code here.
04 February, 2014 /

Learn more >

Shine Senior Consultant Ben Teese spoke last week at ng-conf, the world's first Angular.js conference. The two-day event was held in Salt Lake City and featured both the Angular core team and Angular experts from around the world. Being a single-track event, Ben had the attention...

22 January, 2014 /

Learn more >

Show more
Loading...