O'Reilly: Developing JavaScript Web Applications

Update! The book is now live on O'Reilly's site.

Developing JavaScript Web Applications is a new book by Alex MacCaw, published by O'Reilly, written to help you build the next generation of rich internet applications.

Building rich JavaScript applications that bring the desktop experience to the Web is now possible, thanks to powerful JavaScript engines and the CSS3 and HTML5 specifications. The key is moving state from the server to the client side; but that’s no simple task. This book takes you through all the steps necessary to create state-of-the-art JavaScript applications, including structure, templating, frameworks, communicating with the server, and many other issues.

Through practical, tutorial-based explanations, you learn how to create JavaScript applications that offer a much more responsive and improved experience. You’ll work hands-on with an example application throughout the book to learn the concepts involved.

• Explore MVC and how to best structure and manage dependencies inside your application
• Get an introduction to templating and data binding
• Learn about loading remote data, Ajax Level 2 and cross-domain requests
• Use WebSockets and Node to create realtime applications
• Accept dropped files and upload data with progress indicators
• Learn about major frameworks and libraries, including jQuery, JavaScriptMVC and Backbone
• Write tests and use the console to debug your applications
• Get deployment best practices, such as caching and minification

Sign up to receive an email when the book is released!

Signup »

Table of Contents

1. Introduction
   1. Who is this book for?
   2. Accompanying files
   3. Code conventions
      1. jQuery examples
   4. Holla
   5. Preface
2. MVC & Classes
   1. Early days
   2. Adding structure
   3. What is MVC?
   4. The Model
   5. The View
   6. The Controller
   7. Towards modularity, creating classes
   8. Adding functions to classes
   9. Adding methods to our class library
   10. Class inheritance using prototype
   11. Adding inheritance to our class library
   12. Function invocation
   13. Controlling scope in our class library
   14. Adding private functions
   15. Class libraries
3. Events & Observing
   1. Listening to events
   2. Event ordering
   3. Canceling events
   4. The event object
   5. Event libraries
   6. Context change
   7. Delegating events
   8. Custom events
   9. Custom events & jQuery plugins
   10. Non-DOM events
4. Models & Data
   1. MVC & Namespacing
   2. Building an ORM
      1. Prototypal inheritance
      2. Adding ORM properties
      3. Persisting records
   3. GUID IDs
      1. Adding GUIDs to the ORM
   4. Addressing references
   5. Loading in data
      1. Including data inline
      2. Loading data with Ajax
      3. JSONP
      4. Security with cross domain requests
   6. Populating our ORM
   7. Storing data locally
   8. Adding local storage to our ORM
   9. Submitting new records to the server
5. Controllers & State
   1. Module pattern
      1. Global import
      2. Global export
   2. Adding a bit of context
      1. Abstracting into a library
      2. Loading controllers after the document
      3. Accessing Views
      4. Delegating events
   3. State machines
   4. Routing
      1. Using the URL’s hash
      2. Detecting hash changes
      3. Ajax crawling
      4. Using the HTML5 History API
6. Views & Templating
   1. Dynamically rendering views
   2. Templates
      1. Template helpers
      2. Template storage
   3. Binding
      1. JLink
      2. Binding up models
7. Dependency management
   1. Common.js
      1. Declaring a module
      2. Modules and the browser
   2. Module loaders
      1. Yabble
      2. RequireJS
   3. Wrapping up modules
   4. Module alternatives
      1. LABjs
   5. FUBCs
8. Working with Files
   1. Browser support
   2. Getting information about files
   3. File inputs
   4. Drag & Drop
      1. Dragging
      2. Dropping
      3. Cancel default drag/drop
   5. Copy & Paste
      1. Copying
      2. Pasting
   6. Reading files
      1. Blobs & Slices
   7. Custom browse buttons
   8. Uploading files
      1. Ajax progress
   9. jQuery Drag and Drop Uploader
      1. Creating a drop area
      2. Uploading the file
9. The Realtime Web
   1. Realtime’s history
   2. WebSockets
      1. Node.js & Socket.IO
   3. Realtime architecture
   4. Perceived speed
10. Testing & Debugging
    1. Unit testing
       1. Assertions
       2. QUnit
       3. Jasmine
    2. Drivers
    3. Headless testing
       1. Using Zombie
       2. Using Ichabod
    4. Distributed testing
    5. Providing support
    6. Inspectors
       1. Web Inspector
       2. Firebug
    7. The console
       1. Console helpers
    8. Using the debugger
    9. Analysing network requests
    10. Profile and timing
11. Deploying
    1. Performance
    2. Caching
    3. Minification
    4. GZIP Compression
    5. Using a CDN
    6. Auditors
    7. Resources
12. Libraries - Spine
    1. Setup
    2. Classes
       1. Instantiation
       2. Extending classes
       3. Context
    3. Events
    4. Models
       1. Fetching records
       2. Model events
       3. Validation
       4. Persistence
    5. Controllers
       1. Proxying
       2. Elements
       3. Delegating events
       4. Controller events
       5. Global events
       6. The Render pattern
       7. The Element pattern
    6. Building a contacts manager
       1. Contact model
       2. Sidebar controller
       3. Contacts controller
       4. App controller
13. Libraries - Backbone
    1. Models
       1. Models & attributes
    2. Collections
       1. Controlling a collection’s order
    3. Views
       1. Rendering views
       2. Delegating events
       3. Binding and context
    4. Controllers
    5. Syncing with the server
       1. Populating collections
       2. On the server side
       3. Custom behavior
    6. Building a todo list
14. Libraries - JavascriptMVC
    1. Introduction
       1. Everything is a plugin
    2. StealJS - Dependency Management
       1. Loading Non JavaScript resources
       2. Compression
    3. Class
    4. Models
       1. Service Encapsulation
       2. Events
       3. Getter / Setters ?
       4. Model.Lists
    5. Controllers
    6. Views
    7. Putting it all together …
    8. Events
    9. Building a todo list
15. Appendix - jQuery primer
    1. DOM Traversal
    2. DOM Manipulation
    3. Events
    4. Ajax
    5. Being a good citizen
    6. Extensions
    7. Creating a Growl jQuery plugin
16. Appendix - CSS Extensions
    1. Variables
    2. Mixins
    3. Nested Rules
    4. Including other stylesheets
    5. Colors
    6. How do I use Less?
       1. Via the command line
       2. Via Rack
       3. Via JavaScript
       4. Less.app
17. Appendix - CSS3 Reference
    1. Prefixes
    2. Colors
    3. Rounded corners
    4. Drop shadows
    5. Text shadow
    6. Gradients
    7. Multiple backgrounds
    8. Selectors
       1. Nth child
       2. Direct descendants
       3. Selector negation
    9. Transitions
    10. Border-image
    11. Box-sizing
    12. Transformations
    13. Flexible box model
    14. Fonts
    15. Graceful degradation
        1. Modernizr
        2. Google Chrome Frame
    16. Creating a layout