Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon
Full Stack Web Development with Raspberry Pi 3
Full Stack Web Development with Raspberry Pi 3

Full Stack Web Development with Raspberry Pi 3: Build complex web applications with a portable computer

eBook
NZ$14.99 NZ$45.99
Paperback
NZ$56.99
Subscription
Free Trial

What do you get with a Packt Subscription?

Free for first 7 days. $19.99 p/m after that. Cancel any time!
Product feature icon Unlimited ad-free access to the largest independent learning library in tech. Access this title and thousands more!
Product feature icon 50+ new titles added per month, including many first-to-market concepts and exclusive early access to books as they are being written.
Product feature icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Product feature icon Thousands of reference materials covering every tech concept you need to stay up to date.
Subscribe now
View plans & pricing
Table of content icon View table of contents Preview book icon Preview Book

Full Stack Web Development with Raspberry Pi 3

Getting Started on the Raspberry Pi

The Raspberry Pi has become hugely popular as a portable computer, and for good reason. When it comes to what you can do with this tiny piece of technology, the sky's the limit. Back in the day, computers used to be the size of entire neighborhood blocks, and only large corporations doing expensive research could afford them. After that, we went on to embrace personal computers, which were still a bit expensive, but, for the most part, could be bought by the common man. This brings us to where we are today, where we can buy a fully functioning Linux computer, which is as big as a credit card, for under $30. It is truly a huge leap in making computers available to anyone and everyone.

The marvel of the Raspberry Pi, however, doesn't end here. Its extreme portability means we can now do things that were not previously possible with traditional desktop computers. The GPIO pins give us easy access to interface with external devices. This allows the Pi to act as a bridge between embedded electronics and sensors and the power that Linux gives us. In essence, we can run any code in our favorite programming language (which can run on Linux) and interface it directly to outside hardware quickly and easily. Once we couple this with the wireless networking capabilities introduced in the Raspberry Pi 3, we gain the ability to make applications that would not have been feasible to make before this device existed.

Web development and portable computing have come a long way. A few years ago, we couldn't dream of making a rich, interactive, and performant application that runs on the browser. Today, not only can we do that, but we can also do it all in the palm of our hands (quite literally). When we think of developing an application that uses databases, application servers, sockets, and cloud APIs, the picture that normally comes to mind is that of many server racks sitting in a huge room. In this book, however, we are going to implement all of that using only the Raspberry Pi.

In this chapter, we will go through the concept of the Internet of Things and discuss how web development on the Raspberry Pi can help us get there. Following this, you will also learn how to set up your Raspberry Pi and access it from our computer.

We will cover the following topics:

  • The Internet of Things (IoT)
  • Our application
  • Setting up the Raspberry Pi
  • Remote access

The Internet of Things

The web has, until today, been a network of computers exchanging data. The limitation of this was that it was a closed loop. People could send and receive data from other people via their computers but rarely much else.

The IoT, in contrast, is a network of devices or sensors that connect the outside world to the internet. Superficially, nothing is different: the internet is still a network of computers. What has changed is that now, these computers are collecting and uploading data from things instead of people. This now allows anyone who is connected to obtain information that is not collected by a human.

The IoT as a concept has been around for a long time, but it is only now that almost anyone can connect a sensor or device to the cloud, and the IoT revolution was hugely enabled by the advent of portable computing, which was led by the Raspberry Pi.

A brief look at our application

Throughout this book, we are going to go through different components and aspects of web development and embedded systems. These are all going to be held together by our central goal of making an entire web application capable of sensing and displaying the surrounding temperature and humidity.

In order to make a properly functioning system, we have to first build the individual parts. More difficult still is making sure all the parts work well together. Keeping this in mind, let's take a look at the different components of our technology stack and the problems that each of them solves:

The sensor interface - perception

The sensor is what connects our otherwise isolated application to the outside world. The sensor will be connected to the GPIO pins of the Raspberry Pi. We can interface with the sensor through various different native libraries, which we will be looking into in the later chapters.

This is the starting point of our data. It is where all the data that is used by our application is created. If you think about it, every other component of our technology stack exists only to manage, manipulate, and display the data collected from the sensor.

The database - persistence

Data is the name we give to raw information, which is information that we cannot easily aggregate or understand. Without a way to store and meaningfully process and retrieve this data, it will always remain data and never information, which is what we actually want.

If we just hook up a sensor and display whatever data it reads, we are missing out on a lot of additional information. Let's take the example of temperature: what if we wanted to find out how the temperature was changing over time? What if we wanted to find the maximum and minimum temperatures for a particular day, or a particular week, or even within a custom duration of time? What if we wanted to see temperature variation across locations? There is no way we could do any of this with only the sensor. We also need some sort of persistence and structure to our data, and this is exactly what the database provides for us.

If we structure our data correctly, getting the answers to these questions is just a matter of a simple database query.

The user interface - presentation

The user interface is the layer that connects our application to the end user. One of the most challenging aspects of software development is making information meaningful and understandable to regular users of our application.

The UI layer serves exactly this purpose: it takes relevant information and shows it in such a way that it is easily understandable to humans. How do we achieve such a level of understandability with such a large amount of data? We use visual aids, such as colors, charts, and diagrams (just like how the diagrams in this book make the information easier to understand).

An important thing for any developer to understand is that your end user actually doesn't care about any of the backend stuff. The only thing that matters to them is a good experience. Of course, all the other components serve to make the users experience better, but it's really the user facing interface that leaves the first impression, and that's why it's so important to do it well.

The application server - middleware

This layer consists of the actual server-side code we are going to write in order to get the application running. It is also called middleware. In addition to being in the exact center of the architecture diagram, this layer also acts as the controller and middle-man for the other layers.

The HTML pages that form the UI are served through this layer. All the database queries that we were talking about earlier are made here. The code that runs in this layer is responsible for retrieving the sensor readings from our external pins and storing the data in our database. As you will see in later chapters, the middleware can also be further broken down into individual components, each with its own function.

Setting up our Raspberry Pi

So far, we've been reading a lot of theory. Now let's actually get our Raspberry Pi working. Before we get started, here is a list of things you need at the bare minimum to get your Pi up-and-running:

  • The Raspberry Pi (duh)
  • An SD card (8 GB or higher)
  • A micro USB power source (many phone chargers are of this type so you might have one already)
  • A keyboard and mouse
  • Any screen or display with an HDMI port and cable
  • A laptop (optional)

Have everything? Awesome! Let's move on...

There are lots of operating systems and lots of ways to install them on the Pi. However, the easiest way by far is to use the official NOOBS installer. NOOBS, which stands for New Out Of Box Software, is the officially recommended way to install a fresh OS on the Pi for newcomers, and it's terribly easy.

Download the NOOBS archive from official website (https://www.raspberrypi.org/downloads/noobs/). Once the archive is downloaded, unzip it into a new folder anywhere on your computer.

If you are using NOOBS v2.3.0, the directory structure, once you unzip the archive, should look like this:

BUILD-DATA
INSTRUCTIONS-README.txt
RECOVERY_FILES_DO_NOT_EDIT
bcm2708-rpi-0-w.dtb
bcm2708-rpi-b-plus.dtb
bcm2708-rpi-b.dtb
bcm2708-rpi-cm.dtb
bcm2709-rpi-2-b.dtb
bcm2710-rpi-3-b.dtb
bcm2710-rpi-cm3.dtb
bootcode.bin
defaults
os
overlays
recovery.cmdline
recovery.elf
recovery.img
recovery.rfs
recovery7.img
riscos-boot.bin

Most of these files have no meaning to us except the INSTRUCTIONS-README.txt file. Open this file in any text editor (such as Notepad), and you will find instructions on how to format your SD card.

After formatting your SD card, transfer all these files and folders to the root directory of the SD card. As described in the instructions, all files and folders should be copied in such a way that the INSTRUCTIONS-README.txt file is at the root.

Once your SD card is ready and loaded, connect everything to your Pi:

  1. Insert the SD card into the slot.
  2. Using the HDMI cable, connect the HDMI port of the Pi with the external display.
  3. Connect the keyboard and mouse to the USB ports of the Pi
  4. Connect the power cable to the Micro USB port of the Pi

Once all the connections are made, switch on the power supply to your Pi. You should now see the monitor light up. After a few boot screens, you should see a friendly little GUI that will lead you to this:

It's here that you can select the OS you want in order to install to your Pi. For this book, we will be working with Raspbian.

Raspbian is a port of the Debian Linux OS, that has been optimized for the Pi. It is currently the most popular OS that runs on the Pi. Follow the installation wizard, and you should be done with the installation in a few minutes.

Once your installation is done, your Pi will boot into the OS, and you should now see a complete desktop on your monitor screen, something that looks like this:


Congratulations! You have successfully set up your Raspberry Pi computer. Amazingly, there are a lot of things you can do like you're using a regular desktop computer. The Raspberry Pi, along with the Raspbian OS, comes with a variety of programs, such as a text editor, a file explorer, and even an HTML5 web browser!

Remote access

The setup we have here is perfectly sufficient for moving on with the rest of the chapters. You now have a fully functioning Raspberry Pi running and now have the capability to run a fully functioning web application on it.

Yet, for those who prefer programming on their laptop (and most people do), it would make sense to be able to remotely access and program on the Raspberry Pi using our computer of choice.

Fortunately for us, it's really easy to do this. Sometimes, I even prefer remotely programming my Pi from my laptop because it's much easier and more convenient to do that.

To access our Pi, we are going to use SSH (secure shell) to access its shell from any computer on the network:

  1. First things first, make sure your Pi is connected to the same network as your computer. If you are using a wired router, connect the Pi through it using a LAN cable:
A better option, though, is to connect the Pi wirelessly through WLAN.

If you already have a wireless network running, connect your Pi to the network by clicking on the wireless network icon on the desktop:

Select your wireless network and connect to it.

  1. The next step is to find the private IP address of your Pi. Open the Terminal application by clicking on the icon, as shown in the following screenshot:

Execute the ifconfig command in the Terminal window. The ifconfig command, if executed with no other arguments, will display the status of all network interfaces on the device. You should get an output that looks like this:

Your private IP address can be found by looking at the inet addr field (as highlighted in the preceding figure). Depending on the interface you are connected to, this address can appear either under wlan0 (if you are connected using Wi-Fi) or eth0 (if you connect with a LAN cable). My IP address, in this case, is 192.168.0.10.

  1. We need to now enable the SSH server on our Pi. This is the service that allows us to access our Pi's command line remotely. To do this, open the system configuration by running the following command:
     sudo raspi-config

You should see a GUI-like configuration screen, as follows:

Go to the Interfacing Options section, and then go to P2 SSH.

You will then need to give a confirmation to start the SSH server.

  1. All that's left is to finally connect to the Raspberry Pi using our laptops or desktops.

If you are working on a Windows machine, you will need to download and install PuTTY (http://www.putty.org/), which is a free SSH client for Windows. Enter the IP address of the Raspberry Pi, which we obtained in the previous step, with the port as 22 (the default SSH port).

If you are using a Unix system (Mac or Linux), you can ssh into the Pi by entering the following command:
ssh pi@192.168.0.10

Remember to replace 192.168.0.10 with your own Pi's IP address.

In both cases, you will be asked for a password. The default username for the Raspbian OS after installation is pi, with the default password being raspberry. If you are able to establish an SSH session with the Pi, you should see its Command Prompt:

You can now remotely access your Raspberry Pi device from any computer on the network. Awesome!

What's even more awesome is that there is no need to connect any peripheral device to the Pi anymore. That means no mouse, no keyboard, and no monitor required! All you need is the power supply, and with SSH, you're good to go!

As I stated earlier, you need not go through the hassle of remotely accessing the Pi from your own computer. The Pi is a perfectly good standalone computer on its own. Many of your favorite text editors can also be run on the Pi, which means that you can write and execute code on the same Raspberry Pi device.

Summary

We are just warming up! In this chapter, we got a brief introduction to the concept of the Internet of Things. We then went on to look at an overview of what we were going to build throughout the rest of this book and saw how the Raspberry Pi can help us get there.
The next section showed us how to get up and running with our Pi by installing and running the Raspbian OS.

Finally, you learned how to make life easier by being able to access the Pi remotely through our desktop or laptop.

This chapter essentially forms the base for us moving forward. It is important to make sure that you get the installation right, as we are going to rely solely on the Raspberry Pi's environment for the execution of our code. Our laptop is simply going to assist us in writing the code.

In the next chapter, we will dive deep into the web development stack and look at how each layer plays its role and how we can build them it forward.

Left arrow icon Right arrow icon
Download code icon Download Code

Key benefits

  • ?Leverage JavaScript, HTML5, and Cloud APIs to create visual representations and interactive web pages.
  • ?Learn to install and use a Node.js-based web framework to develop Raspberry Pi 3-powered web applications.
  • ?A step-by-step guide that will cover from setting up a embedded system to developing embedded, device-powered interactive web applications.

Description

Modern web technology and portable computing together have enabled huge advances in the Internet of Things (IoT) space,as well as in areas such as machine learning and big data. The Raspberry Pi is a very popular portable computer for running full stack web applications. This book will empower you to master this rapidly evolving technology to develop complex web applications and interfaces. This book starts by familiarizing you with the various components that make up the web development stack and that will integrate into your Raspberry Pi-powered web applications. It also introduces the Raspberry Pi computer and teach you how to get up and running with a brand new one. Next, this book introduces you to the different kinds of sensor you’ll use to make your applications; using these skills, you will be able to create full stack web applications and make them available to users via a web interface. Later, this book will also teach you how to build interactive web applications using JavaScript and HTML5 for the visual representation of sensor data. Finally, this book will teach you how to use a SQLite database to store and retrieve sensor data from multiple Raspberry Pi computers. By the end of this book you will be able to create complex full stack web applications on the Raspberry Pi 3 and will have improved your application’s performance and usability.

Who is this book for?

This book is aimed at hobbyist, enthusiasts, and developers eager to develop embedded device-powered web applications. Prior programming experience with JavaScript, HTML5, and Node.JS will be beneficial.

What you will learn

  • • Get up and running with your Raspberry Pi
  • • Go full stack! Learn about the end-to-end development process for web applications, right from the OS up to the actual HTML web interface
  • • Discover that JavaScript is one of the fastest growing languages today, and is the only language that can be used both on a browser and server. This book will empower you to develop in a complete JavaScript stack
  • • See that the IoT is everywhere!Connect your application to the
  • outside world. Make use of sensors in your Raspberry Pi to give your
  • application an edge, and unleash the full power of the Internet of Things
  • • Build a rich UI with beautiful charts and data visualizations that can run
  • on any browser
  • • Make your software data-driven. Learn how to utilize SQLite to collect
  • and analyze data from multiple systems

Product Details

Country selected
Publication date, Length, Edition, Language, ISBN-13
Publication date : Aug 03, 2017
Length: 214 pages
Edition : 1st
Language : English
ISBN-13 : 9781788295895
Vendor :
Raspberry Pi
Languages :

What do you get with a Packt Subscription?

Free for first 7 days. $19.99 p/m after that. Cancel any time!
Product feature icon Unlimited ad-free access to the largest independent learning library in tech. Access this title and thousands more!
Product feature icon 50+ new titles added per month, including many first-to-market concepts and exclusive early access to books as they are being written.
Product feature icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Product feature icon Thousands of reference materials covering every tech concept you need to stay up to date.
Subscribe now
View plans & pricing

Product Details

Publication date : Aug 03, 2017
Length: 214 pages
Edition : 1st
Language : English
ISBN-13 : 9781788295895
Vendor :
Raspberry Pi
Languages :

Packt Subscriptions

See our plans and pricing
Modal Close icon
$19.99 billed monthly
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Simple pricing, no contract
$199.99 billed annually
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just NZ$7 each
Feature tick icon Exclusive print discounts
$279.99 billed in 18 months
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just NZ$7 each
Feature tick icon Exclusive print discounts

Frequently bought together


Stars icon
Total NZ$ 170.97
Raspberry Pi 3 Home Automation Projects
NZ$56.99
Full Stack Web Development with Raspberry Pi 3
NZ$56.99
Raspberry Pi Zero W Wireless Projects
NZ$56.99
Total NZ$ 170.97 Stars icon
Banner background image

Table of Contents

12 Chapters
Getting Started on the Raspberry Pi Chevron down icon Chevron up icon
Getting Up-and-Running with Web Development on the Raspberry Pi Chevron down icon Chevron up icon
Running a Node Server on the Pi Chevron down icon Chevron up icon
Extracting Information from the GPIO Pins Chevron down icon Chevron up icon
Retrieving Sensor Readings from the Server Chevron down icon Chevron up icon
Creating a Web Page to Display Sensor Data Chevron down icon Chevron up icon
Enhancing Our UI - Using Interactive Charts Chevron down icon Chevron up icon
SQLite - The Fast and Portable Database Chevron down icon Chevron up icon
Integrating SQLite into Our Application Chevron down icon Chevron up icon
Making our Application Real Time with Web Sockets Chevron down icon Chevron up icon
Deploying our application to Firebase Chevron down icon Chevron up icon
Using Firebase APIs to Update Our Application Chevron down icon Chevron up icon

Customer reviews

Rating distribution
Full star icon Full star icon Full star icon Full star icon Empty star icon 4
(4 Ratings)
5 star 75%
4 star 0%
3 star 0%
2 star 0%
1 star 25%
Wayfarer Jul 12, 2018
Full star icon Full star icon Full star icon Full star icon Full star icon 5
Lots of modern, valuable web development basics covered in an easy-to-read, thorough format.This guide delves into NodeJs, ExpressJS, Javascript, GIT repositories, GPIO input/output, SQLite, web sockets, and Firebase cloud. If you want to expand your web development and pick up some new skills in the process, grab a $35 RPI3b+ and a DHT11 temperature/humidity sensor and give this book a go.
Amazon Verified review Amazon
Dhirendra Kumar Kashyap Apr 30, 2018
Full star icon Full star icon Full star icon Full star icon Full star icon 5
An awesome book, Well organized content with a good explanation.
Amazon Verified review Amazon
A.C. Kempson Aug 29, 2019
Full star icon Full star icon Full star icon Full star icon Full star icon 5
Although I've had this book for a while now, I only recently decided to dust off my Raspberry Pi and get stuck into reading it. This book brings together the power of the Raspberry Pi and Google's very own cloud, specifically Firebase, with all of its powerful services. This is THE book I was looking for on these subjects, and at the time I couldn't find any other books that covered the topics that are covered in this book. Although the internet is full of tutorials and blog posts, no where else will you find a complete, start-to-finish, full stack example of logging sensor data to Firebase. There are plenty of books out there but they mainly cover IoT in a general sense. I found this book easy to read. Don't be fooled by the 200 page length of it. The descriptions are short and to the point, with the emphasis being on the all-important JavaScript code examples.
Amazon Verified review Amazon
john Babrick Apr 23, 2019
Full star icon Empty star icon Empty star icon Empty star icon Empty star icon 1
Less than 200 pages. Worthless. Useless. Trivial. Waste of time. Not what I had hoped for. A good reason to avoid further purchases from Packt.
Amazon Verified review Amazon
Get free access to Packt library with over 7500+ books and video courses for 7 days!
Start Free Trial

FAQs

What is included in a Packt subscription? Chevron down icon Chevron up icon

A subscription provides you with full access to view all Packt and licnesed content online, this includes exclusive access to Early Access titles. Depending on the tier chosen you can also earn credits and discounts to use for owning content

How can I cancel my subscription? Chevron down icon Chevron up icon

To cancel your subscription with us simply go to the account page - found in the top right of the page or at https://subscription.packtpub.com/my-account/subscription - From here you will see the ‘cancel subscription’ button in the grey box with your subscription information in.

What are credits? Chevron down icon Chevron up icon

Credits can be earned from reading 40 section of any title within the payment cycle - a month starting from the day of subscription payment. You also earn a Credit every month if you subscribe to our annual or 18 month plans. Credits can be used to buy books DRM free, the same way that you would pay for a book. Your credits can be found in the subscription homepage - subscription.packtpub.com - clicking on ‘the my’ library dropdown and selecting ‘credits’.

What happens if an Early Access Course is cancelled? Chevron down icon Chevron up icon

Projects are rarely cancelled, but sometimes it's unavoidable. If an Early Access course is cancelled or excessively delayed, you can exchange your purchase for another course. For further details, please contact us here.

Where can I send feedback about an Early Access title? Chevron down icon Chevron up icon

If you have any feedback about the product you're reading, or Early Access in general, then please fill out a contact form here and we'll make sure the feedback gets to the right team. 

Can I download the code files for Early Access titles? Chevron down icon Chevron up icon

We try to ensure that all books in Early Access have code available to use, download, and fork on GitHub. This helps us be more agile in the development of the book, and helps keep the often changing code base of new versions and new technologies as up to date as possible. Unfortunately, however, there will be rare cases when it is not possible for us to have downloadable code samples available until publication.

When we publish the book, the code files will also be available to download from the Packt website.

How accurate is the publication date? Chevron down icon Chevron up icon

The publication date is as accurate as we can be at any point in the project. Unfortunately, delays can happen. Often those delays are out of our control, such as changes to the technology code base or delays in the tech release. We do our best to give you an accurate estimate of the publication date at any given time, and as more chapters are delivered, the more accurate the delivery date will become.

How will I know when new chapters are ready? Chevron down icon Chevron up icon

We'll let you know every time there has been an update to a course that you've bought in Early Access. You'll get an email to let you know there has been a new chapter, or a change to a previous chapter. The new chapters are automatically added to your account, so you can also check back there any time you're ready and download or read them online.

I am a Packt subscriber, do I get Early Access? Chevron down icon Chevron up icon

Yes, all Early Access content is fully available through your subscription. You will need to have a paid for or active trial subscription in order to access all titles.

How is Early Access delivered? Chevron down icon Chevron up icon

Early Access is currently only available as a PDF or through our online reader. As we make changes or add new chapters, the files in your Packt account will be updated so you can download them again or view them online immediately.

How do I buy Early Access content? Chevron down icon Chevron up icon

Early Access is a way of us getting our content to you quicker, but the method of buying the Early Access course is still the same. Just find the course you want to buy, go through the check-out steps, and you’ll get a confirmation email from us with information and a link to the relevant Early Access courses.

What is Early Access? Chevron down icon Chevron up icon

Keeping up to date with the latest technology is difficult; new versions, new frameworks, new techniques. This feature gives you a head-start to our content, as it's being created. With Early Access you'll receive each chapter as it's written, and get regular updates throughout the product's development, as well as the final course as soon as it's ready.We created Early Access as a means of giving you the information you need, as soon as it's available. As we go through the process of developing a course, 99% of it can be ready but we can't publish until that last 1% falls in to place. Early Access helps to unlock the potential of our content early, to help you start your learning when you need it most. You not only get access to every chapter as it's delivered, edited, and updated, but you'll also get the finalized, DRM-free product to download in any format you want when it's published. As a member of Packt, you'll also be eligible for our exclusive offers, including a free course every day, and discounts on new and popular titles.