Choosing Firebase as the eco-system to build your serverless application upon will provide you with most of the back-end tasks done and ready to use.
However, there will be times you’ll need to tailor some server-side functionalities to your specific design needs, and, that’s where Cloud Functions come into play.
A task I found to be recurring is a set of administration functions for managing users with elevated privileges. This will result in being crucial, for instance, to implement role-based access control according to Firebase best practices.
This article describes how to implement an API using Cloud Functions to effectively…
If you spent enough time programming with Angular I bet there have been times you wished having a service of yours injected asynchronously.
So, what to do when you need to wait for an asynchronous event before having your service ready for injection?
Well, it goes without saying you can either:
Developing a single page application is fun, most of the time. Crafting the perfect piece of code to get the browser do what you want, instead of what has been designed for, gives you the thrill. At times, it will feel like being on a mission to rectify a browser’s misfortune such as in this article’s case.
Immagine your application store files that you allow the users to download at times. …
If you see a waving hand 👋🏻 it means you’re reading this article from a platform supporting emoji natively.
Good for you!
If not, you’re likely seeing a couple of little squares since the underlying text rendering engine doesn’t know how to process the Unicode codepoints describing the waving hand emoji.
With Microsoft Windows 10 joining the club and finally providing native support for emoji with the update on May 2019, we are one step closer to fill the “emoji divide” with macOS/iOS and Android.
However, there’s plenty of browsers around the world running on unfortunate operative systems still deprived…
If you are familiar with the latest Smart Payment Buttons for PayPal Checkout you surely realize integrating this technology with Angular requires some degree of creativity:
The piece of code above comes from the official PayPal developer’s documentation illustrating how to set up an order, capture the transaction while approved and follow it up server-side where supposedly you’ll be validating the transaction details.
The thing is the buttons are designed to set up and manage the payment flow using asynchronous callback functions some of which require you to interleave your own async calls to your server…
Angular is a brilliantly designed framework and we’re (usually) glad of structuring our web application by its rules.
Every Angular’s application is like a tree, so, that the parent template contains the children components and every child displays its content within its view only. And that’s usually fine.
However, what if we could enable children components to break through the limits of their own views, so, for them to display some of their widgets on a parent toolbar or pieces of information on a global status bar without data binding restrictions of any sort?
That’s what I call “teleporting” content.
I recently wanted to include Google site tagging capabilities to a simple single-page application of mine and that’s what I came up with:
In the example above we see the GtagDirective at work (look closely in the .html).
gtag="home" statement in the .html sends a
page-view event to the Google Analytics, Google Ads or Google Marketing Platform account you configured during the initialization (more next).
The “home” text will appear in the report to be the page title while the page location is automatically detected by the directive provided the application makes use of a Router.
There are several IP-related information services out there offering to accurately locate users based on their IP, so, after a bit of digging, I decided to test both https://iplist.cc, providing country-level geolocation only but is totally free for both personal and commercial use, and https://ipinfo.io, a more professional service providing city-level geolocation with a generous 50.000 requests/month in their freemium tier.
Performing the API calls is just one single line of code making it pretty easy by itself already, so I wondered… How can I make it even more easy to use in Angular?
Coming from a history of C++…
Imagine your app has a ‘Contact Us’ link and instead of routing to a dedicated page you’d like a contact form to popup instead.
There would be nothing wrong in hardcoding the ‘Contact Us’ button to do something different than navigating when clicked but wouldn’t it be nice having a way to instruct the router to do that ‘something different’ for us?
The greatest advantage in this would be having a unique way of treating all the links on a toolbar or menu, no matter if they’re expected to really trigger the navigation or do whatever else we need them…
I’ve to confess I had some hard time pulling this out. I can tell Stripe.js v3 isn’t designed to get along with Angular (as opposed to v2 that integrated like a charm). Nevertheless, after several days of struggles, I’m quite satisfied with the result and I believe it’s worth an article :)
What you’re going to read about here is:
I believe that whatever problem we’re puzzling ourselves with, once we really get to the bottom of it the solution has to be simple