
React-sky: easy animated backgrounds - lucagez
https://github.com/lucagez/sky
======
onion2k
Great idea. :)

I'm working on something vaguely similar but for foreground effects -
[https://github.com/onion2k/react-neon/](https://github.com/onion2k/react-
neon/) \- it's a library that adds a canvas over a component with an
interactive effect. It's very early, and Chrome only because it relies on
ResizeObserver (but that's going to change to use Mutation Observer very
soon).

I added an example that puts Inigo Quilez's WebGL raymarched clouds on a
fullscreen canvas yesterday. It makes my iMac sound like a jet engine.
[https://react-neon.ooer.com/fullscreen/clouds/](https://react-
neon.ooer.com/fullscreen/clouds/)

------
lucagez
react-sky is a react component that makes super easy the creation of animated
backgrounds. Just pass some images and react-sky will do the job!

Live demo:
[https://codepen.io/lucagez/full/oQoRyK/](https://codepen.io/lucagez/full/oQoRyK/)

------
mr_ali3n
Nice, but why do you need react for this?

~~~
onion2k
You don't, but it makes it easier to integrate in to some existing code.
Usually these libraries are written for personal reasons (eg needing it
yourself) and then open sourced. If you're making a React app at the time then
it ends up being a React library.

One day I'm going to 'un-React' Neon (see my other comment), but until then it
'needs' it.

~~~
lucagez
Exactly that (:

------
kentms
Nice. Would be great if I could set a background image as well :)

~~~
lucagez
You can! You can pass also the props "background" and in it you can pass a
regular URL

~~~
kentms
Great. Thanks.

