Stefano Biddau's Portfolio

🔗 Visit the live site here
📚 View the live Storybook here

---

📑 Table of Contents

• Description
• System Requirements
• Installation
• Scripts Overview
• Features
• SEO Optimization
• License

---

📌 Description

This is my personal portfolio. It contains information about me, my projects, and how to contact me.

Note: This project is under continuous development. Suggestions and feedback are always welcome!

---

⚙️ System Requirements

Make sure your environment meets the following:

• Node.js: Version 22.15.0 (LTS or newer).
  👉 Download Node.js
• npm: Comes with Node.js (use npm install -g npm@latest to update).
• Modern Browser: Chrome, Firefox, Edge (latest versions recommended).
• pnpm (optional): Faster and leaner alternative to npm.
  👉 Learn more about pnpm

---

🚀 Installation

1. Clone the Repository:

   git clone <REPOSITORY_URL>
   cd my-portfolio

2. Install Dependencies:

   npm install

3. Start the Development Server:

   npm run dev

4. Build the Project:

   npm run build

5. Lint and Fix Code:

   • Check for issues:

     npm run lint

   • Auto-fix:

     npm run lint:fix

6. Optimize SVG Icons:

   npm run optimize-svg

---

📜 Scripts Overview

Script	Description
npm run dev	Starts the development server using Vite.
npm run build	Builds the project for production and type-checks with vue-tsc.
npm run preview	Serves the built project locally.
npm run visualize	Builds the app with bundle visualizer enabled.
npm run lint	Runs ESLint to find code quality issues.
npm run lint:fix	Fixes common ESLint issues automatically.
npm run optimize-svg	Optimizes SVGs in src/assets/icons using SVGO.

---

🧪 Features

This project integrates a rich set of modern technologies:

• Vue 3: Modern, reactive UI framework
• Vite: Fast build tool with excellent DX
• TypeScript: Typed JavaScript for better safety
• Tailwind CSS: Utility-first CSS framework
• Pinia: State management for Vue
• Vue Router: Navigation system for SPAs
• Vue I18n: Localization with dynamic locale support
• ESLint + Prettier: Code quality and formatting

---

🔍 SEO Optimization

SEO is powered by @unhead/vue, which enables dynamic head/meta management:

Highlights:

• Reactive SEO meta based on route and data
• Open Graph support including og:locale and alternates
• Meta fallback and canonical/robots tags
• Ready for Twitter Card and structured data

This system was designed by Martina Eulogio with a modular and reactive architecture fully integrated with Vue.

---

📝 License

© 2025 Stefano Biddau. All rights reserved.

This project is not open-source. See LICENSE for more information and usage terms.