Skip to content

jonothanhunt/jonothan-site

Repository files navigation

Jonothan.dev

Sreenshot of jonothan.dev

This is my website, created with React and React Three Fiber (which is a React renderer for three.js).

Setup

After cloning this repository, you can install packages and run the dev server:

yarn
yarn dev

How it's put together

Vite which is a fabulous dev server (with insanely fast Hot Module Replacement!).

Recently switched from three.js to using React Three Fiber (R3F), which works really well with React (and can even outperform three.js on its own!).

Use of a bunch of very useful helpers and R3F abstractions from Drei.

Generally the interesting 3D stuff is in src > components > experience and any shaders are in src > shaders.

On the to-do list

  • Give experience clearer ARIA descriptions for screen readers and the like
  • Add comments to all the new code since adopting R3F
  • Optimise canvas and shader performance for mobile
  • Centralise heavy useFrame usage across components that use live values eg. mouse and scroll.
  • Change sampling and size of stickers to make them easier to read on smaller screens.
  • Change the way rotation is controlled in the scene (right now it's a bit per / element and it could be mostly one central component)
  • Probably a lot React optimisation generally!

About

My website built in React and Three.js with R3F.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages