Tech Stack
Next
TypeScript
Tailwind CSS
GraphQL
Contentful
Vercel
Roles
- Design
- Front-end
About
This is the website you are currently browsing - my portfolio website!
I created it to showcase my work and experience as a software developer.
The content will grow and be updated as I gain more experience. Therefore, I decided to manage all content using the headless CMS, Contentful, instead of hard-coding everything.
Contentful provides a GraphQL content API, allowing the client side to consume contents seamlessly.
This website is built with the Next.js App Router and leverages React Server Components, allowing fetched data and server-side rendered items to be cached.
To reflect updates made in Contentful without re-building the app, the cache must be purged. I created a webhook in Contentful that triggers the Next.js revalidation API.
The design focuses on simplicity and ease of navigation. The website includes the landing page, the works page, the about page, and the contact page.
When the landing page is loaded for the first time during a visit, the animation begins.
The work page showcases my recent projects, while the about page highlights my work experience and educational background.
On the contact page, visitors can send a message by filling out the form. I built this system with EmailJS.
Each input in the form is required, including reCAPTCHA. If any field is left incomplete, the necessary error message will appear under the corresponding input.
Also, the website supports both English and Japanese. I implemented this internationalization using next-international.