Developing Responsive Web Applications With AJAX and jQuery by Patel, Sandeep Kumar -- Read -- Imperial Library of Trantor

Index

Developing Responsive Web Applications with AJAX and jQuery

Table of Contents Developing Responsive Web Applications with AJAX and jQuery Credits About the Author About the Reviewers www.PacktPub.com

Support files, eBooks, discount offers, and more

Why subscribe? Free access for Packt account holders

Preface

What this book covers What you need for this book Who this book is for Conventions Reader feedback Customer support

Downloading the example code Errata Piracy Questions

1. Introduction to a Responsive Web Application

Benefits of a responsive design Server- versus client-side detection The technology stack

HTML5 CSS3 and media queries JavaScript

Measuring responsiveness Devices and screens Media types Media queries Role of media queries Responsive frameworks

Bootstrap The Foundation framework The Cascade framework The Pure CSS framework The Gumby framework

Bootstrap 3 for a responsive design What are we building? Summary

2. Creating a Responsive Layout for a Web Application

Required software and tools Setting up a Java-based web project Configuring Bootstrap 3 Creating a wireframe for a web application Responsive layouts Creating a layout for large and small devices Developing the layout

Bootstrap 3 containers Developing a row Developing the menu section Developing the hero section Developing the list of products section

The combined layout Verifying the layout

The Opera Mobile emulator

Summary

3. Adding Dynamic Visuals to a Web Application

Building a JSON servlet

Creating a POJO class Creating a product store Converting from POJO to JSON Creating the servlet

Building a jQuery AJAX method

jQuery promises The jQuery templating mechanism The combined jQuery code The combined HTML markup Modifying the style of the product

Building an image carousel Summary

4. Twitter Integration

Introduction to Twitter4J Configuring Twitter4J in a web application Posting a tweet

Creating a Twitter button Setting up a new Twitter application

The Twitter Permissions tab The Twitter Details tab The Twitter Settings tab The Twitter API Keys tab

Developing a Twitter servlet

Request token

Developing a Twitter callback servlet

Access token

Combining all the pieces Posting a tweet with an image

Product store with an image Markup changes Changes in app.js Twitter servlet changes Changes in the Twitter callback servlet User Twitter timeline

Summary

5. Facebook Integration

Introduction to the Facebook SDK for JavaScript Creating a Facebook application Configuring the Facebook SDK

The Settings tab

The Basic configuration The Advanced configuration The Migrations configuration

Configuring a Facebook login Configuring the Facebook Like and Share buttons Configuring Facebook comments The combined code Summary

6. Google+ Integration

Introduction to the Google+ API Configuring Google+

Creating a client ID Including the Google script

7. Linking Dynamic Content from External Websites

Introduction to the YouTube API Configuring a YouTube API Searching for a YouTube video

The part parameter The fields parameter The YouTube button markup Asynchronous search in YouTube Rendering the YouTube search results

Embedding a YouTube video Summary

8. Integrating E-Commerce or Shopping Applications with Your Website

Creating a shopping cart

Adding a product to the cart Displaying the minimal view of the cart Displaying the cart details in a table

Configuring the PayPal Developer API Integrating the PayPal Developer API Configuring the Shopify API Integrating the Shopify API Summary

9. Integrating the Google Currency Converter with Your Web Application

The Google Currency Converter API Configuring the Google Currency Converter API Integrating the Currency Converter API Developing our currency converter

Building the currency list dropdown Processing the conversion request

Exceptions Summary

10. Debugging and Testing

Implementing the debugging mechanism

Dimensions Toolkit The Designmodo Responsive Test tool The Opera Mobile emulator tool The Responsinator tool The Viewport Resizer tool The L-Square Responsive Design Inspector tool The FireBreak add-on The More Display Resolutions 1.0 add-on The BrowserStack Responsive tool The MobileTest tool The TestSize tool The Am I Responsive tool The Responsive Design Checker tool The RUIT tool The Responsive Test online tool

Testing the app as a whole Summary

Index

← Prev
Back
Next →

← Prev
Back
Next →