Single page web applications: JavaScript end-to-end

566 Pages·2013·14.59 MB·English

by  Michael Mikowski

Single Page Web Applications:
JavaScript end-to-end
Michael S. Mikowski and Josh C. Powell
Copyright
For online information and ordering of this and other Manning books, please
visit www.manning.com. The publisher offers discounts on this book when
ordered in quantity. For more information, please contact
Special Sales Department
Manning Publications Co.
20 Baldwin Road
PO Box 261
Shelter Island, NY 11964
Email: [email protected]
©2014 by Manning Publications Co. All rights reserved.
No part of this publication may be reproduced, stored in a retrieval system, or
transmitted, in any form or by means electronic,
mechanical, photocopying, or otherwise, without prior written permission of the
publisher.
Many of the designations used by manufacturers and sellers to distinguish their
products are claimed as trademarks. Where
those designations appear in the book, and Manning Publications was aware of a
trademark claim, the designations have been
printed in initial caps or all caps.
Recognizing the importance of preserving what has been written, it is Manning’s policy
to have the books we publish printed
on acid-free paper, and we exert our best efforts to that end. Recognizing also our
responsibility to conserve the resources
of our planet, Manning books are printed on paper that is at least 15 percent recycled and
processed without the use of elemental
chlorine.

Manning Publications Co.
20 Baldwin Road
Shelter Island, NY 11964

Development editor:Karen Miller
Technical proofreader:John J. Ryan III
Production editor:Janet Vail
Copyeditor:Benjamin Berg
Proofreader:Toma Mulligan
Typesetter:Gordan Salinovic
Cover designer:Marija Tudor
ISBN 9781617290756
Printed in the United States of America
1 2 3 4 5 6 7 8 9 10 – MAL – 18 17 16 15 14 13
Dedication
To my parents, wife, and children.
You have taught me so much, and I love you all.
M.S.M.
To my wife, Marianne. Thank you for your extraordinary patience with all
the time I took writing the book. I love you.
J.C.P.
Brief Table of Contents
Copyright
Brief Table of Contents
Table of Contents
Foreword
Preface
Acknowledgments
About this Book
About the Cover Illlustration
1. Introducing SPAs
Chapter 1. Our first single page application
Chapter 2. Reintroducing JavaScript
2. The SPA client
Chapter 3. Develop the Shell
Chapter 4. Add feature modules
Chapter 5. Build the Model
Chapter 6. Finish the Model and Data modules
3. The SPA server
Chapter 7. The web server
Chapter 8. The server database
Chapter 9. Readying our SPA for production
Appendix A. JavaScript coding standard
Appendix B. Testing an SPA
Index
List of Figures
List of Tables
List of Listings
Table of Contents
Copyright
Brief Table of Contents
Table of Contents
Foreword
Preface
Acknowledgments
About this Book
About the Cover Illlustration
1. Introducing SPAs
Chapter 1. Our first single page application
1.1. Definition, a little history, and some focus
1.1.1. A little history
1.1.2. What took JavaScript SPAs so long?
1.1.3. Our focus
1.2. Build our first SPA
1.2.1. Define the goal
1.2.2. Start the file structure
1.2.3. Set up Chrome Developer Tools
1.2.4. Develop the HTML and CSS
1.2.5. Add the JavaScript
1.2.6. Inspect our application using Chrome Developer
Tools
1.3. The user benefits of a well-written SPA
1.4. Summary
Chapter 2. Reintroducing JavaScript
2.1. Variable scope
2.2. Variable hoisting
2.3. Advanced variable hoisting and the execution context
object
2.3.1. Hoisting
2.3.2. Execution context and the execution context object
2.4. The scope chain
2.5. JavaScript objects and the prototype chain
2.5.1. The prototype chain
2.6. Functions—a deeper look
2.6.1. Functions and anonymous functions
2.6.2. Self-executing anonymous functions
2.6.3. The module pattern—bringing private variables to
JavaScript
2.6.4. Closures
2.7. Summary
2. The SPA client
Chapter 3. Develop the Shell
3.1. Grok the Shell
3.2. Set up the files and namespaces
3.2.1. Create the file structure
3.2.2. Write the application HTML
3.2.3. Create the root CSS namespace
3.2.4. Create the root JavaScript namespace
3.3. Create the feature containers
3.3.1. Pick a strategy
3.3.2. Write the Shell HTML
3.3.3. Write the Shell CSS
3.4. Render the feature containers
3.4.1. Convert the HTML to JavaScript
3.4.2. Add an HTML template to our JavaScript
3.4.3. Write the Shell stylesheet
3.4.4. Direct the application to use the Shell
3.5. Manage the feature containers
3.5.1. Write a method to extend or retract the chat slider
3.5.2. Add the chat slider click event handler
3.6. Manage application state
3.6.1. Understand the behavior browser users expect
3.6.2. Pick a strategy to manage history controls
3.6.3. Change the anchor when a history event occurs
3.6.4. Use the anchor to drive the application state
3.7. Summary
Chapter 4. Add feature modules
4.1. The feature module strategy
4.1.1. A comparison with third-party modules
4.1.2. Feature modules and fractal MVC pattern
4.2. Set up feature module files
4.2.1. Plan the file structure
4.2.2. Populate the files
4.2.3. What we’ve wrought