-
For the image, you are able to either use your webcam to take a photo, or upload a photo of your own before moving onto the filters. Image filtering is included in most image manipulation libraries. I had used ImageMagick before, but had a terrible time with it. I wanted to find a better way to do Instagram-like filtering. I came across Photon, a high performance image processing library written in Rust and can be compiled to WebAssembly, and there was already a React demo so it was easy to integrate. Once you choose the filter you want, you move onto the decoration stage.
-
Civic Auth
Auth in Less Than 5 Minutes. Civic Auth comes with multiple SSO options, optional embedded wallets, and user management — all implemented with just a few lines of code. Start building today.
-
For more info on Purrybooth please try out the app for yourself at purrybooth.com, and check out the code on github.com/rachelnicole/purrybooth. For more info on Datadog Real User Monitoring, check out Datadog's RUM documentation.
-
This was the trickiest part to solve! I knew I needed to use a canvas element, and I would be placing the filtered image as the background, but I also needed a way to add the stickers. I ended up using Fabric.js to achieve this, with some additional custom interactions I had to integrate—such as changing the z-index of the stickers and the capabilities for removing them. Once you’re done decorating with the stickers, you go to the final page where the canvas is rendered as an image, which you can save and share with your friends.