About this site
This portfolio is built with open-source software. Thank you to the maintainers and contributors behind every package that makes it possible.
Major technologies
Next.js ↗
The application framework. It provides the App Router, page structure, optimized images, metadata, static generation, and production build used throughout the portfolio.
React ↗
The component system behind the interface. The sidebar, theme controls, project cards, reading lists, and content sections are built as reusable React components.
TypeScript ↗
Adds static types to components and configuration data, helping keep projects, books, work history, certifications, and navigation consistent as the site grows.
Tailwind CSS ↗
Handles the responsive layout, spacing, typography, light and dark themes, and palette-aware styling without adding a runtime CSS-in-JS dependency.
Jest and Testing Library ↗
Provide fast component and layout tests. They verify important metadata, shared navigation, links, and page structure from a user-facing perspective.
Cypress ↗
Provides browser-based end-to-end testing for complete navigation and interaction flows when those tests are enabled for the project.
Simple Icons ↗
Supplies the one-color brand and technology marks shown beside social profiles and recognized skills. The library is CC0, while individual brand trademarks and usage guidelines still apply.
All packages
Runtime and development dependencies currently listed in the project.
- @hookform/resolvers
- react-hook-form
- next
- react
- react-dom
- simple-icons
- zod
- @tailwindcss/postcss
- @testing-library/dom
- @testing-library/jest-dom
- @testing-library/react
- @types/jest
- @types/node
- @types/react
- @types/react-dom
- cypress
- jest
- jest-environment-jsdom
- postcss
- tailwindcss
- typescript
Deployment and contact delivery
The portfolio and its contact workflow are deployed together on Vercel.
Vercel hosting
Vercel builds and hosts the Next.js application, including production deployments and preview deployments for pull requests.
Vercel Function
The /api/contact Route Handler becomes an on-demand Vercel Function. It starts when the form is submitted, validates the request, and stops after the request finishes. A Vercel Firewall rate-limit rule protects the endpoint before excessive requests reach the Function.
Resend email delivery
The server-side Function uses a private Resend API key to send the submitted name, email address, and message to the configured contact inbox. The visitor's address is used as the reply-to address.
Cloudflare Turnstile
The contact form uses Cloudflare Turnstile as a spam-protection layer. The browser receives a temporary token, and the Vercel Function verifies it with Cloudflare before sending any email.
Use this site for your own profile 🧰
You can use this portfolio as a starting point for building your own profile site.
- ♻️ I do not provide any guarantee for using this website, but I try to keep the project as reusable as possible.
- ⚠️ Use the project at your own risk.
- 📝 Credit the original authors, projects, and packages when required by their licenses.
Design and assets
- Layout inspiration: Tania Rascia's website
- Interface icons: Icons For Free
- Brand and technology icons (CC0; trademarks still apply): Simple Icons
- Deployment: Vercel