Collective #554
Publikováno: 3.10.2019
Preact X * Framer Guide to React * Inertia.js * Same-Site Cookies By Default * react-genie
Collective #554 was written by Pedro Botelho and published on Codrops.

Inspirational Website of the Week: Rand
A beautifully fluid web experience with a unique design. Our pick this week.

Framer Guide to React
An e-book for learning React and ES6 by Koen Bok.

Sara Soueidan on Applied Accessibility
In this SmashingConf session — a series of macro case studies from real client projects — Sara shares some frustrations, many lessons learned, and a lot of practical tips and tricks for building accessible front-end foundations that you can take and apply in your own projects right away.

The Ultimate WordPress Page Builder
You’ve never built a WordPress website like this before. Divi is more than just a WordPress theme, it’s a completely new website building platform that replaces the standard WordPress post editor with a vastly superior visual editor.

Preact X – Virtuous DOM and the Fragments of Suspense
Read about the release of this fast 3kB React alternative with the same modern API, components and Virtual DOM.

react-three-fiber
Version 3 of the React renderer for Three.js is out.

CTRL-Z Flyer
An amazing interactive party flyer for CTRL-Z made with Three.js. Click and drag to glitch.

Building a Scrapbook Layout with CSS Grid
A tutorial by Michelle Barker on how to create a scrapbook layout using CSS Grid.

Inertia.js
Inertia.js lets you quickly build modern single-page React, Vue and Svelte apps using classic server-side routing and controllers.

Video Shorts from Mozilla Developer
Read about the new resource from Mozilla Developer for people who build the web.

Same-Site Cookies By Default
Read about Chrome’s team clever and bold plan to change the recipe for cookies. By Eric Lawrence.

Terseness tension
Read why Christian Heilmann started not believing in short code as a goal any longer.

Reverse Knockout Text Mask Effect with SVG
A simple approach for knocking-out portions of an image with text.

A Modern CSS Reset
Andy Bell shares a minimal CSS reset of sensible defaults.

The league of evil designers
Linnéa Strid tells the uncomfortable truth about “evil” designers.

Download Button Animation
Some amazing animations for download buttons made by Aaron Iker.

react-genie
A set of React components for animating elements as they scroll into the viewport.

JAMstack Themes
A growing list of themes and starters for JAMstack sites.

Interior Visualization
Showcase of illumination possibilities using WebGL and made with PlayCanvas.

fBM
Inigo Quilez tackles a very complex, beautiful topic: Fractional Brownian Motion. It’s one of the most popular constructs for procedural modeling of nature.

Animated Icons
Add user delight to your site with this free pack of 166 animated icons in JSON (Lottie), GIF, and After Effects formats.

Jake Quits
Jake Albaugh made this site to keep track of how long he has been free of nicotine.

Simulating Depth of Field with Particles using the Blurry Library
Learn how to create a geometrical scene with a depth effect using the Blurry library.
Collective #554 was written by Pedro Botelho and published on Codrops.