Web Tools Weekly
What a Tool!

Issue #334  (Method on Number, Frameworks, Testing, Jamstack)12/12/19

Believe it or not, the following three lines of JavaScript do not contain a syntax error, but will return the results displayed in the comments next to each line:

console.log(52..toString()); // "52"
console.log(76..toExponential()); // "7.6e+1"
console.log(345..valueOf()); // 345

What's strange in the above code is the fact that I've included two dots in between the numbers and the methods. You can try it on CodePen.

This is not really something you would ever do, to be completely honest. Or at least, it would be very rare. You don't normally call a method directly on a number without first storing the number in a variable (possibly after having it dynamically produced elsewhere in the code).

As explained on JavaScript.info, if you don't include the second dot, the JavaScript interpreter sees the dot as a decimal place and will throw an error. The second dot signals that there is no decimal place and so the method can safely be called.

Useful? Not necessarily, due to how rare it is to have to call a method directly on a number like this. But consider this just another one of those interesting and little-known facts about how JavaScript works.

Now on to this week's tools!

Front-end Frameworks

JavaScript for Beginners (Video Course)
50% off during course launch! A fun, exercise heavy approach to learning Modern JavaScript from scratch. This might be Wes Bos's best course yet!   promoted 

A flexible, simplicity-first, Vue-based server-side rendering framework.

Build responsive, mobile-first, and ARIA accessible projects using Vue.js and the world's most popular front-end CSS library.

Lambda API
Lightweight web framework for AWS Lambda using API Gateway, for building serverless applications.

React Spaces
React components that allow you to divide a page or container into nestable anchored, scrollable, and resizable spaces.

A CSS Grid-based framework that promotes re-usability and has support for Apple WatchOS.

A small, blazing fast, reactive UI library.

React Suite
Now at version 4+. A set of developer-friendly React component libraries for enterprise system products.

Ara Framework
Build Micro-frontends easily using Hypernova, a tool for rendering JavaScript views on the server.

A starter kit to build cross-browser web extensions (Chrome extensions, Firefox plugins, etc).

Adobe's design system of components, patterns, etc.

Testing and Debugging Tools

Tech Productivity
A brief weekly newsletter for tech professionals. Features articles, tips, and tools for improved productivity.   promoted

A faster, easier alternative to Chrome's DevTools inspector. Lets you inspect styles 5x faster, edit CSS in real time, and more. (Use coupon code webtoolsweekly for 25% off).

Official ESLint plugin for Vue.js. Allows you to check the `template` and `script` components of .vue files with ESLint.

Browser Default Styles
Enter an HTML element and this page will display the default CSS for that element in different browsers. Handy!

Service that integrates with Google Search Console API to help you identify ways to increase keyword relevancy on your pages.

Aggregates and tracks changes in your production environments. Maintain a full audit trail of organization-wide changes in one single location, for faster debugging.

Who Can Use
Enter a foreground/background color combo and this tool will tell you which vision type will find that combo usable or accessible.

Epilepsy Blocker
Figma plugin and Chrome/Firefox extension to help you increase your website's accessibility, particularly for photosensitive users.

Front-end review for the whole team. Spin up environments for every branch automatically, gather team feedback earlier in the dev cycle, without dependencies or browser extensions.

HTML linter for Bootstrap projects.

CMS's, Site Builders, Static Sites, etc.

Tech Productivity
A brief weekly newsletter for tech professionals. Features articles, tips, and tools for improved productivity.   promoted

Still in early development. The ultimate static generated documentation theme for the JAMstack.

Mac app, now at version 3.4. Fast, easy to use, and powerful visual web design software that lets you create responsive websites without writing code.

A Hugo theme for ambitious documentation projects.

Fast simple hosting for files and websites. Easily manage files in your cloud storage and deploy them to an enterprise-grade global CDN.

JAMstack CMS
The modern full stack CMS. Built with GraphQL, AWS Amplify, and serverless technologies.

A component-based WordPress starter theme with a drag-and-drop backend interface and prebuilt mobile-first boilerplate components.

MailChimp Websites
A no-coding necessary website building tool from MailChimp.

An open-source site editing toolkit for React-based frameworks — Gatsby and Next.js.

A Tweet for Thought

Programming depicted in movies is never like this.

Send Me Your Tools!

Made something? Send links via Direct Message on 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...

Simple Opt Out is a one-stop resource for finding links to the opt-out section of various websites and services, so you can opt out of data sharing and similar marketing practices.

Thanks to all for subscribing and reading!

Keep tooling,