Arthur Danjou | Portfolio 2024

My professional portfolio built with modern Nuxt.js technologies, showcasing projects, skills, and experience.

📋 Table of Contents

• Features
• Tech Stack
• Project Structure
• Development
  • Prerequisites
  • Installation
  • Configuration
  • Running Locally
  • Deployment
• Adding Content
  • Portfolio Projects
  • Uses Page
• Integrations
• License
• Contact

✨ Features

• Responsive Design - Fully responsive layout that works on all devices
• i18n Support - Multilanguage content with Nuxt i18n
• Content Management - Easy content editing with Nuxt Content and Nuxt Studio
• Modern Styling - Beautiful UI built with Tailwind CSS and SASS
• Performance Optimized - Fast loading times and SEO optimized
• Analytics - WakaTime integration to track coding statistics
• Discord Integration - Real-time Discord status display
• CI/CD - Automated deployment with NuxtHub

⚒️ Tech Stack

• UI Framework → Vue.js 3
• Framework → Nuxt 3
• Content Management → Nuxt Content
• Design System → NuxtUI
• CMS & Editing → Nuxt Studio
• Language → TypeScript
• Deployment → NuxtHub
• Styling → Sass & Tailwind CSS
• Package Manager → pnpm
• Internationalization → Nuxt i18n

📂 Project Structure

├── assets/              # Static assets like global styles
├── components/          # Vue components
├── content/             # Markdown content for the portfolio
│   ├── portfolio/       # Portfolio projects
│   └── uses/            # Uses page items
├── layouts/             # Page layouts
├── pages/               # Application pages
├── public/              # Public static files
│   └── portfolio/       # Portfolio images
├── server/              # Server API routes
├── utils/               # Utility functions
├── .env.example         # Example environment variables
├── nuxt.config.ts       # Nuxt configuration
├── package.json         # Dependencies and scripts
└── README.md            # Project documentation

🚀 Development

Prerequisites

• Node.js (v16 or later)
• pnpm (v7 or later)

Installation

# Clone the repository
git clone https://github.com/yourusername/portfolio-2024.git
cd portfolio-2024

# Install dependencies (with hoisting for Nuxt 3 compatibility)
pnpm i --shamefully-hoist

Configuration

Create a .env file in the root directory with the following variables:

# WakaTime Integration
NUXT_WAKATIME_USER_ID=your_wakatime_user_id
NUXT_WAKATIME_CODING=your_wakatime_coding_endpoint
NUXT_WAKATIME_LANGUAGES=your_wakatime_languages_endpoint
NUXT_WAKATIME_OS=your_wakatime_os_endpoint
NUXT_WAKATIME_EDITORS=your_wakatime_editors_endpoint

# SEO
NUXT_PUBLIC_SITE_URL=https://your-domain.com

# Nuxt Hub Deployment
NUXT_HUB_PROJECT_KEY=your_nuxt_hub_project_key

# Discord Integration
NUXT_DISCORD_ID=your_discord_app_id
NUXT_DISCORD_TOKEN=your_discord_token
NUXT_DISCORD_USER_ID=your_discord_user_id

# Cloud Files
NUXT_PUBLIC_CLOUD_RESUME=https://link-to-your-resume.pdf

# Internationalization
NUXT_PUBLIC_I18N_BASE_URL=https://your-domain.com

Running Locally

# Start development server
pnpm dev

# Build for production
pnpm build

# Preview production build
pnpm preview

Deployment

The portfolio is configured to deploy automatically using NuxtHub. Push changes to your main branch to trigger a deployment.

🍱 Adding Content

Portfolio Projects

1. Create a new .md file in the /content/portfolio/ directory
2. Follow the structure of existing projects:

---
title: Project Title
description: Brief description of the project
date: 2023-01-01
img: /portfolio/project-image.png
tags: [tag1, tag2, tag3]
links:
  website: https://project-url.com
  github: https://github.com/user/repo
---

## Project content goes here

Detailed description and information about the project.

3. Add related project images to /public/portfolio/

Uses Page

Add new items to the /content/uses/ directory following the existing pattern:

---
category: Category Name
items:
  - name: Item Name
    description: Item description
    link: https://item-url.com
---

🔌 Integrations

• WakaTime - Track coding time and statistics
• Discord - Display real-time Discord status
• Nuxt Studio - Headless CMS for content management
• Nuxt i18n - Internationalization support

📄 License

MIT © Arthur Danjou

📬 Contact

• Website: arthurdanjou.fr
• GitHub: @ArthurDanjou
• LinkedIn: Arthur Danjou