I would like to keep track of new things that I randomly discover while working on my projects. And why shouldn't I do that publicly? That way everyone gets something out of it 😊
Welcome to Volume #1, here we go:
1. Potree
Portree is a WebGL based point cloud renderer. A tool to visualize a bunch of points in a 3D dimensional space. I never thought much about this topic, but I understand that this must be a thing.
I had my fun playing around with the demo. 😂
https://github.com/potree/potree
2. Blob urls with HTML content
I used blob urls before to generate .stl files for my experimental 3D-printing website stl.parts.
But lately I found out that you can also create a blob url to a text/html file that can be opened in the browser. This way you can create a link that opens a page that is only temporarily available in your browser. That also means that the url of that page can not be shared.
A website hosted by your website so to say 😂
Here is a code example:
let htmlBlob = new Blob(['<html><head><title>This is website</title></head><body><h1>Hello World!</h1></body></html>'], {type: 'text/html'});
let blobUrl = URL.createObjectURL(htmlBlob );
The url will be invalidated if the page that created the object url is closed.
3. react-three-fiber
You probably know about three.js, react-three-fiber is a super intuitive way to integrate 3D objects into your React application.
It's like jsx for 3D objects, I love this idea and can't wait to use it. This is a code example so you get an idea 😋:
createRoot(document.getElementById('root')).render(
<Canvas>
<ambientLight />
<pointLight position={[10, 10, 10]} />
<Box position={[-1.2, 0, 0]} />
<Box position={[1.2, 0, 0]} />
</Canvas>,
)
You can play around with it here or get started by reading the introduction.
If you would rather watch a YouTube video, I liked this one:
4. Theater.js
Theater.js can help you change values over time. And it does this by providing you with an intuitive After Effects like interface to animate the values on a timeline.
I hope you like it and let me know if you found anything particularly interesting. And also if you have something that inspired you in the last time.
Happy Coding 🖥️❤️!
Top comments (0)