🎥Learn how to animate a camera flying through your creations using @theatre_js & React Three Fiber in this new #tutorial by @AndrewPrifer at @codrops
#frontend #webgl #threejs #animation #3d #webdevelopment #r3f
#tutorial #frontend #webgl #threejs #animation #3d #webdevelopment #R3F
Together with @2xAA I founded the band #iieinander in 2021 and yesterday we finally released our website with some basic info AND our super cool logo in 3D using #r3f combined with a custom #glsl #shader (#fbm #noise).
It's also my second learning project for #nextjs and #react. I used #mui v5 for the first time here, to have some default components that just look good.
:owi: https://iieinander.band :perfect:
Next feature: Upcoming shows!
#iieinander #R3F #glsl #shader #fbm #noise #nextjs #react #mui
360° viewer in #threejs + #R3F using an #equirectangular #image
```
import { OrbitControls, Environment, useTexture } from '@react-three/drei';
import * as THREE from 'three';
export default function Equirectangular() {
const texture = useTexture(`/image.jpg`);
texture.mapping = THREE.EquirectangularReflectionMapping;
return (
<>
<Environment background map={texture} />
<OrbitControls />
</>
);
}
```
(Just putting this here as I always forget how it works 😅)
#threejs #R3F #equirectangular #image
gm from within @elk
I had some time off with the family and spend the last days learning #ReactThreeFiber #R3F with the help of https://threejs-journey.com by Bruno Simon. I'm not done yet with all the material, but my goal is to start with my new project in January. So you can expect to see some live streams over at https://www.twitch.tv/NERDDISCO as I want to document all the steps of building my new project.
#fungiverse
```toml
```
#ReactThreeFiber #R3F #fungiverse
Only partially learnt it but got a point cloud from a mesh and animated transitions with #r3f . Did want too animate between two shapes but got a little confused about how to pass the second position as an attribute?
#R3F #GENUARY #genuary2023 #genuary13