Next.Js Example

A personal portfolio built with Next.js, Three.js & Mantine

March 18th, 2023

A personal portfolio built with Next.js, Three.js & Mantine's picture


This work is my new portfolio site built with Next.js, TypeScript, Three.js & Mantine. A website presents a single page application with carousel consisting of sections presented in the header.


To run this project locally, you need to have Node.js installed on your machine:

git clone . # clone the repository into the current directory npm install # for the dependencies installation npm run build # for the production build npm start # start the server

else you can deploy it on Vercel by using its CLI tool:

npm i -g vercel # install the Vercel CLI tool vercel # deploy the project


You can configure the project by editing the config.tsx files in the following components:

  • components/about/config.tsx (for the About card)
  • components/contact/config.tsx (for the Contact card)
  • components/footer/config.tsx (for the footer component)
  • components/header/config.tsx (for the header component)
  • components/skills/config.tsx (for the Skills card)
  • components/works/config.tsx (for the Works card)


This project supports i18n. If no translation is provided to the language - it will take the config information from the above tsx files. The english default translation folder must be named en and should never be deleted but may be modified.


All the available documentation regarding the creation & maintainability of the project is in docs folder.


Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.


Huge thanks to these wonderful people for their contributions:

Translated portfolio to germanLen#2832
Translated portfolio to indonesianyung_heheh#0430
Translated portfolio to polish & helped with testing the webdjoh
Translated portfolio to ukrainian

Note: If you wish to help translate the portfolio to your language, please join the Crowdin project.


This project is under MIT license. You can freely use it for your own purposes.

Share this:

Nedx ยฉ 2023