mixu/singlepageappbook

Content and site generator for Single page apps in depth (my book on single page applications)

Single Page Apps in Depth

Read the book here: http://singlepageappbook.com/

Notes

I've added this repository to make it easier to work with the book, if you feel like it.

I didn't include the commits from prior to the release, because book writing is a messy and painful process of revisions, deletions and rethinking things.

I did all the writing directly as HTML inside a git repo:

git shortlog -sn

tells me that I made 216 commits between Jun 28th 2012 and Jan 18th 2012 to write the book.

There will be a second set of updates coming later on - once I am done with http://mixu.net/view.json/ , which is a view layer I'm working on right now. It has definitely changed and clarified my thinking re:view layers. Writing a book is fairly intense, which is why I am focusing on code for now; it'll let me come back to the book with a less attached and more critical perspective.

Directory Structure

The content of the book is in ./content/. To generate the book:

npm install
node generate.js

which generates the output in ./output/.

To rebuild the .epub and .mobi files:

make book.epub book.mobi

You need to install calibre first for the HTML to epub/mobi conversion.

Thanks

Many many thanks to jamesarosen and ahizzle for their help!

Licence

This book is available for free, but what I've written remains mine.

Translations: as long as the content made is available for free (you can have ads) I welcome translations.

Other use: contact me; as long as your intentions are good I'd be happy to figure out something. I'm not looking to make money from the book.

singlepageappbook's Issues

Examples do not fit the described architecture patterns

I like the first part of your book (and that of each chapter) where you describe and analyze different approaches to the architecture. I agree with most of it and I'm very glad someone on the Internet expressed these thoughts at last.

I also like the part where you describe how to refactor an existing project towards better architecture. This is something new around modern web app books, too.

But the second part where you provide examples and implementations does not fit with the first one.
The code mainly uses approaches you label as bad (globals, no explicit dependencies, no packages).
The server-side is opinionated towards Node.js and npm (surprisingly, not all web apps are built upon Node.js).
The browser-side is biased towards Ember-like patterns where "Ember" is replaced with "Framework", though Ember uses globals all around.

Many of your thoughts on architecture describe better approaches than the modern frameworks provide, so having them as examples of your thoughts is confusing.

Please elaborate more on the architecture part and drop the examples which do not fit into. I would be glad to discuss confusing parts here. Thanks in advance.

Domain expired

Hello,

the domain http://singlepageappbook.com/ seems to have expired

Designing a Page

Need suggestionsvon best fonts, how to implement them & designs. Also need to have other sites accessible from my page for individual help

Disqus integration gone? Comments are not showing

There are no comments

Creative Commons License?

Have you considered a Creative Commons license for the book? The Attribution-ShareAlike (CC-BY-SA) license may be what you're looking for.

Releasing a book under a formal, tried-and-tested license like a CC license, is better than a simple statement of intent like what you have now.

What about using Web Components?

Could you provide an example of how to build a single page application with Web Components?

I'm specifically interested in the template element.

Where is the bookgen/generate.js

Sorry to bother you, but where is the generate.js ?

Handlebars.compile Exception

When compiling a .epub/.mobi file per instructions in the readme, the following error is outputted on "node generate.js". I attempted to look at the issue, and its a bit strange. A string is indeed being passed to Handlebars.compile

http://pastebin.com/54D1UiZA

Updated version that looks at tree based approaches such as React, Vue, etc

Even 8 years after this was last updated, this is still easily the best top-down approach of looking at single page applications IMHO, but I feel it needs a second edition that includes the "modern" approaches seen in React and Vue, where you build component trees.

I am not totally sure where to put these in the hierarchies, but it looks to me like they both belong to the model backed views camp with string-granular updates?

• Markup-driven views vs. Model-backed views
• View-granular vs. element-granular vs. string-granular updates

React renders the VDOM and diffs the results, updating what has changed, but it's a bit unclear how.

Un-rendered content: html entities are removed on publish

In Chapter 5 there is a paragraph (or more) that reads quite weird:

but also allow you to specify a bindings that do not correspond to elements

a what binding?

you cannot insert an element other than a or inside a .

other than a what? and inside a what?

If you place an invalid wrapper element like a (blank) where the

something is amiss

Couple paragraphs about managing DOM stateful elements?

The select, input, embed/object (Flash), video, audio, canvas etc. elements represent components with their own internal state which is often can not be just re-rendered from a model data. For inputs, this includes scroll position and focus. For the rest, this includes internal state, video and audio buffers, image buffers, content downloaded inside the element etc.

I've read many books and articles, frameworks for modern single-page web applications and none of them include thoughts how to manage these elements which do not directly represent a model and their contents cannot be templated like simple HTML tags.

Please add some thoughts on this topic into your book.