Animations

[Skythrill256]

Just out of curiosity, I want to ask whether we can build 3d websites with leptos? I am from javascript background and I learnt rust recently and I found leptos and wasm quite interesting and want to make my hands dirty, as I want to showcase a leptos project in a hackerthon, if exists can anyone help me out how can we implement 3d websites assuming I am using tailwind.

[diversable]

depending on how much 3D you really want on your site, you may just end up using WebGL or the still-experimental WebGPU..

so you're basically still just using the <canvas> element to create a 3D context to work with; once inside the 3D context, you'll be using tools other than Leptos / Tailwind to make your 3D content.

See:

• https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API
• https://developer.mozilla.org/en-US/docs/Web/API/WebGPU_API

It is possible to use something like Bevy in Rust to build 3D content you can display on a Leptos website, but that hasn't actually been done b/f afaik.

Hope that helps..

[Skythrill256]

Thanks for sharing the information 😊, but can I take reference here?

https://www.reddit.com/r/rust/comments/16dbxvg/can_bevy_and_leptos_interoperate/

[JonathanPlasse]

https://bevy-cheatbook.github.io/platforms/wasm.html

[diversable]

Thanks for sharing the information 😊, but can I take reference here?

https://www.reddit.com/r/rust/comments/16dbxvg/can_bevy_and_leptos_interoperate/

Rather than having parts of your game in html (Leptos) and parts in Bevy, it's probably easier to build the entire game in Bevy and just use Leptos for the surrounding UI.

Getting the 2 to interoperate is likely possible in the way the Redditor suggests, but I doubt that would be the easiest way to build a 3D animation for the web.

Also, it doesn't have to be Bevy - it can be anything that can be thrown into a <canvas> element..

(see here for a different type of experiment combining Bevy and Leptos: https://github.com/NiklasEi/cinnog)