Node.js 6.x Blueprints

Book Image

Node.js 6.x Blueprints

By : Fernando Monteiro

Book Image

Node.js 6.x Blueprints

By: Fernando Monteiro

Overview of this book

Node.js is the most popular framework to create server-side applications today. Be it web, desktop, or mobile, Node.js comes to your rescue to create stunning real-time applications. Node.js 6.x Blueprints will teach you to build these types of projects in an easy-to-understand manner. The key to any Node.js project is a strong foundation on the concepts that will be a part of every project. The book will first teach you the MVC design pattern while developing a Twitter-like application using Express.js. In the next chapters, you will learn to create a website and applications such as streaming, photography, and a store locator using MongoDB, MySQL, and Firebase. Once you’re warmed up, we’ll move on to more complex projects such as a consumer feedback app, a real-time chat app, and a blog using Node.js with frameworks such as loopback.io and socket.io. Finally, we’ll explore front-end build processes, Docker, and continuous delivery. By the end of book, you will be comfortable working with Node.js applications and will know the best tools and frameworks to build highly scalable desktop and cloud applications.

Node.js 6.x Blueprints

Node.js 6.x Blueprints

Credits

About the Author

About the Author

About the Reviewer

About the Reviewer

www.PacktPub.com

www.PacktPub.com

Preface

Free Chapter

Building a Twitter-Like Application Using the MVC Design Pattern

Building a Twitter-Like Application Using the MVC Design Pattern

Installing Node.js

Installing Express generator

Building the baseline

Changing the application's structure

Restructuring the views folder using partials

Adding templates for login, sign-up, and profile

Installing additional middleware

Refactoring the app.js file with the new middleware

Adding config and passport files

Creating a models folder and adding a user schema

Protecting routes

Creating the controllers folder

Running the application and adding comments

Build a Basic Website Using MySQL Database

Build a Basic Website Using MySQL Database

What we are building

Creating the baseline applications

Installing the Swig template engine

Refactoring the views folder

Creating a controllers folder

Adding partials files for head and footer

Installing and configuring Sequelize-cli

Editing the config.js file with database credentials

Creating a User scheme

Creating Band schema

Creating the database on MySql

Checking database tables

Creating the application controllers

Creating the application templates/views

Adding style to the application

Adding routes and a controller to the application

Adding database content

Creating a Bands form

Main difference between ODM (mongoose) and ORM (sequelize)

Building a Multimedia Application

Building a Multimedia Application

What we are building?

Starting with package.json

Adding baseline configuration files

Adding server folders

Configuring the app.js file

Creating the config.js file

Creating the controller's files

Creating model files

Creating view files

Creating the public folder content

Inserting images in the application using the upload form

Inserting video files into the application using the upload form

Important notes about image and video upload

Dont Take a Photograph, Make It – An App for Photographers

Dont Take a Photograph, Make It – An App for Photographers

What we are building

Creating the baseline applications

Creating the book controller

Adding a CSS framework to the application

Refactoring the views folder

Creating the .env.js file

How Cloudinary works

Running the application

Creating folders in the Cloudinary dashboard

URL transformation rendering

Creating a Store Locator Application with MongoDB Geospatial Query

Creating a Store Locator Application with MongoDB Geospatial Query

What we are building

Creating the baseline application

Using the Geolocation HTML5 API

Creating the application controller

Creating models

Creating the views template

Adding locations to MongoDB

Understanding Geospatial indexes on MongoDB

Checking the Geolocation application

Ordering points by distance

Building a Customer Feedback App with a Restful API and Loopback.io

Building a Customer Feedback App with a Restful API and Loopback.io

What we are building

Creating models with command line

Editing models after creation with command line

Creating a datasource through the command line

Connecting models to datasources

Using the API Explorer

Adding database relations

Dealing with LoopBack boot files

Consuming the API

Creating React components

Creating new feedbacks

Building a Real–Time Chat Application with Socket.io

Building a Real–Time Chat Application with Socket.io

What we are building

Starting with a package.json file

Adding configuration files

Adding task manager files

Creating the app.js file

Creating the route file

Creating the application views

Installing frontend components with Bower

Creating the Socket.io events

Starting the chat application

Creating a Blog with the Keystone CMS

Creating a Blog with the Keystone CMS

What we are building

Installing Keystone framework

Creating the scaffold application

Running the Keystone blog

Anatomy of the Keystone engine

Changing the default bootstrap theme

Modifying the KeystoneJS core template path

Adding the Gallery script

Extending the keystone.js core

Inserting content using control panel

Building a Frontend Process with Node.js and NPM

Building a Frontend Process with Node.js and NPM

What we are building

Creating the baseline application

Refactoring the application folder

Refactoring the client folder

Creating the AngularJS application

Adding content to the application

Creating the Building tasks

Using tasks with individual commands

Deploying to Heroku Cloud

Creating and Deploying Using Continuous Integration and Docker

Creating and Deploying Using Continuous Integration and Docker

What we are building

What Continuous Integration means

Creating the baseline application

Running the application

Creating a GitHub or Bitbucket free account

Creating a Heroku free account

Creating a MongoLab free sandbox account

Initializing a git repository and pushing to GitHub

Creating a Heroku application using Heroku Dashboard

Creating a Codeship free account

Installing Docker and setting up the application

Customer Reviews

5 star

0

4 star

0

3 star

0

2 star

0

1 star

0

Refactoring the client folder

The client folder will have a pretty basic structure for any web application with folders to store CSS, JavaScript, and images files.

For this example, we will use the latest stable version of AngularJS to create the pages of our application:

Inside the client folder, create the following folders:
- css/
- images/gallery/
- js/
- js/libs/
- js/scripts/
- views/

After creating all these folders, the client directory will look like the following screenshot:

Client folder structure

Adding the application views

Now is time to create the application views folder to store all the application templates:

Inside the client/src folder, create a new file called home.html and add the following code:

      <div class="col-md-6" ng-repeat="item in vm.listProducts"> 
        <div class="card" > 
          <img class="card-img-top" ng-src="{{ item.image }}"
           alt="Card image cap" width="100%"> 
          <div class="card-block"> 
            <h4...