Programming news, cool libraries, and productivity tips by Dev Awesome.

// Dev Awesome #23

November 29, 2019

Dev Awesome

Welcome to Dev Awesome, the newsletter for awesome developers. This week we have another dose of interesting articles, tools and inspiration to supercharge your afternoon. Enjoy!

Articles & Tutorials

HTML isn't done! (Chrome Dev Summit Talk)

Some great ideas on how to improve HTML with new components, better customization, and accessibility features.

youtube.com

PHP 7.4 Released!

The new version inroduces great features like arrow functions, spread operator, class typed properties, and much more!

www.php.net

Build your own React

Advanced, step by step tutorial that follows React's architecture and recreates the main functionally from scratch.

pomb.us

Modern JavaScript features you may have missed

A quick recap of some of the more minor improvements to JS from the last couple of EcmaScript updates.

www.breck-mckye.com

Moving towards a faster web

Interesting article from the Chromium Blog highlighting new features that focus on site performance and faster loading times.

blog.chromium.org

Libraries & Tools

Instant Page - Speed up page loading times by prefetching links

This popular library prefetches pages when a user hovers on them. With the newly released v3.0 update, it can now also load all links in a page upfront.

github.com/instantpage/instant.page

Geolib - Powerful, no-dependencies JS library for geospatial operations

This geographic library offers a lot of interesting methods for calculating distance, converting metrics, getting coordinates and much more.

github.com/manuelbieh/geolib

Screenshot to Code - Transform design mockups into a static website

Neural network that analyzes design images, breaks them down into HTML components, and renders a Bootstrap-based static website of the design.

github.com/emilwallner/Screenshot-to-code

Linkinator - Find broken links in your website

Simple site crawler tool for checking if all the links in your website are active and don't lead to any 404s.

github.com/JustinBeckwith/linkinator

Fabric.js - Framework for the HTML5 canvas element

Easily create and manipulate shapes in the canvas element, convert to SVG and vice versa!

github.com/fabricjs/fabric.js

Inspiration & Design

Illustrations - Open source illustrations kit

A collection of SVG and PNG illustrations, all completely royalty free. Contains a wide array of topics, from animals to tech.

illlustrations.co

CSS Grid: Restaurant Website

Retro-styled restaurant menu that showcases the amazing layout building power of the CSS grid.

codepen.io

Scrnshts - Hand-picked collection of app store design screenshots

This huge list of app store entries contains designs from both big companies and indie devs. Everything is well curated and fun to browse.

scrnshts.club

UI Case study: state styles of card component

A deep dive into the process of designing components with accessibility in mind.

blog.prototypr.io

Pure CSS Russian Bears

Impressive CodePen demo powered by SVG and CSS variables - no JS involved!

codepen.io