Weekly web development resources #69
Tags: weekly, webdev
Published: 2021-04-14 05:29:41



______

##[Coolify](https://coollabs.io/coolify)
[![Coolify](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/coollabs.jpg)](https://coollabs.io/coolify)
An open-source, self-hostable Heroku & Netlify alternative.

______

##[React + D3.js](https://wattenberger.com/blog/react-and-d3)
[![React + D3.js](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/react-and-d3.jpg)](https://wattenberger.com/blog/react-and-d3)
An article on how to combine the two technologies to visualize data.

______

##[Fontshare](https://www.fontshare.com/)
[![Fontshare](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/fontshare.jpg)](https://www.fontshare.com/)
A free fonts service with a growing collection of professional grade fonts that are free for personal and commercial use.

______

##[Gradient Generator](https://learnui.design/tools/gradient-generator.html)
[![Gradient Generator](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/gradient.jpg)](https://learnui.design/tools/gradient-generator.html)
A generator for linear gradients, radial gradients, and conic gradients that can be exported as CSS or SVG image.

______

##[moovie.js](https://mooviejs.com/)
[![moovie.js](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/moovie.jpg)](https://mooviejs.com/)
An open-source, movie focused HTML5 Player.

______

##[CSS Filters Generator](https://justcode.today/filters/)
[![CSS Filters Generator](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/guru-og-tw.jpg)](https://justcode.today/filters/)
Generate cross-browser CSS rules to modify images hue, saturation, brightness, contrast and other.

______

##[Advanced React pattern - Compound Component](https://itnext.io/compound-component-advanced-pattern-react-libraries-love-fea7a730bb73)
[![Advanced React pattern - Compound Component](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/react-pattern.jpg)](https://itnext.io/compound-component-advanced-pattern-react-libraries-love-fea7a730bb73)
A React pattern that allows writing complex components in a clean and declarative way.

______

##[Swipey image grids.](https://www.cassie.codes/posts/swipey-image-grids/)
[![Swipey image grids.](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/swipey-image-grids.jpg)](https://www.cassie.codes/posts/swipey-image-grids/)
A nice article on how to use SVG animations for an image grid.

______

##[How to design almost any UI element](https://twitter.com/vponamariov/status/1381584285300359169)
[![How to design almost any UI element](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/ui-elements.jpg)](https://twitter.com/vponamariov/status/1381584285300359169)
A curated list of 58 articles in a Twitter thread.

______

##[Cheat Sheet Maker](https://cheatsheet-maker.herokuapp.com/)
[![Cheat Sheet Maker](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/cheat-sheet.jpg)](https://cheatsheet-maker.herokuapp.com/)
A web application to create and share markdown based cheat sheets.

______

##[party.js](https://partyjs.yiliansource.dev/)
[![party.js](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/69/partyjs.jpg)](https://partyjs.yiliansource.dev/)
A JavaScript library to brighten up your user's site experience with visual effects.

______

To see all the weeklies check: [wweb.dev/weekly](https://wweb.dev/weekly)