Collective #632
![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_copying.jpg?x86293)
Copying is the way design works
Matthew Ström's in-depth exploration into why designers have such a complicated relationship with copying.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_Design.jpg?x86293)
Get a Free .design Domain Name Today!
A .design domain name allows you to create a more succinct, powerful, and elegant URL and email address. Get 1-year for free today.
Get it today![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_audio.jpg?x86293)
Getting Audio Visualizations working with Web Audio API
A great tutorial by Dwayne Harris on how to create an audio visualization based on the Web Audio API.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_cursor.jpg?x86293)
pet_cursor.js
Pet cursor (Neko cursor) is a simple JavaScript file that turns your website's cursor into a cute animated pet. By Nathalie Lawhead.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_xss.jpg?x86293)
How to sanitize third-party content with vanilla JS to prevent cross-site scripting (XSS) attacks
Chris Ferdinandi takes a look at how XSS attacks work and how to prevent them.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_commentbox.jpg?x86293)
How to Build an Expandable Comment Box
Learn how to recreate the Medium comment box from scratch using React Hooks.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_voxiom.jpg?x86293)
Voxiom.io
A WebGL game inspired by Minecraft, Fortnite, Counter Strike, and Call of Duty. Read more about it here.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_art.jpg?x86293)
Painting With the Web
Matthias Ott shares his thoughts on why designing and building for the Web should be more playful.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_.jpg?x86293)
Setting Up Netlify Forms: In-Depth Tutorial
This tutorial shows how Netlify Forms makes it easy to handle contact forms.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_supershape.jpg?x86293)
Supershape
A beautiful demo where you can adjust the parameters of a shape made by Arnaud Di Nunzio.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_dogbrowser.jpg?x86293)
Writing a dog picture browser in ~200 lines of code
Christian Heilmann shows how he built a fun dog picture browser using the Dog.ceo API.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_reacthooks.jpg?x86293)
Algebraic Effects for React Developers
Reese Williams on building a mental model for React Hooks.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_figma.jpg?x86293)
Bridging design and code with Variants
Read about Variants and updates to the Inspect panel of Figma that will help power up your design system.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_stories.jpg?x86293)
Stories for VSCode
An extension that allows you to share Instagram-style stories from within Visual Studio Code. By Ben Awad.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_cssanim.jpg?x86293)
How to make CSS Animations
Patrícia Silva's interactive guide to CSS Animations.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_jsscraping.jpg?x86293)
Web scraping with JS
Pavel Prokudin shows how to use ES2020, node, and browser APIs for web scraping.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_jquery.jpg?x86293)
Looking deep to have a big influence
Some very interesting insights from a jQuery maintainer.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_cssgrid.jpg?x86293)
Native CSS Masonry Layout In CSS Grid
There is now a specification for native CSS masonry layout, as part of the Grid Layout spec. In this article, Rachel Andrew explains how it works with the help of a couple of demos you can try out in Firefox Nightly.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_svelte.jpg?x86293)
Svelte rendering and SEO
How do you handle SEO with Svelte? Julien Maury explains.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_patterns.jpg?x86293)
Micro Frontends Pattern Comparison
Comparing build-time integration, server-side integration, run-time integration via iframes, and run-time integration via script.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2020/11/C632_formstyling.jpg?x86293)
How to Build HTML Forms Right: Styling
Part of a series on HTML form design patterns, common gotchas, and CSS tips.
Read it