Book Image

Practical Internet of Things with JavaScript

By : Arvind Ravulavaru
Book Image

Practical Internet of Things with JavaScript

By: Arvind Ravulavaru

Overview of this book

In this world of technology upgrades, IoT is currently leading with its promise to make the world a more smarter and efficient place. This book will show you how to build simple IoT solutions that will help you to understand how this technology works. We would not only explore the IoT solution stack, but we will also see how to do it with the world’s most misunderstood programming language - JavaScript. Using Raspberry Pi 3 and JavaScript (ES5/ES6) as the base to build all the projects, you will begin with learning about the fundamentals of IoT and then build a standard framework for developing all the applications covered in this book. You will then move on to build a weather station with temperature, humidity and moisture sensors and further integrate Alexa with it. Further, you will build a smart wearable for understanding the concept of fall detection. You will then extend it with the 'If This Then That' (IFTTT) rules engine to send an email on fall detection. Finally, you will be working with the Raspberry Pi 3 camera module and surveillance with a bit of facial detection using Amazon Rekognition platform. At the end of the book, you will not only be able to build standalone exciting IoT applications but also learn how you can extend your projects to another level.
Table of Contents (17 chapters)
Title Page
Credits
About the Author
About the Reviewer
www.PacktPub.com
Customer Feedback
Dedication
Preface

Setting up the mobile app


In the last section, we saw how to build and run the desktop app for the smart weather station. In this section, we are going to update the template of the mobile app to show the weather station data.

Open mobile-app/src/pages/view-device/view-device.html and update it, as shown here:

<ion-header>
    <ion-navbar>
        <ion-title>Mobile App</ion-title>
    </ion-navbar>
</ion-header>
<ion-content padding>
    <div *ngIf="!lastRecord">
        <h3 class="text-center">Loading!</h3>
    </div>
    <div *ngIf="lastRecord">
        <ion-list>
            <ion-item>
                <ion-label>Name</ion-label>
                <ion-label>{{device.name}}</ion-label>
            </ion-item>
            <ion-item>
                <ion-label>Temperature</ion-label>
                <ion-label>{{lastRecord.data.t}}</ion-label>
     ...