2024
Personal
Next Js
Tailwindcss

The context

This portfolio was designed to be practical and flexible above all. The goal is not a perfect architecture, but a simple tool that allows me to easily load my projects in TypeScript.

In my case, I created TypeScript objects in a file that are easy and quick to update via my development tools.

I deliberately chose simplicity: GitHub + Vercel with automatic deployment via push to main. I could have opted for a VPS with Docker, shared hosting, CI/CD automation with GitHub Actions and continuous deployment on a VPS or cloud providers like AWS, Google Cloud, or Azure, but the most practical and quick solution was the right choice.

What I learn :

  • Chosen Tech Stack:
  • Next.js 14 with App Router for server-side rendering
  • Internationalization with next-intl: multilingual management (FR, EN, ES) with locale-based routing
  • TypeScript: choice for flexibility and ease of project management
  • Tailwind CSS for rapid and consistent styling
  • Accessibility and UX:
  • Implementation of skip links to improve keyboard navigation
  • Breadcrumbs to improve navigation and SEO
  • ARIA labels and semantic roles for screen readers
  • SEO and Performance:
  • Dynamic metadata with generateMetadata for each page and project
  • Image optimization with next/image
  • Automatically generated sitemap to improve indexing
  • Configured security headers
  • Project Philosophy:
  • Practicality first: ease of loading TypeScript projects
  • Automated deployment: GitHub + Vercel with push to main
  • Deliberate choice of simplicity over unnecessary technical complexity