Introducing… ng-beacons!

How does angular fit in?

For me angular is not just a JavaScript framework — it’s about a community. I have a lot of friends from the angular community, and I’ve had the privilege of meeting a lot of brilliant developers going to and presenting at workshops and conferences about the technology.

So what can you do with it?

By default, the beacon is programmed to broadcast a Physical Web URL. We plan to make the beacon configurable, so you can connect to it using Web Bluetooth, and change the broadcast parameters — or perhaps you want to use it as a tracker beacon instead? Or maybe you want to read the temperature/humidity and set up an IFTTT to control how open or closed your futuristic windows are? Or maybe you want to do something as simple as change the broadcast interval/power to conserve battery?

Ok, great! Sign me up: where do I get one?

So far, I have only built a number of hand-assembled hardware prototypes (10 units so far):

I’ll say this: my soldering skills have improved immensely after this project!
ng-beacons ready for adventure!

DIY ng-beacon

The entire hardware and software for the beacon is open source. If you wish, you can build your own ng-beacon — though, you will need pretty good soldering skills, especially for the temperature sensor. I’ve made a Bill of Materials with everything you need to get in order to create your own ng-beacon, which also includes the AliExpress link to each of the components.

Reprogramming the Beacon

Reprogramming the beacon requires some external hardware — though this still shouldn’t be very expensive. There nRF51822 chip that powers the beacon uses the ARM architecture (the same CPU architecture that powers your phone / Raspberry Pi), and there is a standard way to debug and program ARM CPUs. It is called J-Link programmer, and I got mine here for under $10. If you have a Raspberry Pi, you can also use it as a programmer, these is a great tutorial for that by Adafruit.

Keep in mind the connections… you don’t want to fry your beacon!
  • Board: Generic nRF5182
  • Chip — 16kB RAM, 256 kB flash (xxaa)
  • Clock: RC Oscillator
  • Softdevice: S130
Arduino Settings for Programming the ng-beacon

Example 1 — Physical Web (Eddystone Beacon)

The following code will constantly broadcast a Physical Web URL using the Eddystone protocol (which we’ve explored more in-depth in another post):

#include <EddystoneBeacon.h>EddystoneBeacon beacon;void setup() {
beacon.begin(-12, "https://medium.com/@urish");
}
void loop() {
beacon.loop();
}

Example 2 —Simple iBeacon

The following code will broadcast an iBeacon:

#include <iBeacon.h>iBeacon beacon;#define UUID "56373971-a172-42a9-84d6-4c03ab2584e5"
#define MAJOR 10000
#define MINOR 1
#define POWER -50
void setup() {
beacon.begin(UUID, MAJOR, MINOR, POWER);
}
void loop() {
beacon.loop();
}

Now, for some fun!

I do love fun, and the ng-beacon has already given me some great initial use cases. For example, I programmed purple eye to scan for the beacon and dance when it is coming closer:

Beacons, angular, traveling… the good things in life.

Future Plans and a Call for help

As mentioned above, I — along with a few friends helping me get this project off the ground — plan to develop a demo showcasing some basic use cases for ng-beacon, but I’m also extremely interested in what you want to do with it!

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Uri Shaked

Uri Shaked

Google Developer Expert for Web Technologies, Maker and Public Speaker