book

JavaScript Web Applications

by Alex MacCaw

August 2011

Intermediate to advanced

276 pages

6h 37m

English

O'Reilly Media, Inc.

Read now

Unlock full access

Who Is This Book For?How This Book Is OrganizedConventions Used in This BookAccompanying FilesCode ConventionsjQuery ExamplesHollaAuthor’s NoteSafari® Books OnlineHow to Contact Us
Early DaysAdding StructureWhat Is MVC?The ModelThe ViewThe ControllerToward Modularity, Creating ClassesAdding Functions to ClassesAdding Methods to Our Class LibraryClass Inheritance Using PrototypeAdding Inheritance to Our Class LibraryFunction InvocationControlling Scope in Our Class LibraryAdding Private FunctionsClass Libraries
Listening to EventsEvent OrderingCanceling EventsThe Event ObjectEvent LibrariesContext ChangeDelegating EventsCustom EventsCustom Events and jQuery Plug-InsNon-DOM Events
MVC and NamespacingBuilding an ORMPrototypal InheritanceAdding ORM PropertiesPersisting RecordsAdding ID SupportAddressing ReferencesLoading in DataIncluding Data InlineLoading Data with AjaxJSONPSecurity with Cross-Domain RequestsPopulating Our ORMStoring Data LocallyAdding Local Storage to Our ORMSubmitting New Records to the Server
Module PatternGlobal ImportGlobal ExportAdding a Bit of ContextAbstracting into a LibraryLoading Controllers After the DocumentAccessing ViewsDelegating EventsState MachinesRoutingUsing the URL’s HashDetecting Hash ChangesAjax CrawlingUsing the HTML5 History API
Dynamically Rendering ViewsTemplatesTemplate HelpersTemplate StorageBindingBinding Up Models
CommonJSDeclaring a ModuleModules and the BrowserModule LoadersYabbleRequireJSWrapping Up ModulesModule AlternativesLABjsFUBCs
Browser SupportGetting Information About FilesFile InputsDrag and DropDraggingDroppingCancel Default Drag/DropCopy and PasteCopyingPastingReading FilesBlobs and SlicesCustom Browse ButtonsUploading FilesAjax ProgressjQuery Drag and Drop UploaderCreating a Drop AreaUploading the File

Real Time’s HistoryWebSocketsNode.js and Socket.IOReal-Time ArchitecturePerceived Speed
Unit TestingAssertionsQUnitJasmineDriversHeadless TestingZombieIchabodDistributed TestingProviding SupportInspectorsWeb InspectorFirebugThe ConsoleConsole HelpersUsing the DebuggerAnalyzing Network RequestsProfile and Timing
PerformanceCachingMinificationGzip CompressionUsing a CDNAuditorsResources
SetupClassesInstantiationExtending ClassesContextEventsModelsFetching RecordsModel EventsValidationPersistenceControllersProxyingElementsDelegating EventsController EventsGlobal EventsThe Render PatternThe Element PatternBuilding a Contacts ManagerContact ModelSidebar ControllerContacts ControllerApp Controller
ModelsModels and AttributesCollectionsControlling a Collection’s OrderViewsRendering ViewsDelegating EventsBinding and ContextControllersSyncing with the ServerPopulating CollectionsOn the Server SideCustom BehaviorBuilding a To-Do List
SetupClassesInstantiationCalling Base MethodsProxiesStatic InheritanceIntrospectionA Model ExampleModelAttributes and ObservablesExtending ModelsSettersDefaultsHelper MethodsService EncapsulationCreate a taskGet a taskGet tasksUpdate a taskDestroy a taskType ConversionCRUD EventsUsing Client-Side Templates in the ViewBasic UsejQuery ModifiersLoading from a Script Tag$.View and SubtemplatesDeferredsPackaging, Preloading, and Performance$.Controller: The jQuery Plug-in FactoryOverviewController InstantiationEvent BindingTemplated ActionsPutting It All Together: An Abstract CRUD List
DOM TraversalDOM ManipulationEventsAjaxBeing a Good CitizenExtensionsCreating a Growl jQuery Plug-in
VariablesMixinsNested RulesIncluding Other StylesheetsColorsHow Do I Use Less?Via the Command LineVia RackVia JavaScriptLess.app
PrefixesColorsRounded CornersDrop ShadowsText ShadowGradientsMultiple BackgroundsSelectorsNth ChildDirect DescendantsSelector NegationTransitionsBorder ImagesBox SizingTransformationsFlexible Box ModelFontsGraceful DegradationModernizrGoogle Chrome FrameCreating a Layout

Overview

Building rich JavaScript applications that bring a desktop experience to the Web requires moving state from the server to the client side—not a simple task. This hands-on book takes proficient JavaScript developers through all the steps necessary to create state-of-the-art applications, including structure, templating, frameworks, communicating with the server, and many other issues.

Throughout the book, you'll work with real-world example applications to help you grasp the concepts involved. Learn how to create JavaScript applications that offer a more responsive and improved experience.

Use the Model-View-Controller (MVC) pattern, and learn how to manage dependencies inside your application
Get an introduction to templating and data binding
Learn about loading remote data, Ajax, and cross-domain requests
Create realtime applications with WebSockets and Node.js
Accept dropped files and upload data with progress indicators
Use major frameworks and libraries, including jQuery, Spine, and Backbone
Write tests and use the console to debug your applications
Get deployment best practices, such as caching and minification