Issue #135 (Console API, JS Libs, RWD/Mobile, Productivity)
In case you weren't aware, WHATWG has a spec called the Console Standard, which "defines APIs for console debugging facilities." That is, it's an official set of standards for stuff like console.log() and console.clear(), that we've been using for ages for debugging our scripts.
The primary part of the document describes the various methods of the Console interface, which includes the following methods:
A few of these might be familiar to you but I'm guessing you haven't used (or even heard of) a lot of these (I've only used log() and clear(), to be honest). The good news is, Can I use has the Console API listed so you can see what browser support is like. There are quite a few notes on variations in support, so you can check those out if you are curious about support on different platforms.
The spec itself is a good starting point for learning about and experimenting with some of these lesser-known console methods, but here are a few more resources you can check out:
Now on to this week's tools!
"Fast 3kb React alternative with the same ES6 API. Components & Virtual DOM."
"The HTML5 2D+3D game maker."
"Use markup to create Virtual Reality experiences that work across desktop, iPhones, and the Oculus Rift."
Best name for a framework ever. "This project is designed to showcase the exact same functionality as Meteor, but without the monolithic structure. It trades a little simplicity for a lot of flexibility."
"Maps a REST API to an object data model."
"A collection of projects that make it easier than ever to create 3D voxel games like Minecraft all in the browser."
"A <2kb performant jQuery-like library born from the question: You might not need jQuery, then what do you need?"
ES6 library starter
"A boilerplate for a universal (Node, web, UMD) ES6 library."
"Want to use Vanilla JS but find native APIs a bit unwieldy? Bliss is for you."
RWD and Mobile Tools
Enter a website URL and this tool will spit out all the site's defined breakpoints from the media queries.
"Polyfill to remove click delays on browsers with touch UIs."
"A visual tool to show how responsive images behave across viewports in RWD."
Rapidly build mobile apps with this enterprise cloud-based app builder and MBaaS.
React Container Query
An implementation of "container queries" for React.
Comprehensive cloud-powered tools and services that will make your hybrid mobile app development process with PhoneGap/Cordova simpler.
Responsive Image Breakpoints Generator
"Easily generate the optimal responsive image dimensions."
"OS X Automator workflow for creating project folders structure for designers."
Google Analytics bot for Slack, to keep your team informed about metrics.
"Find out who tries to sell or steal your email address, combine all mass mailings into a single daily digest email, and stop giving out your email address online. A cleaner inbox means a happier you."
"A place for developers to share and save code snippets."
"Fast, free screen recording."
"Lets you put the output from any script or program right in your Mac OS X menu bar."
"The Master Key to your Phone, Laptop, Website Accounts, and more."
A Tweet for Thought
Designer Joel Califa has a tweetstorm for those opposed to unsolicited redesigns. Some valid points made here.
Suggestions / Corrections
Made something? Send links via Twitter @WebToolsWeekly (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
Before I Go...
Kudos to Victor Darras for this creative pure CSS game. Very difficult but I was finally able to make it through.
Thanks to all for subscribing and reading!