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

// Dev Awesome #29

March 6, 2020

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

Google PageSpeed Insights: The Truth About Scoring 100/100

Lots of great tips on which speed metrics matter most and contribute to your website's performance in a significant way.

kinsta.com

Styling The Good Ol' Button Element

Excellent article on how to use buttons in your design and style them so that they look great in all browsers.

ishadeed.com

Make Your Test Fail

Important advice on how to write unit tests that will thoroughly check your code for errors and avoid common gotchas.

kentcdodds.com

Fixing Memory Leaks In Web Applications

This article does a great job at explaining what exactly memory leaks are, why they are important, and how to fix them.

nolanlawson.com

Let's Define CSS 4

Super interesting discussion on the future of CSS and whether we should put version numbers on web languages.

github.com/w3c/csswg-drafts/issues/4770

Libraries & Tools

Electron React Boilerplate - A starter kit for cross-platform apps

Nice GitHub project that offers a solid foundation for developing desktop JS apps. Includes Electron, React, Redux, Webpack, hot loading, and much more.

github.com/electron-react-boilerplate/electron-react-boilerp...

Rome - Experimental JavaScript toolchain from the Facebook team

A full ecosystem for working with JS code, consisting of a compiler, linter, formatter, bundler, and testing framework. Each tool is created from scratch specifically for Rome.

github.com/facebookexperimental/rome

Panolens - JavaScript panorama viewer

Create beautiful 360° panorama experiences for the web. The library is based on Three.js and has great performance, even when showing high-quality photos or videos.

pchen66.github.io/Panolens/

Hex Engine - Modern 2D engine for browser games

Powerful game development toolkit, featuring a Canvas-based rendering engine, physics and sound helpers, gamepad support, integrated dev tools, and more.

github.com/suchipi/hex-engine

Chardin.js - Overlay instructions for your apps

Cool jQuery plugin for creating overlay guides that explain the UI and show the various app features.

github.com/heelhook/chardin.js

Inspiration & Design

CSS.gg - Over 500 customizable icons

Really great project with a huge number of icons and awesome features such as multiple install options, easy customization, a great app for browsing the collection, and more.

github.com/astrit/css.gg

Pure CSS Claw Crane on CodePen

Impressive CodePen of a working claw machine built without any JS code and made possible thanks to some very smart use of CSS.

codepen.io

Shadows - Great CSS shadow generator

One of the most powerful CSS shadow generators we've seen, this app offers a nice UI for dialing in the various shadow settings.

brumm.af

Task Management Dashboard UI

Beautifully designed dashboard interface for a notes & tasks app.

codepen.io

Void Merge 2048 - A fun spin on the original 2048 game

This super fun web game is created using standard web technologies, WebGL and Three.js.

birslip.itch.io