JavaScript Programming: Pushing the Limits

Table of Contents

Introduction

Part I: Starting From a Firm Foundation

Chapter 1: Best Practices

Loose Coupling

Problems with Tight Coupling

Advantages of Loose Coupling

JavaScript MVCs and Templates

MVCs

Templates

Development Tools

WebKit Developer Tools

Weinre

Version Control

CSS Preprocessing

Testing

Using Grunt

Using QUnit

Summary

Additional Resources

Engineering Best Practices

Chrome Developer Tools

Weinre

Version Control

CSS Preprocessing

Testing

Chapter 2: Libraries, Frameworks, and Plugins

Choosing the Right JavaScript Library

jQuery

Zepto

Vanilla DOM

Using a Framework

Bootstrap

jQuery UI

Mobile Frameworks

Miscellaneous Scripts

Modernizr

HTML5 Shiv

HTML5 Boilerplate

Finding jQuery Plugins

Where (and Where Not) to Look

What to Look for—A Ten-Point Inspection

Summary

Additional Resources

Library Documentation

Other Library Resources

Framework Documentation

Miscellaneous Scripts

jQuery Plugins

Part II: Building the Front End

Chapter 3: Backbone.js

Getting Started with Backbone

What Is Backbone?

Why Should You Use Backbone?

Backbone Basics

When to Use Backbone

Setting Up Backbone

Models in Backbone

Creating a Model

Creating Computed Attributes

Setting Defaults

Using the Initialize Function

Using Backbone Events

Validating Your Model

Working with Collections in Backbone

Creating a Collection

Creating Collection Events

Understading Backbone Views

Creating a View

Using Render Functions

Using the View Element in Backbone

Using Nested Views in Backbone

Saving and Fetching Data

Syncing a Model on the Server

Using the LocalStorage API with Backbone

Saving a Collection on the Server

Using Backbone.sync

Working with Routers

How Routes Work

Setting Up Routers

PushState Versus Hashchange

More About Events

Unbinding Events

Triggering Events Manually

Binding “this”

The All Event

Manipulating Collections

Pulling Collection Items

Sorting a Collection

Summary

Additional Resources

Best Practices in Backbone:

Backbone Books:

Backbone Tutorials:

Chapter 4: Using JavaScript Templates

Introduction to Templates

Why Use Templates?

Understanding the Different Template Libraries

Making the Right Choice

Using Underscore Templates

Underscore Template Basics

Reviewing Template Best Practices

Using JavaScript in Templates

Using Templates in Backbone

Setting Up the Model and View Without Templates

Rendering a View with Templates

Summary

Additional Resources

Template Libraries

Choosing a Template Library

Pros and Cons of Logic-Less Templates

Templates in Backbone

Chapter 5: Creating Forms

Understanding Progressive Enhancement

The Progressive Enhancement Approach

Why Progressive Enhancement?

Deciding Which Environments to Support

Letting HTML5 Do the Work for You

HTML5 Input Types

Interactive Features

Using Polyfills for Older Browsers

Finding Third-Party Polyfills

Writing Your Own Polyfills

Connecting to a REST API

Posting the Form

Setting Up a Universal Function

Forms in Backbone

Setting Up the Form Model

Setting Up the Form View

Saving Form Fields to the Model

Adding Validation

Cleaning Up the Template

Required Fields

Submitting the Form

Putting It All Together

Summary

Additional Resources

HTML5 Form Basics

HTML5 Form Tutorials

Part III: Working with Server-Side JavaScript

Chapter 6: Intro to Node.js

Why Node?

Using Node with Real-Time Apps

Understanding How Node Works

Installing Node

Mac/Linux Installation

Windows Installation

Checking Your Install

Getting Started with Node

Creating the Server

Adding the Content

Wrapping Things Up

Running the Script

Simplifying the Script

Using the Node REPL

Node Modules

Including Modules

External Modules and NPM

Finding Modules

Node Patterns

Modules and Global Variables

Asynchronous Patterns

Events

Child Processes

Summary

Additional Resources

Books

Tutorials

Video Tutorials

Module Directories

Best Practices

Chapter 7: Express Framework

Getting Started with Express

Installing Express

Creating an Express App

Setting Up Routes

Existing Routes

Creating Additional Routes

Post, Put, and Delete

Rendering Views

Enabling Underscore Templates

Creating Views

Handling Form Data

Creating a Post Route

Sending Feedback to the Template

Sending an Email

Connecting to an SMTP Server

Building the Email Message

Sending the Email

Wrapping Up

Summary

Additional Resources

Tutorials

Template Resources

Form Resources

Email Resources

Other Notable Frameworks

Chapter 8: MongoDB

What's So Good About NoSQL?

Scalability

Simplicity

Getting Started with MongoDB

Installing MongoDB

Running MongoDB

Installing MongoDB Modules

Creating a Database

CRUD with MongoDB

Creating Collections

Reading Data

Updating Data

Deleting Data

Mongoose

Getting Started with Mongoose

Creating Models

Reading Data

Other Database Options

Summary

Additional Resources

Documentation

GUI Tools

Books

General NoSQL Info

Part IV: Pushing the Limits

Chapter 9: Going Real-Time with WebSockets

How WebSockets Work

Problems with Polling

The WebSockets Solution

Getting Started with Socket.IO

Socket.IO on the Server

Socket.IO on the Client

Building a Real-Time Chat Room

Creating the Chat Room View

Submitting a Message to the Server

Handling the Message on the Server

Displaying the New Message on the Clients

Adding Structure with Backbone.js

Adding Users

Adding a Timestamp

Persistence with MongoDB

Wrapping Up

Summary

Additional Resources

Documentation

Tutorials

General WebSocket Info

Chapter 10: Going Mobile

Setting Up a Mobile App

Detecting Mobile

Styling a Mobile Site

Mobile Frameworks

Touch Screen Integration

Basic Touch Events

Complex Touch Gestures

Geolocation

Finding the User's Location

Connecting with Google Maps

Tracking Geolocation Changes

Phone Numbers and SMS

Static Phone Numbers and SMS Links

Dialing Phone Numbers and Texting with JavaScript

PhoneGap

Pros and Cons of PhoneGap

Getting Started with PhoneGap

Connecting with the Camera

Connecting with the Contact List

Other APIs

Summary

Additional Resources

Mobile Usage Stats

Mobile Detection

Mobile Frameworks

Mobile Libraries

Mobile Styling Tools

Additional Mobile Tools

Chapter 11: JavaScript Graphics

Canvas Basics

Drawing Basic Shapes

Animating the Canvas

Canvas Mouse Events

SVG Basics

Animating the SVG

SVG Mouse Events

Scripting SVG

Raphaël.js

Drawing Paths

Drawing Curves

Styling

Animation

Mouse Events

Charting with gRaphaël

Pie Charts

Bar Chart

Line Chart

3D Canvas with WebGL

Introducing Three.js

Creating Texture with Images

Animating 3D Canvas

Adding Mouse Events

Using a 2D Canvas Fallback

3D Transforms in CSS

Summary

Additional Resources

Inspiration

Canvas

SVG

Raphaël.js

WebGL

Three.js

3D Transforms in CSS3

Chapter 12: Launching Your App

Performance Checklist

Where to Focus

Asset Management

Animation Optimization

Doing Less

Avoiding Reflows

Deployment

Deploying Static Assets on a CDN

Deploying Node Server on EC2

The Launch

Additional Resources

Performance Testing

File Compression

Animation Performance

General Performance

Deployment

Appendix: CSS Preprocessing with LESS

What's So Good About Preprocessing?

Installing a LESS Compiler

Compiling on the Server

Variables

Operators

Nesting

Functions

Mixins

Using Imports

Example File Structure

Customizing the Structure

LESS Documentation

LESS Function Reference

LESS Compilers

Free Mixins

Tutorials

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset