Learning Node.js for Mobile Application Development

4.5 (6 reviews total)
By Stefan Buttigieg , Milorad Jevdjenic
    Advance your knowledge in tech with a Packt subscription

  • Instant online access to over 7,500+ books and videos
  • Constantly updated with 100+ new titles each month
  • Breadth and depth in over 1,000+ technologies
  1. Setting Up Your Workspace

About this book

Node.js is a massively popular JavaScript library that lets you use JavaScript to easily program scalable network applications and web services. People approaching Node.js for the first time are often attracted by its efficiency, scalability, and the fact that it's based on JavaScript, the language of the Web, which means that developers can use the same language to write backend code. Also, it’s increasingly being seen as a "modern" replacement for PHP in web development, which relies on fast-paced data exchange. The growing community and the large amount of available modules makes Node.js one of the most attractive development environments.

This book takes a step-wise and incremental approach toward developing cross-platform mobile technologies using existing web technologies. This will allow you to truly understand and become proficient in developing cross-platform mobile applications with Node.js, Ionic Framework, and MongoDB.

The book starts off by introducing all the necessary requirements and knowledge to build a mobile application with a companion web service. It covers the ability to create an API from scratch and implement a comprehensive user database that will give you the opportunity to offer a mobile application with a personalized experience.

Midway through the book, you will learn the basic processes to create a successful mobile application. You will also gain higher-level knowledge, allowing you to develop a functional and secure mobile application to ensure a seamless user experience for end users.

Finally, the book ends with more advanced projects, which will bring together all the knowledge and expertise developed in the previous chapters to create a practical and functional mobile-application that has useful real-world features.

Publication date:
October 2015
Publisher
Packt
Pages
248
ISBN
9781785280498

 

Chapter 1. Setting Up Your Workspace

The overarching goal of this book is to give you the tools and know-how needed to efficiently construct modern, cross-platform solutions for your users. In this chapter, we will focus on the tools themselves, showing you how to bootstrap your development environment to tackle the challenges that we have in store for you in the remainder of the book. We will also give you a brief introduction to each tool in order to give you an idea about why they fit into your toolchain. If any such detail seems unclear at this point, do not worry. We will delve into everything you need to know about each tool in the relevant parts of the book.

After reading this chapter, you will know how to install, configure, and use the fundamental software components that we will use throughout this book. You will also have a good understanding of why these tools are appropriate for the development of modern apps.

 

The Node.js backend


Modern apps have several requirements, which cannot be provided by the app itself, such as central data storage, communication routing, and user management. In order to provide such services, apps rely on an external software component known as the backend. The backend will be executed on one or more remote servers, listen to network requests from the devices that run the app, and provide them with the services that requests require.

The backend that we will use in this book is Node.js, a powerful but strange beast in its category. Node.js, at the time of writing this book, is the only major backend that is written almost entirely in JavaScript, which in reality is a frontend scripting language. The creators of Node.js wanted a backend that could be integrated with the apps written in JavaScript as seamlessly as possible, and you cannot get much closer to that than Node.js. Beyond this, Node.js is known for being both reliable and high-performing.

In terms of architecture, Node.js is highly modularized and designed from the ground up to be extendable through plugins or packages. Node.js comes with its own package management system, Node Package Manager (NPM), through which you can easily install, remove, and manage packages for your project. You will see how to use NPM in order to install other necessary components later in this chapter.

 

Installing Node.js on different systems


Node.js is delivered as a set of JavaScript libraries, executing on a C/C++ runtime built around the Google V8 JavaScript Engine. The two come bundled together for most major operating systems (OS), and we will look at the specifics of installing it in the following sections.

Note

Google V8 JavaScript Engine is the same JavaScript engine that is used in the Chrome browser, which is built for speed and efficiency.

Windows

For Windows, there is a dedicated MSI wizard to install Node.js, which can be downloaded from the project's official website. To do so, go to the main page, navigate to Downloads, and then select Windows Installer. After it has downloaded, run the MSI wizard, follow the steps to select the installation options, and conclude the install. Keep in mind that you will need to restart your system in order to make the changes effective.

Linux

Most major Linux distributions provide convenient installs of Node.js through their own package management systems. However, it is important to keep in mind that for many of them, Node Package Manager (NPM) will not come bundled with the main Node.js package. Rather, it is provided as a separate package. We will show how to install both in the following section.

Ubuntu/Debian

Open a terminal and issue sudo apt-get update to make sure that you have the latest package listings. After this, issue apt-get install nodejsnpm in order to install both Node.js and NPM in one swoop.

Fedora/RHEL/CentOS

On Fedora 18 or later, open a terminal and issue sudo yum install nodejsnpm. The system will do the full setup for you.

If you are running RHEL or CentOS, you need to enable the optional EPEL repository. This can be done in conjunction with the install process, so that you do not need to do it again while upgrading the repository, by issuing the sudo yum install nodejsnpm --enablerepo=epel command.

Verifying your installation

Now that we have finished the install, let's do a sanity check and make sure that everything works as expected. To do so, we can use the Node.js shell, which is an interactive runtime environment for the execution of JavaScript code. To open it, first open a terminal, and then issue the following to it:

node

This will start the interpreter, which will appear as a shell, with the input line starting with the > sign. Once you are in it, type the following:

console.log("Hello world!);

Then press Enter. The Hello world! phrase should appear on the next line. Congratulations, your system is now set up for the running of Node.js!

Mac OS X

For OS X, you can find a ready-to-install PKG file by going to www.nodejs.org, navigating to Downloads, and selecting the Mac OS X Installer option. Otherwise, you can click on Install, and your package file will automatically be downloaded:

Once you have downloaded the file, run it and follow the instructions on the screen. It is recommended that you keep all the default settings offered unless there are compelling reasons for you to change something with regard to your specific machine.

Verifying your installation

After the install finishes, open a terminal and start the Node.js shell by issuing the following command:

node

This will start the interactive node shell, where you can execute JavaScript code. To make sure that everything works, try issuing the following command to the interpreter:

console.log("hello world!");

After pressing the Enter key, the hello world! phrase will appear on your screen. Congratulations, Node.js is all set up and good to go!

 

Setting up the Ionic framework and Cordova for Mac OS X


After installing Node.js on your Mac, proceed to open your command-line application and input the following command:

$ sudonpm install -g ionic

After inputting this command, you will be prompted to input your password as shown in the following screenshot:

If you have already set up the permissions for npm on OS X, you can install Ionic with the following command:

$ npm install -g ionic

The preceding command line should result in the following output:

Installing Cordova on OS X is very similar to installing Ionic. You can run the following command to install Cordova:

$ sudonpm install -g cordova
 

Setting up the Ionic framework and Cordova for Windows


Once you have installed Node.js, install Ionic on your Windows machine. The rest should be straightforward.

Open the command prompt and check whether you have npm installed by running the following command:

npm

Once you have ensured that you have successfully installed npm, you can go ahead and run the following command:

npm install -g ionic

This step should result in an output, which shows that you have successfully installed Ionic.

In order to install Cordova, you can also use npm and run the following command:

npm install -g cordova

Once you receive a successful output, you can go ahead and start setting up the platform dependencies.

Note

An experimental setup for Windows:

In Windows, you will have the opportunity to set up a Vagrant package, which is a one-stop-shop for the installation of Ionic on your Windows machine. This is accessible at https://github.com/driftyco/ionic- box.

Setting up the platform dependencies

To set up the platform dependencies, you need to install Java, which is explained in the following section.

Installing Java

If you do not have Java installed or if your version is below 6.0, install the Java JDK by heading over to http://j.mp/javadevkit-download, a customized and shortened link, and choosing the version that applies to you.

The main recommendation for these projects is that you install a version of JDK 6.0 or higher.

Select the JDK for your OS. On an Intel-based Mac, you can use the following useful table to check whether your Mac is a 32- or 64-bit OS.

You can check for Processor Name by clicking on the Apple logo in the top-left corner of your screen, followed by About my Mac:

Processor Name

32- or 64-bit

Intel Core Solo

32 bit

Intel Core Duo

32 bit

Intel Core 2 Duo

64 bit

Intel Quad-Core Xeon

64 bit

Dual-Core Intel Xeon

64 bit

Quad-Core Intel Xeon

64 bit

Core i3

64 bit

Core i5

64 bit

Core i7

64 bit

In the case of Windows, if you have a machine that was purchased in the last few years, you should go for the x64 (64-bit) version.

 

Setting up Android Studio for Android, Mac, and Windows


To set up Android Studio for Android, Mac, and Windows, follow these steps:

  1. Go to the Android Developers site by visiting http://developer.android.com.

  2. Click on Android Studio, where you will be directed to the landing page. Your operating system's version will be detected automatically:

  3. Accept the terms and conditions of the Software Use Agreement and click on Download:

  4. For Mac, double-click on the downloaded file, follow the prompts, and then drag the Android Studio icon into your Applications folder:

  5. For Windows, open the downloaded file, and then go through the Android Studio Setup Wizard to complete the install.

 

Setting up the Android Software Development Kit


The process of setting up the Android Software Development Kit (SDK) has improved vastly with the introduction of Android Studio, as a number of software packages come pre-installed with the Android Studio install package. As a part of the preparation for getting started with our Android projects, it will be very helpful to understand how one can install (or even uninstall) SDKs within Android Studio.

There are a number of ways of accessing the SDK Manager. This can be done from the main toolbar of Android Studio:

Otherwise, it can be accessed from the Start menu by navigating to ConfigureSDK Manager:

This is what the SDK Manager looks like. If you need to install a package, you need to check the mark of that particular package, click on Install packages, and then finally accept the licenses:

 

Setting up your physical Android device for development


The following are the three main steps that need to be taken in order to enable your Android Device for development:

  1. Enable Developer options on your specific Android device

  2. Enable USB debugging

  3. Provide your computer with the necessary trust credentials with the installed IDE via secure USB debugging. (devices with Android 4.4.2)

Enabling Developer options

Depending on your device, this might vary slightly, but as from Android 4.2 and higher, the Developer options screen is hidden by default.

To enable it, navigate to Settings | About phone and click on the Build number seven times. You will find Developer options enabled when you return to the previous screen.

Enabling USB debugging

USB debugging enables the IDE to communicate with the device via the USB port. This can be activated after enabling Developer options and is done by checking the USB debugging using the following this path:

SettingsDeveloper OptionsDebuggingUSB debugging

Trusting a computer with installed IDE using secure USB debugging (devices with Android 4.4.2)

You have to accept the RSA key on your phone or tablet before anything can flow between the device via the Android Debug Bridge (ADB). This is done by connecting the device to the computer via USB, which triggers a notification entitled Enable USB Debugging?

Check off Always allow from this Computer and click on OK.

 

Setting up the Environment Variables on Windows 7 and higher


Using Ionic and Cordova to build an Android app might require a modification to the PATH environment on Windows. This can be done with the following steps:

  1. Right-click on My Computer and then click on Properties.

  2. Click on Advanced System Settings in the column to the left.

  3. In the resulting dialog box, select Environment Variables.

  4. Select the PATH variable and click on Edit.

  5. Append the following to the PATH based on where you installed the SDK:

    ;C:\Development\adt-bundle\sdk\platform-tools;C:\Deve
    lopment\adt-bundle\sdk\tools
    
 

Setting up the Environment Variables for iOS on Mac OS X


Developing for iOS requires you to develop from a machine that runs on Mac OS X. At this point in time, it's not possible to develop iOS applications from Windows. In the following steps, we will outline how to get started with developing Ionic apps for iOS.

Installing the iOS SDK

The following are two ways that can be used to download Xcode:

  • From the App Store, search for Xcode in the App Store application

  • It is available at Apple Developer Downloads, which requires you to register as an Apple Developer.

Command-line tools are integrated within Xcode. Previously, this was installed separately. Once you've downloaded and installed Xcode, you are prepared to handle iOS projects from a machine that has Mac OS X enabled.

 

MongoDB


In order to store data related to your app and users, your server will need a database—a piece of software that is dedicated solely to data storage and retrieval.

Databases come in many variants. In this book, our focus is NoSQL databases, which are so named because they don't use the traditional table-oriented SQL data access architecture that is used by the more well-known relational databases, such as Oracle, MySQL, and PostgreSQL. NoSQL databases are very novel in their design and features and excellent for the tackling of the challenges that one may face in modern app development.

The NoSQL database that we will use throughout this book is MongoDB (it is often abbreviated as MDB or simply Mongo). MongoDB is a document-oriented database that which stores data in documents, which are data structures that are almost identical to the standard JSON format.

Let's have a look at how to install and get MongoDB running. If you have used a more traditional DB system, you may be surprised at how easy it is.

Installation of MongoDB on different Operating System

MongoDB comes in the form of a package for most major OS and versions.

Windows

MongoDB ships with a complete MSI for installation on Windows systems. To download it, go to the project's official website, www.mongodb.org, navigate to Downloads, and select the Windows tab. You will be offered the following three choices to download:

  • Windows 64-bit R2+: Use this if you are running Windows Server 2008, Windows 7 64-bit, or a newer version of Windows

  • Windows 32-bit: Use this if you have a 32-bit Windows installation that is newer than Windows Vista

  • Windows 64-bit legacy: Use this if you are using Windows Vista 64-bit, Windows Server 2003, or Windows Server 2008.

Note

MongoDB does not run on Windows XP at all.

After you have downloaded the MSI, run it with administrator privileges in order to perform the installation. The installation wizard will give you a default location where MongoDB will be installed—C:/mongodb/. You can change this if you desire, but it is recommended that you keep it as we will assume that this is the location where MongoDB resides for the remainder of the book.

After the installation has finished, the next step is to configure a data directory where MongoDB can store the data that we will feed it with. The default location for this directory is /data/db. We will need to make sure that this directory exists and is writeable before we start our MongoDB instance for the first time. So, fire up the command prompt with administrator privileges and issue the md/data/dbcommand. After doing so, we are good to start the database server itself. To do so, stay in the command prompt and issue the following command:

C:/mongodb/bin/mongodb.exe

You should receive a confirmation that MongoDB is now running and listening for connections. All is set!

Linux

On Linux, you will find MongoDB ready-packaged on most major distributions. However, we strongly recommend that you use the project's own repositories in order to make sure that you always have access to the most current security and stability updates.

Ubuntu

First off, you will need to enable the official MongoDB repository. To do so, open a terminal and first import the project's public GNU Privacy Guard (GPG) key as follows:

sudo apt-key adv --keyserverhkp://keyserver.ubuntu.com:80 --recv7F0CEB10

Once this is done, create a listing for the repository itself by issuing the following command:

echo 'deb http://downloads-distro.mongodb.org/repo/ubuntu-upstart dist10gen' | sudo tee /etc/apt/sources.list.d/mongodb.list

Your repository listing is now active. Let's make Advanced Package Tool (APT) aware of it in order to install MongoDB, as follows:

sudo apt-get update

Finally, issue the following command to install MongoDB:

sudo apt-get install mongodb-org

Fedora/RHEL/CentOS

Our first order of business here is to enable the official MongoDB repository. To do so, first make sure that you have the nano text editor installed by opening a terminal and issuing the following command:

sudo yum install nano

After this is done, add the repository by issuing the following command:

sudonano /etc/yum.repos.d/mongodb.repo

Nano will open a new, blank text file. Copy and paste the following into the file:

[mongodb]
name=MongoDB Repository
baseurl=http://downloads-distro.mongodb.org/repo/redhat/os/x86_64/
gpgcheck=0
enabled=1

Save and close the file by pressing Ctrl+O, followed by the Enter key. This is followed by Ctrl+X.

Finally, carry out the installation by issuing the following command:

sudo yum install mongodb-org

Starting MongoDB

After the installation of MongoDB, you will need to start MongoDB as a service in order to get it running. To do so (on all the distros that were previously mentioned), open a terminal and run the following command:

sudo service mongodb start

It is important that if you have SELinux running, you must make sure that it allows MongoDB to access its default port. To do so, issue the following before you issue the preceding command:

sudosemanage port -a -t mongod_port_t -p tcp 27017

Mac OS X

The easiest way to both install and stay up to date with MongoDB on OS X is by using the Homebrew package manager. Even if we just use it to install MongoDB here, you will most likely find it useful later for the installation of other software packages that you may need for your own projects after you finish this book.

Installing Homebrew is simple; just open a terminal and issue the following command:

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

When this finishes, make sure that the Homebrew package database is up to date, as follows:

brew update

Finally, install MongoDB by simply issuing the following command:

brew install mongodb

When the install has finished, we will need to define a data directory in order to give a location for MongoDB to store its data. By default, this directory will be at /data/db. So, unless you specify something else, you will need to make sure that this directory exists and is both writeable and readable by the user running your MongoDB instance. For example, if the user running MongoDB on your system is john, you will have to issue the following commands:

sudomkdir -p /data/db
sudochmod 0755 /data/dbsudochownmongod:mongod /data/db

Now that this is done, it is time to start up MongoDB. To do so, make sure that you are logged in as john, open a terminal, and simply issue the following command:

mongodb

That's it! You should receive a notification that MongoDB has started and is listening for a connection. Your instance is ready to go!

Connecting to MongoDB

In order to read and write from the MongoDB instance, we will first need to connect to it. In fact, MongoDB acts as a server in its own right. It exposes its functionality via a network port on which clients can then connect either through the local machine, or even over the Internet.

Note

Since this functionality is disabled by default due to it being a shoddy security practice, it will require a special configuration of the operating system that MongoDB is running on. We will not discuss this functionality as it falls outside the scope of this book, but we will refer to the MongoDB documentation for several helpful examples of how to achieve it for a variety of OS.

To connect to a MongoDB instance, you will need at least the following information:

  • The IP address of the instance: If you are accessing an instance on your local machine, this will be local host by default.

  • The port on which MongoDB is listening: Unless you configure a custom value, this will always default to port 27017.

  • The database that you are trying to connect to: Don't confuse this with the MongoDB instance itself. Each MongoDB instance can contain any number of databases, with each belonging to different users. The instance simply manages access to them.

Alternatively, you may also need the following:

  • A username and its associated password to grant you access to the instance and any databases therein that you are authorized to interact with.

A very easy way to try out this connectivity yourself and verify that MongoDB works as expected is by using the MongoDB shell, a tool that comes installed with MongoDB itself using the methods that we have described previously. How you access the shell varies depending on your OS. I will show each method in the following section and then give an example of how to use the shell itself since this will be the same on all platforms.

Windows

First, make sure that MongoDB is running by following the process that was outlined previously. After this, issue the following command in your command prompt:

C:\mongodb\bin\mongo.exe

Linux and OS X

First, make sure that MongoDB is running. Then, open a terminal and issue the following command:

mongo

Now that our shell is running, let's verify that everything works by creating a database and adding some data to it.

To create a database, issue the following command to the shell:

use Fruits

This will create a database named Fruits, to which we can immediately start adding data. (What, you were expecting more overhead? Not in MongoDB!)

We will not add a collection to our database. A collection is simply a basket of data entries, which are grouped based on some logical characteristic. For example, let's suppose that we want a collection of chewy fruits. We then issue the following command:

db.createCollection("Chewy")

The shell should respond with the { "ok" : 1 } JSON response that tells us that everything went well. Now, let's add some chewy fruits to our collection, as follows:

db.Chewy.insert({"name" : "pear"});
db.Chewy.insert({"name" : "apple"});

Even if the naming makes it intuitively clear what is going on in the preceding code, don't worry if you do not understand all the details yet. We will get to this in due course.

Finally, let's make MongoDB show us the chewy fruits that we stored. Issue the following command:

db.Chewy.find();

The shell will respond with something like the following:

{ "_id" : ObjectId("54eb3e6043adbad374577df9"), "name" : "apple" }
{ "_id" : ObjectId("54eb4036cdc928dc6a32f686"), "name" : "pear" }

The _id numbers will be different on your system, but you will find that the names are the same. All the fruits are where we want them to be.

Congratulations, you now have a fully working MongoDB setup ready for action!

 

Summary


By now, you may have perhaps noted the red thread running through all the components that we picked for our toolchain; they are all based on JavaScript. This gives us the ability to write all our logic from top to bottom in one single language rather than using different ones for different components (Objective-C or Java for the client, PHP for the server, SQL for the database, or some other unholy combination). As you will see throughout the remainder of the book, this will make it much easier for us to write concise, focused, and comprehensible code.

Once you go through all the preceding steps, I can safely assume that you have the necessary toolkit and you are ready to tackle the upcoming chapters, where we will have an opportunity to create our very first Ionic app and make it work on both Android and iOS devices.

Once you finish setting up your workspace, I recommend that you spend some time reading the Apache Cordova documentation, especially the documentation related to the different platform dependencies.

In the next chapter, we will perform further preparations and configure persistence with MongoDB as part of our preparations for our very own backend for our Ionic app.

About the Authors

  • Stefan Buttigieg

    Stefan Buttigieg is a medical doctor, mobile developer, and entrepreneur. He graduated as a doctor of medicine and surgery from the University of Malta. He is currently enrolled at the University of Sheffield, where he is pursuing a master's degree in health informatics. He has more than 5 years of experience working in international medical students' organizations, where he occupied various technical positions. He founded MD Geeks, an online community that brings together health professionals, developers, and entrepreneurs from around the world to share their passion for the intersection of healthcare and information technology. He is mostly interested in mobile development, especially for the Android and iOS platforms, open source healthcare projects, user interface design, mobile user experience, and project management.

    Browse publications by this author
  • Milorad Jevdjenic

    Milorad Jevdjenic is a programmer, open source enthusiast, and entrepreneur. He studied computer science at the University of Gothenburg with a focus on formal verification methods. Currently, he works as a software developer in the medical sector and also does independent commercial and pro bono consulting. Milorad is passionate about technology. He looks upon open source, and open standards in particular, as the fundamental drivers that are needed to build better societies. When he is not on the computer tinkering with code, he enjoys hiking, sports, and fine whiskey.

    Browse publications by this author

Latest Reviews

(6 reviews total)
Good book! I wish Packt would let me get the code download
versiones anteriores, no actualizado
Parfait très bons documents et service WEB impeccable
Book Title
Unlock this book and the full library for only $5/m
Access now