Collective #402
Inspirational Website of the Week: The Mads
Smooth animations with playful interactions made us pick "The Mads" this week.
Get inspired
Mobile Authentication Simplified
With 5 minutes and a few bits of config, you can build an app connected to OpenID, Active Directory, OAuth2 or SAML.
Learn more
Tabler
A well designed dashboard template with a responsive and high quality UI.
Check it out
JavaScript in 14 minutes
A fantastic little guide that will get you started with the most important JavaScript concepts in an interactive way.
Check it out
Storyboarder
A great tool to create story visualizations in a quick and easy way.
Check it out
Solar System Explorer in CSS
A fantastic demo by Jamie Coulter where you can explore the planets and moons of our solar system in pure CSS.
Check it out
Spatial Hash Canvas Particles
An experiment by Jack Rugile where he explores a basic spatial hash to reduce the amount of collision calculations.
Check it out
Plot Parade
A d3.js powered artsy chart generator by Krisztina Szűcs.
Check it out
Eggradients
Ready to use, trendy background gradients in the shape of eggs and with witty names :)
Check it out
Unit Testing in JavaScript
A tutorial by Tania Rascia where you'll learn how to perform unit tests on JavaScript with Mocha by developing a calculator app in Node.js.
Read it
LagRadar
A tool for tracing when your app drops below 60fps. By Ben Birch.
Check it out
Variable Fonts
A great tool for discovering and trying variable fonts.
Check it out
How display: contents; Works
An article by Ire Aderinokun where she explains the interesting "contents" value of the display property in CSS.
Read it
Working with the new CSS Typed Object Model
Eric Bidelman explains the new API for CSS that allows to work with values in JavaScript.
Read it
Mobbin
Get inspiration for the latest mobile design patterns from this curated gallery.
Check it out
How to create the snake highlight animation with anime-js
Mikael Ainalem's tutorial on how to create an SVG highlight line animation.
Check it out
Hotspot 3D
A great way to compare smartphones. Made with WebGL.
Check it out
Google publishes a JavaScript style guide. Here are some key lessons.
Daniel Simmons summarizes the most interesting and relevant rules from Google's JavaScript Style Guide.
Read it
Video Music
An arpeggiator that is controlled by the average hue from your camera. By Jake Albaugh.
Check it out
Introduction to Viewport Units
Jen Simmons shows you how CSS viewport units can be used in creative ways.
Watch it
Learn Bootstrap 4 for free
A great course with 10 interactive screencasts that will teach you Bootstrap 4. Read more about it in this article.
Check it out
ES modules: A cartoon deep-dive
Lin Clark takes a look at what problem ES modules solve and how they are different from modules in other module systems.
Read it
Creating Accessible HTML: A Crash Course in ARIA Landmark Regions
Genevieve Nelson explains some useful details of ARIA Landmark Regions.
Read it