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

// Dev Awesome #35

June 19, 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

Stranger Things, JavaScript Edition

An exploration into some of the weirdest JavaScript quirks, bugs, and unexpected behaviours.

livecodestream.dev

The complete guide to CSS media queries

As the title suggests, this is a very thorough tutorial on media queries covering every possible property, including upcoming features.

polypane.app

Reusing UI components at an enterprise level

Very interesting article by the PayPal team on how to handle component sharing across large apps and whole ecosystems.

medium.com

JavaScript Questions

In this GitHub repo you can find a long list of JS questions and their explained answers. A very fun way to test your skills and learn something new.

github.com/lydiahallie/javascript-questions

SEO Cheat Sheet

Nice collection of best practises for writing code that helps your projects rank higher in search engines.

9elements.com

Libraries & Tools

Bootstrap 5 alpha now available!

The next major Bootstrap release seems very promising. You can try out the alpha and learn more about it form this blogpost.

blog.getbootstrap.com

Grid.js - Advanced Table Plugin

Great open-source library for working with HTML tables. It has a nice API and can be easily integrated with JS frameworks like React and Vue.

github.com/grid-js/gridjs

NJT (npm jump to) - Explore npm packages

Quickly go to an npm package docs, GitHub repo, homepage or other link, right from the terminal or the browser URL bar.

njt.now.sh

ConsoleImg - Display images in the browser console

This fun JS project lets you fetch images and render them in the developer tools console (on browsers that support it).

github.com/workeffortwaste/consoleimg/

New.css - A classless CSS framework

Tiny CSS library that gives your pages a pretty stylesheet base that looks better than the default browser styles.

github.com/xz/new.css

Inspiration & Design

Color Copy Paste - Grab colors directly from your camera

Cool open-source app that lets you open your phone's camera, select a color from the viewfinder and export it to the Figma, Sketch or the web.

colorcopypaste.app

The Codepen Times - Newspaper layout with CSS grid

This great CodePen show us how the CSS grid can be used to create tricky HTML layouts that would be almost impossible otherwise.

codepen.io

Yet Another Doom Clone (In 13kb of JavaScript)

Impressive Doom-style game created in under 13kb, plus a nice tutorial on how it was done.

nicholas.carlini.com

ScrollTrigger - Interesting scroll animation on CodePen

The demo was created using the GreenSock engine and showcases some more complicated on-scroll animations.

codepen.io

Scrnshts - Hand-picked collection of app store design screenshots

Large curation of app store entries containing designs from all kinds of apps, from Fortune 500 companies to indie developers.

scrnshts.club