Spellbook of Modern Web Dev

Spellbook of Modern Web Dev is a collection of 2,000+ carefully selected links to resources on anything web development related.  It covers subjects from Internet history and basics of HTML, CSS, and Javascript, all the way to tools, libraries and advanced usage of web technologies, and more; from network protocols and browser compatibility to development environments, containers, and ChatOps.

  • This document originated from a bunch of most commonly used links and learning resources I sent to every new web developer on our full-stack web development team.
  • For each problem domain and each technology, I try my best to pick only one or a few links that are most important, typical, common or popular and not outdated, base on the clear trendspublic data and empirical observation.
  • Prefer fine-grained classifications and deep hierarchies over featureless descriptions and distractive comments.
  • Ideally, each line is a unique category. The ” / “ symbol between the links means they are replaceable. The “, “symbol between the links means they are complementary.
  • I wish this document could be closer to a kind of knowledge graph or skill tree than a list or a collection.
  • It currently contains 2000+ links (projects, tools, plugins, services, articles, books, sites, etc.)

On one hand, this is one of the best single resources on the topic of web development that I’ve seen in a very long time.  On the other hand, it re-confirms my belief in “there is no such thing as a full-stack web developer”.  There’s just too many levels, and there’s too much depth to each level for a single individual to be an expert at.  But you get bonus points for trying.

React vs Angular vs Ember vs Vue.js

Following the yesterday’s post on WordPress choosing the JavaScript framework, here comes a rather extensive review of React, Angular, Ember, and Vue.  This one looks at the four frameworks from different perspectives, provides feature lists, and has a tonne of links to external resources for more information.

Choosing a future JavaScript framework for WordPress

WordPress in general, and Matt Mullenweg in particular have been pushing for JavaScript for a while now.

So, it’s not surprising that WordPress developers are chatting about the JavaScript framework that they’ll use for the WordPress core JavaScript needs.

The discussion is far from finalized right now, so it’s particularly interesting to see how it develops, both in IRC/Slack chatrooms and in Make WordPress p2 comments.

So far, there are two primary contenders – React and Vue.  I have zero experience with either one (or pretty much with any JavaScript frameworks, trying to avoid JavaScript as much as I can), but I’m still interested in the reasoning that goes behind the choice, especially so, from the people who know so much in this domains.

How to use Emerge to make your website load nicely

Ilya Birman explains how to use Emerge to make your website load nicely.  Emerge is a JavaScript library that he wrote to help with coordinated loading of the page elements.  The library is not free, but the license fee is very reasonable.

The examples and documentation look good.  I don’t remember seeing something similar, but then again I’m not actively involved with JavaScript these days.

HTML Canvas Tutorial

Skilled.co put together this HTML Canvas Tutorial, which covers the HTML 5 <canvas> functionality, that allows web developers to draw all sorts of graphics on the fly, using JavaScript.  The tutorial is available for download in PNG and PDF formats, as well as on the webpage, and it covers the following:

  • Shapes
  • Styles and color
  • Text
  • Images
  • Transformations
  • Compositing and clipping
  • Animation
  • Pixel manipulation
  • Hit regions and accessibility

It also provides a few useful tips, inspiration, and links to other resources.

Web Developer Tools from Browserling

browserling-effortless-cross-browser-testing

Browserling – an awesome cross-browser testing service, has a collection of Web Developer Tools, which are as simple to use as possible.  There are now more than 80 (!!!) tools, according to this Peteris Krumins blog post, that provide immediate help with things like converting dates and times, formats like CSV, JSON, Markdown, HTML, XML, etc, generating passwords, minimizing or prettifying HTML, CSS, JavaScript, and more.