💻 #64: Build a 3D website with Three.js 🔮

Learn to add 3D elements to your websites with three.js

Jan 06, 2023

Happy Friday and Happy New Year developer! 👋

This weekend’s tutorial will really level up your web development skills by teaching you how to create beautiful 3D objects. You can then add a 3D object to your future project or portfolio as a great way to stand out.

Let’s get started!

Tutorial of the week:

Length: 1 hour
Difficulty: Beginner

This weekend’s tutorial is by DesignCourse, they create incredible UX/UI tutorials.

What you’ll learn this weekend:

Three.js 🔮

3 creative projects of the week:

1. Vole - Perfect Circle

Here’s a neat front-end game. Try drawing a perfect circle around this white dot. I’m using a trackpad, but I wonder if it’s easier with a mouse?

Check it out!

2. Bruno Simon

Three.js

Keeping the theme of this weekend’s tutorial, this developer turned their personal site into a 3D interactive browser game. It’s absolutely outstanding.

Check it out!

Here’s also a video demo of the site in case you’re on mobile or it’s not loading for you:

3. Ramen Shop Resume

Three.js

Check out this interactive personal website that takes you around a ramen shop to show off projects, articles, and about me sections! Really well done Jesse!

Check it out!

I teamed up with Udemy to bring you a discount as a new user. If you’re looking to grab a course on web development courses start at $14.99! Click here to get your first course for $14.99