Jonathan Snook

Your approach is essentially the 'module pattern'. This article describes some other reasons you might not want to use it:
http://snook.ca/archives/javascript/no-love-for-module-pattern

I lead a somewhat large (~10000 sloc) project which uses the module pattern everywhere. I think the best argument against the module pattern is the difficulty of debugging. I can no longer just pop open a console and inspect objects.

Responses to your individual points:

>> * you cannot use previous OOP experience

While unfortunate I believe this is largely unavoidable. Javascript's object system is not 'classical' inheritance. The module pattern, however, is also not 'classical' inheritance. Regardless of OOP technique, the New Javascript Programmer must learn about the object system.

>> * there are MANY ways to do OOP using prototypes

There are also many forms of the module pattern. You just showed me another one I hadn't seen before. Then there's immediately invoking function expressions, which some people like to do like this

(function () { var exports = {}; return exports; })());

and others like to do like this

!function() { var private = 4; return { getPrivate: function () { return private; }; }();

>> * 'this' has different meanings depending on context

Can't argue against this one.

>> * prototypes make existing objects unreliable -> requires prior knowledge about libraries and APIs (leaky abstraction)

I'm not sure I see the argument here.

>> * building an object…

I'm also about to publish my first book (about a guy called Elon Musk). Here are some links I've saved that were interesting to read:

Selling my e-book on Amazon (http://snook.ca/archives/writing/selling-ebook-on-amazon)

How you can make a million writing your own e-book (http://www.dailymail.co.uk/home/moslive/article-2040044/Kindle-How-make-million-writing-e-book.html#ixzz2ZDvfiNPB)

How to Write and Promote New York Times Bestsellers: Tim Ferriss and Jack Canfield (http://www.fourhourworkweek.com/blog/2012/09/01/how-to-write-and-promote-new-york-times-bestsellers-tim-ferriss-and-jack-canfield/)

How to (Really) Make $1,000,000 Selling E-Books – Real-World Case Studies (http://www.fourhourworkweek.com/blog/2013/04/04/how-to-make-1000000-selling-e-books-tactics-and-case-studies/)

How I Used Hacker News to Sell My eBook (http://rubysnippets.com/2013/04/26/how-i-used-hacker-news-to-sell-my-ebook/)

An eBook pricing model that resulted in $100,000 in sales (http://blog.asmartbear.com/selling-ebook.html)

5 rules to sell thousands of copies of your ebook (http://mir.aculo.us/2012/10/20/5-rules-to-sell-thousands-of-copies-of-your-ebook/)

>Classes should therefore describe what something is, not how it's supposed to be presented.

That's what we used to think when Semantic CSS was the big buzzword, lots of articles from '08-'11 preached it as the gospel. Turns out when a language is based on customizing presentation, presentation is semantic.

> I had a number of locations that I highlighted with a blue background and rounded corners. I called it `location` since it highlighted each of the locations

> When I opened the online store, I had a list of products and wanted to highlight each product using the same design pattern. Problem was, they weren’t locations. They were products. Being the lazy developer I was, though, I just reused the `location` class and applied it to my products. Clearly not ideal (but hey, it worked)!

> The design function was, of course, to highlight something. That was what I should’ve called it!

https://snook.ca/archives/html_and_css/semantic-css

I thought the same. If this is true (it finds <a> elements then looks for the id), I've been writing a lot of poor-performing selectors.

Edit: I found that it does work this way, and the reason is because browsers process content and apply CSS top to bottom as it renders, they do not first load all the content and then apply CSS rules.

From http://snook.ca/archives/html_and_css/css-parent-selectors

If you have a rule like body div#content p { color: #003366; } then for every element—as it gets rendered to the page—it'll first ask if it's a paragraph element. If it is, it'll work its way up the DOM and ask if it's a div with an ID of content. If it finds what it's looking for, it'll continue its way up the DOM until it reaches the body.

a bunch of useful color links I've accumulated over the years:

tools

* https://dtrejo.com/colorslice/ - I made this b/c i wanted multi-color picking and good schemes from images and husl and multiple editable color formats

* http://speculo.co/ - preview colors on layouts

* http://tools.medialab.sciences-po.fr/iwanthue/ - colors for data scientists

* https://color.hailpixel.com/ - fun color picker

* http://tristen.ca/hcl-picker/#/hlc/6/1/20313E/EFEE68 - hcl picker

formats

* http://www.hsluv.org/ - human friendly hsl

a11y

* https://www.randoma11y.com/#/?_k=nm2tko - check color a11y

* https://snook.ca/technical/colour_contrast/colour.html#fg=33FF33,bg=333333 - contrast checker

Interesting link, but you're missing the point. The website even misses on their points. Most of the bad examples fit under an acceptable contrast ratio, by the standards given in their research, and even their good examples are not pure #000 or #fff. The w3c states that a minimum level of 3:1 works for people with 20/20 vision and 7:1 achieves the Triple-A standard. To show you what it looks like.

http://cl.ly/0J3Q210X142x1h2m1G2v

for reference http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html

and contrast tool http://www.snook.ca/technical/colour_contrast/colour.html