Angular2

Heart Rate Tracking with Angular2 & Fitbit

Heart Rate Tracking with Angular2 & Fitbit

The Goal I’ve always wanted a monitor of bio data… specifically data related to heart rate and GSR (Galvanic Skin Response) and if possible EEG data as well. I’d love to have some giant monitor set up with streaming data on a variety of subjects.  For now… baby steps. Tracking Data with Fitbit Fitbit is a nice little wearable monitoring system that helps people keep track o... »

Getting DESC order with Angular2 and Firebase

I never thought this would be an issue… But I found that this simple need to get data from a db in DESC order was not “out of the box” with Firebase. One comment on a Github question on this subject worked for me.  It’s one line of code and it simply works… way better than other more complex solutions. Basically, you take your Observable, such as the one below: this.p... »

Routing in Angular2

In frameworks like Rails we are required to set routes to each controller or view we want to display to the end user.  It’s a great security practice. What Are Routes? What routing allows us to do is to give a path (such as ‘/home’) and send it to a logical component (Controller in Rails speak.)  Let’s say we have a component called “Dashboard” but we don’... »

Angular2 – Dynamic Search Boxes

This particular recipe was taken from a course at Udemy: https://www.udemy.com/angular-firebase-application One of the most common examples given on Angular2 is to make a real time filtered list of notes or todo messages. There’s many tutorials on this, including some at Udemy. For my own benefit I’m documenting the process to help digest this. In my test application, I have a value of... »

Angular2 @Input Examples

In taking Vasco’s Udemy Course on Angular2 & Firebase, I worked through a tutorial project of pulling in data from a Firebase database.  The lessons were rendered to the view like so: <table class="table lessons-list card card-strong"> <tbody> <tr *ngFor="let lesson of lessons"> <td class="lesson-title">{{lesson?.description}}</td> <td class="duration">... »

Calling Length on Object Arrays in Angular2

I came across an oddity with Angular2 development.  I had a case where I was pulling data into my application.  The data came in as a list of objects.  I wanted to get a count on these objects returned and I wanted to display that count into a view. Normally in a language like Ruby, Groovy or Python you would use a variation of a method like length.  Sure enough, there was such a method available ... »

Angular2 Best Practices – Using Services

Angular2 is built around the concept of “components” which might be likened to something similar to Controllers in a MVC framework like Rails or Grails.  How they differ, is that the component is a tag that is put into a page that will be rendered by the browser/user.  The business logic that is in the component is then rendered via its single tag. 1)Large part of this content was lear... »

Setting Up Firebase with Angular 2 (ADVANCED)

In the previous tutorial, I mentioned how to setup Angular 2 with Firebase as your real-time database. That method is limited and you’re using a bit of Javascript to maintain the database connection.  There’s a better way using angularfirebase2 instead of the basic firebase module. You’ll need a Firebase account and project set up.  If you don’t have one, check out the prev... »

Setting Up Angular 2 with Firebase (EASY)

Firebase is a really awesome product from Google – it provides several points of functionality, including a real-time database.  This tutorial will walk through what you need to do to configure your Angular app to use Firebase. Setting Up Your Firebase Account First things first, go to firebase.google.com and create your firebase account. Create a Firebase DB Next, click the console link (ht... »

Typescript REPL

I came across this the other day, while I was reading “ng-Book 2” from fullstack.io.  They introduced a REPL module for Typescript.  It’s called tsun.  It works just like a REPL in Ruby or Python.  It provides an interactive shell, where you can test out code and see instant results to your commands.  This is a great way to test out ideas or code concepts. To install tsun, you mu... »