Skip to main content
Portfolio Hero Light

Overview

This is a modern, full-stack portfolio website built with Nuxt 3 and Vue.js. It’s designed to showcase your professional work, skills, and experience in an elegant and interactive way. The portfolio features a fully responsive design with dark mode support, animated sections, and a contact form integrated with Netlify. Perfect for developers, designers, and freelancers looking to make a strong online presence.

Modern Stack

Built with Nuxt 3, Vue.js, and TailwindCSS for a fast, modern experience

Quick Setup

Get up and running in minutes with simple installation steps

Customizable

Easy to customize components, content, and styling to match your brand

Production Ready

Deployed on Netlify with optimized builds and automated deployments

Key Features

Automatic theme switching with @nuxtjs/color-mode module. Users can toggle between light and dark themes with a beautiful animated transition.
<button
  @click="$colorMode.preference = $colorMode.value === 'light' ? 'dark' : 'light'"
>
  <Icon v-if="$colorMode.value === 'light'" name="moon" />
  <Icon v-else name="sunny" />
</button>
Eye-catching hero section with a typing animation powered by Typed.js, cycling through your key skills.
const skills = ['Full-stack', 'Laravel', 'VueJS', 'PHP', 'JS']

const typed = new Typed('.typed', {
  strings: skills,
  typeSpeed: 150,
  loop: true,
})
Filterable project gallery with categories (websites, web applications, resources). Each project displays screenshots, descriptions, and technologies used.
Integrated Netlify Forms with reCAPTCHA protection for spam prevention. Includes honeypot field for additional bot protection.
<form
  name="contact"
  method="POST"
  action="/contact-submission"
  data-netlify-recaptcha="true"
  netlify-honeypot="bot-field"
  data-netlify="true"
>
  <!-- Form fields -->
</form>
Dedicated CV page with downloadable PDF version. Displays your experience, education, skills, and contact information in a professional layout.

Technology Stack

The portfolio is built with modern web technologies:
{
  "dependencies": {
    "nuxt": "^3.10.3",
    "vue": "^3.4.21",
    "typed.js": "^2.1.0"
  },
  "devDependencies": {
    "@nuxtjs/tailwindcss": "^6.11.4",
    "@nuxtjs/color-mode": "^3.3.3",
    "@nuxt/image": "^1.4.0",
    "nuxt-aos": "^1.2.4"
  }
}

Nuxt 3

Full-stack Vue.js framework with SSR

TailwindCSS

Utility-first CSS framework

Typed.js

JavaScript typing animation

Ionicons

Premium icon set

Netlify

Deployment & form handling

AOS

Animate on scroll library

What’s Included

1

Hero Section

Eye-catching landing with your name, role, and animated skill rotation
2

About Section

Introduction with your background, experience stats, and contact details
3

Experience Timeline

Professional and educational experience with company logos and descriptions
4

Skills Section

Organized skill cards for Development, Tools, and Workflow
5

Projects Gallery

Filterable project showcase with images and technology badges
6

Contact Form

Netlify-powered form with validation and spam protection

Live Demo

Check out the live portfolio at guillaume-cazin.fr
The portfolio is optimized for performance with lazy-loaded images, code splitting, and automatic optimization via Nuxt 3’s build system.

Next Steps

Quick Start

Get the portfolio running on your local machine

Explore Features

Deep dive into all the portfolio features

Build docs developers (and LLMs) love