About the project

I wanted to create a website to showcase and summarize my web development journey, so I came up with this minimalistic design.

Features

the website contains main hero 3D scene using Spline and React three fiber. This scene is the part of the layout of the main page, the projects page and posts page, but not inside the specific project/post page.

• In addition, I also built on top of Draft.js a rich text editor (view in images).
• The editor is a part of the creation of posts/projects.
• The editor is also used for editing existing projects/posts.

The website is mostly server side rendered, except for the scene parts and the editor, and is using route handlers to help with data caching.

Process

• the database is based on MongoDB Atlas, connected with Prisma for comfort.
• I edited a 3D scene using Spline website and exported it as react three fiber code, it was really nice and easy process.
• For the editor, I used Draft-JS, and styled it with tailwind for my needs. (you can test the editor yourself in here )