chore(initial): ajout de la structure de base du projet avec Vite et Vue 3

- Création des fichiers de configuration pour ESLint, Prettier, et Tailwind CSS
- Ajout de la configuration de l'éditeur avec .editorconfig
- Mise en place de la structure de répertoires pour les composants, les pages, et les données
- Intégration de la gestion des langues avec vue-i18n
- Ajout de la configuration de Vite et des dépendances nécessaires
- Création des fichiers de localisation pour l'anglais et le français
- Ajout de la structure de base pour le portfolio avec des exemples de projets
- Mise en place des composants de base pour l'interface utilisateur
This commit is contained in:
Mr¤KayJayDee
2025-06-22 15:00:35 +02:00
commit cc7368b550
122 changed files with 11938 additions and 0 deletions

266
src/locales/en.ts Normal file
View File

@@ -0,0 +1,266 @@
export default {
// Navigation
nav: {
home: 'Home',
projects: 'Projects',
about: 'About',
contact: 'Contact'
},
// Home page
home: {
title: 'Hi, I\'m Killian',
subtitle: 'Full Stack Developer passionate about creating exceptional web experiences and innovative solutions to bring your projects to life.',
cta: {
viewProjects: 'View my projects',
contactMe: 'Contact me'
},
featuredProjects: {
title: 'Featured Projects',
subtitle: 'Discover a selection of my most recent and innovative projects, showcasing my skills in modern web development.',
viewAll: 'View all projects'
},
services: {
title: 'My Services',
subtitle: 'I offer a complete range of services to support your projects from concept to completion.',
webDev: {
title: 'Web Dev',
description: 'Modern web applications with Vue.js, React and Node.js. Custom solutions tailored to your needs.'
},
mobileApps: {
title: 'Mobile Applications',
description: 'Development of high-performance and intuitive cross-platform applications.'
},
optimization: {
title: 'Optimization & Performance',
description: 'Performance improvement and SEO optimization for a better user experience.'
},
maintenance: {
title: 'Maintenance & Support',
description: 'Ongoing maintenance and technical support for your existing projects.'
}
},
cta2: {
title: 'Ready to start your project?',
subtitle: 'Let\'s discuss your vision and create something extraordinary together. I\'m here to turn your ideas into reality.',
startProject: 'Start a project',
learnMore: 'Learn more'
}
},
// Projects page
projects: {
title: 'My Projects',
subtitle: 'Explore my portfolio of web applications, tools, and innovative solutions. Each project represents a unique challenge solved with creativity and technical expertise.',
categories: {
all: 'All',
'webdevelopment': 'Web Development',
'botdevelopment': 'Bot Development',
'opensource': 'Open Source',
'enterprisesoftware': 'Enterprise Software',
'socialmediabot': 'Social Media Bot',
'automation': 'Automation'
},
buttons: {
website: 'Website',
repository: 'Repository',
npmpackage: 'NPM Package',
viewProject: 'View Project'
},
noResults: {
title: 'No projects found',
description: 'Try modifying your search or filter criteria.'
}
},
// About page
about: {
title: 'About Me',
subtitle: 'Learn more about my journey, skills, and passion for web development.',
intro: {
title: 'Who am I?',
content: 'I\'m Killian, a passionate full-stack developer with several years of experience in web development. I specialize in creating modern, performant, and user-friendly applications using the latest technologies.'
},
skills: {
title: 'My Skills',
programming: 'Programming',
frontend: 'Frontend',
backend: 'Backend',
tools: 'Tools & Others',
systems: 'Operating Systems'
},
experience: {
title: 'Experience',
content: 'With years of experience in web development, I\'ve worked on various projects ranging from simple websites to complex web applications. I\'m always eager to learn new technologies and improve my skills.'
},
approach: {
title: 'My Approach',
subtitle: 'My development philosophy is built on four fundamental pillars that ensure the success of every project.',
performance: {
title: 'Performance',
description: 'I place particular importance on performance and optimization, using best practices to ensure fast and responsive applications.'
},
architecture: {
title: 'Architecture',
description: 'I design modular and maintainable architectures, facilitating the evolution and scalability of projects in the long term.'
},
quality: {
title: 'Quality',
description: 'Automated testing, code reviews, and continuous integration are integral parts of my development process to ensure optimal quality.'
},
collaboration: {
title: 'Collaboration',
description: 'I prioritize clear communication and close collaboration with teams to ensure project success.'
}
},
cta: {
title: 'Ready to work together?',
description: 'I\'m always open to new opportunities and interesting collaborations.',
button: 'Contact me'
}
},
// Contact page
contact: {
title: 'Contact Me',
subtitle: 'Ready to discuss your next project? I\'d love to hear from you. Let\'s create something amazing together.',
stats: {
responseTime: 'Response Time',
satisfaction: 'Client Satisfaction',
collaboration: 'Collaboration'
},
quickContact: 'Quick Contact',
findMeOn: 'Find me on',
methods: {
email: 'Email',
phone: 'Phone',
location: 'Location',
responseTime: 'Response within 24-48h',
availability: 'Remote & on-site'
},
faq: {
title: 'Frequently Asked Questions',
subtitle: 'Here are the answers to the most common questions about my services and working method.',
responseTime: {
title: 'Response Time',
description: 'I generally respond within 24-48h to all messages received.'
},
projectTypes: {
title: 'Project Types',
description: 'Web applications, APIs, automation, consulting and custom solutions.'
},
collaboration: {
title: 'Collaboration',
description: 'Remote or on-site work according to your needs and preferences.'
}
},
form: {
name: 'Name',
email: 'Email',
subject: 'Subject',
message: 'Message',
send: 'Send Message',
sending: 'Sending...',
success: 'Message sent successfully!',
error: 'Error sending message. Please try again.',
required: 'This field is required',
invalidEmail: 'Please enter a valid email address'
},
info: {
title: 'Get in Touch',
description: 'Feel free to reach out to me for any questions, project discussions, or collaboration opportunities.',
email: 'Email',
social: 'Social Media'
}
},
// Project data
projectData: {
'virtual-tour': {
title: 'Virtual Tour',
description: 'Development of an interactive and immersive virtual tour platform.',
longDescription: 'Virtual Tour is an innovative platform for creating interactive and immersive virtual tours. Developed with the latest web technologies, it offers a smooth and engaging user experience for exploring 3D spaces.'
},
'xinko': {
title: 'Xinko',
description: 'Xinko is a multiplatform bot that can be used to create primary with ease and fun in it.',
longDescription: 'Xinko is an innovative multiplatform bot designed to simplify primary content creation. With an intuitive interface and advanced features, it allows users to generate quality content with ease and fun.'
},
'image-manipulation': {
title: 'Image Manipulation',
description: 'Discord Image Generation: NPM package for code-based image manipulation. Originally an API, now open-source.',
longDescription: 'A complete NPM package for image generation and manipulation in Discord. This open-source project offers a simple API for creating memes, applying filters, and generating dynamic images. Used by many Discord bots with over 100k downloads.'
},
'primate-web-admin': {
title: 'Primate Web Admin',
description: 'Primate Web Admin is a Web interface to manage Primate that is a Munki-like deployment tool for Windows.',
longDescription: 'Modern web interface for managing Primate, a Windows deployment tool inspired by Munki. This web application allows system administrators to deploy and manage software on a Windows computer fleet in a centralized manner.'
},
'instagram-bot': {
title: 'Instagram Bot',
description: 'Fully functional Instagram bot using Insta.js by androz2091. It has many commands. Generate images with commands like: !stonk or !invert.',
longDescription: 'Fully functional Instagram bot developed with Insta.js. It offers many commands to generate custom images, memes, and visual effects. Perfect for animating your Instagram stories and posts with original content.'
},
'crowdin-status-bot': {
title: 'Crowdin Status Bot',
description: 'A bot that fetches Crowdin translation status and updates Discord messages with the latest status. Stay informed on progress!',
longDescription: 'Automated Discord bot that fetches Crowdin translation status and updates Discord messages with the latest information. Ideal for translation teams who want to stay informed about their project progress in real-time.'
}
},
// Footer
footer: {
navigation: 'Navigation',
services: 'Services',
copyright: 'All rights reserved.',
legalNotices: 'Legal Notices',
privacyPolicy: 'Privacy Policy',
servicesList: {
webDev: 'Web Dev',
mobileApps: 'Mobile Apps',
apiBackend: 'API & Backend',
consulting: 'Consulting'
}
},
// Common
common: {
loading: 'Loading...',
error: 'An error occurred',
retry: 'Retry',
close: 'Close',
save: 'Save',
cancel: 'Cancel',
confirm: 'Confirm',
delete: 'Delete',
edit: 'Edit',
view: 'View',
back: 'Back',
next: 'Next',
previous: 'Previous',
search: 'Search',
filter: 'Filter',
sort: 'Sort',
reset: 'Reset'
},
// SEO
seo: {
home: {
title: 'Killian - Full Stack Developer',
description: 'Portfolio of Killian, full stack developer specialized in Vue.js, React and Node.js. Discover my projects and services.'
},
projects: {
title: 'Projects - Killian',
description: 'Explore my portfolio of web applications, tools, and innovative solutions.'
},
about: {
title: 'About - Killian',
description: 'Learn more about my journey, skills, and passion for web development.'
},
contact: {
title: 'Contact - Killian',
description: 'Ready to discuss your next project? Let\'s create something amazing together.'
}
}
}

266
src/locales/fr.ts Normal file
View File

@@ -0,0 +1,266 @@
export default {
// Navigation
nav: {
home: 'Accueil',
projects: 'Projets',
about: 'À propos',
contact: 'Contact'
},
// Home page
home: {
title: 'Salut, je suis Killian',
subtitle: 'Développeur Full Stack passionné par la création d\'expériences web exceptionnelles et de solutions innovantes pour donner vie à vos projets.',
cta: {
viewProjects: 'Voir mes projets',
contactMe: 'Me contacter'
},
featuredProjects: {
title: 'Projets en vedette',
subtitle: 'Découvrez une sélection de mes projets les plus récents et innovants, démontrant mes compétences en développement web moderne.',
viewAll: 'Voir tous les projets'
},
services: {
title: 'Mes services',
subtitle: 'Je propose une gamme complète de services pour accompagner vos projets du concept à la réalisation.',
webDev: {
title: 'Dev Web',
description: 'Applications web modernes avec Vue.js, React et Node.js. Solutions sur mesure adaptées à vos besoins.'
},
mobileApps: {
title: 'Applications Mobile',
description: 'Développement d\'applications multiplateformes performantes et intuitives.'
},
optimization: {
title: 'Optimisation & Performance',
description: 'Amélioration des performances et optimisation SEO pour une meilleure expérience utilisateur.'
},
maintenance: {
title: 'Maintenance & Support',
description: 'Maintenance continue et support technique pour vos projets existants.'
}
},
cta2: {
title: 'Prêt à démarrer votre projet ?',
subtitle: 'Discutons de votre vision et créons ensemble quelque chose d\'extraordinaire. Je suis là pour transformer vos idées en réalité.',
startProject: 'Commencer un projet',
learnMore: 'En savoir plus'
}
},
// Projects page
projects: {
title: 'Mes Projets',
subtitle: 'Explorez mon portfolio d\'applications web, d\'outils et de solutions innovantes. Chaque projet représente un défi unique résolu avec créativité et expertise technique.',
categories: {
all: 'Tous',
'webdevelopment': 'Développement Web',
'botdevelopment': 'Développement de Bot',
'opensource': 'Open Source',
'enterprisesoftware': 'Logiciel d\'Entreprise',
'socialmediabot': 'Bot de Réseaux Sociaux',
'automation': 'Automatisation'
},
buttons: {
website: 'Site Web',
repository: 'Dépôt',
npmpackage: 'Package NPM',
viewProject: 'Voir le Projet'
},
noResults: {
title: 'Aucun projet trouvé',
description: 'Essayez de modifier vos critères de recherche ou de filtrage.'
}
},
// About page
about: {
title: 'À propos de moi',
subtitle: 'Découvrez mon parcours, mes compétences et ma passion pour le développement web.',
intro: {
title: 'Qui suis-je ?',
content: 'Je suis Killian, un développeur full-stack passionné avec plusieurs années d\'expérience en développement web. Je me spécialise dans la création d\'applications modernes, performantes et conviviales en utilisant les dernières technologies.'
},
skills: {
title: 'Mes Compétences',
programming: 'Programmation',
frontend: 'Frontend',
backend: 'Backend',
tools: 'Outils & Autres',
systems: 'Systèmes d\'exploitation'
},
experience: {
title: 'Expérience',
content: 'Avec des années d\'expérience en développement web, j\'ai travaillé sur divers projets allant de simples sites web à des applications web complexes. Je suis toujours désireux d\'apprendre de nouvelles technologies et d\'améliorer mes compétences.'
},
approach: {
title: 'Mon Approche',
subtitle: 'Ma philosophie de développement repose sur quatre piliers fondamentaux qui garantissent le succès de chaque projet.',
performance: {
title: 'Performance',
description: 'J\'accorde une importance particulière à la performance et à l\'optimisation, en utilisant les meilleures pratiques pour garantir des applications rapides et réactives.'
},
architecture: {
title: 'Architecture',
description: 'Je conçois des architectures modulaires et maintenables, facilitant l\'évolution et la scalabilité des projets sur le long terme.'
},
quality: {
title: 'Qualité',
description: 'Tests automatisés, revues de code et intégration continue font partie intégrante de mon processus de développement pour garantir une qualité optimale.'
},
collaboration: {
title: 'Collaboration',
description: 'Je privilégie une communication claire et une collaboration étroite avec les équipes pour assurer le succès des projets.'
}
},
cta: {
title: 'Prêt à travailler ensemble ?',
description: 'Je suis toujours ouvert aux nouvelles opportunités et collaborations intéressantes.',
button: 'Me contacter'
}
},
// Contact page
contact: {
title: 'Me Contacter',
subtitle: 'Prêt à discuter de votre prochain projet ? J\'aimerais avoir de vos nouvelles. Créons ensemble quelque chose d\'incroyable.',
stats: {
responseTime: 'Délai de réponse',
satisfaction: 'Satisfaction client',
collaboration: 'Collaboration'
},
quickContact: 'Contact rapide',
findMeOn: 'Retrouvez-moi sur',
methods: {
email: 'Email',
phone: 'Téléphone',
location: 'Localisation',
responseTime: 'Réponse sous 24-48h',
availability: 'Remote & sur site'
},
faq: {
title: 'Questions fréquentes',
subtitle: 'Voici les réponses aux questions les plus courantes concernant mes services et ma méthode de travail.',
responseTime: {
title: 'Délai de réponse',
description: 'Je réponds généralement sous 24-48h à tous les messages reçus.'
},
projectTypes: {
title: 'Types de projets',
description: 'Applications web, API, automatisation, consulting et solutions sur mesure.'
},
collaboration: {
title: 'Collaboration',
description: 'Travail en remote ou sur site selon vos besoins et préférences.'
}
},
form: {
name: 'Nom',
email: 'Email',
subject: 'Sujet',
message: 'Message',
send: 'Envoyer le Message',
sending: 'Envoi en cours...',
success: 'Message envoyé avec succès !',
error: 'Erreur lors de l\'envoi du message. Veuillez réessayer.',
required: 'Ce champ est requis',
invalidEmail: 'Veuillez entrer une adresse email valide'
},
info: {
title: 'Restons en Contact',
description: 'N\'hésitez pas à me contacter pour toute question, discussion de projet ou opportunité de collaboration.',
email: 'Email',
social: 'Réseaux Sociaux'
}
},
// Project data
projectData: {
'virtual-tour': {
title: 'Virtual Tour',
description: 'Développement d\'une plateforme de visite virtuelle interactive et immersive.',
longDescription: 'Virtual Tour est une plateforme innovante permettant de créer des visites virtuelles interactives et immersives. Développée avec les dernières technologies web, elle offre une expérience utilisateur fluide et engageante pour explorer des espaces en 3D.'
},
'xinko': {
title: 'Xinko',
description: 'Xinko est un bot multiplateforme qui peut être utilisé pour créer du contenu primaire avec facilité et plaisir.',
longDescription: 'Xinko est un bot multiplateforme innovant conçu pour simplifier la création de contenu primaire. Avec une interface intuitive et des fonctionnalités avancées, il permet aux utilisateurs de générer du contenu de qualité avec facilité et plaisir.'
},
'image-manipulation': {
title: 'Manipulation d\'Images',
description: 'Discord Image Generation : Package NPM pour la manipulation d\'images basée sur le code. Initialement une API, maintenant open-source.',
longDescription: 'Un package NPM complet pour la génération et la manipulation d\'images dans Discord. Ce projet open-source offre une API simple pour créer des memes, appliquer des filtres et générer des images dynamiques. Utilisé par de nombreux bots Discord avec plus de 100k téléchargements.'
},
'primate-web-admin': {
title: 'Primate Web Admin',
description: 'Primate Web Admin est une interface Web pour gérer Primate qui est un outil de déploiement similaire à Munki pour Windows.',
longDescription: 'Interface web moderne pour gérer Primate, un outil de déploiement pour Windows inspiré de Munki. Cette application web permet aux administrateurs système de déployer et gérer des logiciels sur un parc informatique Windows de manière centralisée.'
},
'instagram-bot': {
title: 'Bot Instagram',
description: 'Bot Instagram entièrement fonctionnel utilisant Insta.js par androz2091. Il a de nombreuses commandes. Générez des images avec des commandes comme : !stonk ou !invert.',
longDescription: 'Bot Instagram entièrement fonctionnel développé avec Insta.js. Il propose de nombreuses commandes pour générer des images personnalisées, des memes et des effets visuels. Parfait pour animer vos stories et posts Instagram avec du contenu original.'
},
'crowdin-status-bot': {
title: 'Bot de Statut Crowdin',
description: 'Un bot qui récupère le statut de traduction Crowdin et met à jour les messages Discord avec le dernier statut. Restez informé des progrès !',
longDescription: 'Bot Discord automatisé qui récupère le statut des traductions Crowdin et met à jour les messages Discord avec les dernières informations. Idéal pour les équipes de traduction qui souhaitent rester informées du progrès de leurs projets en temps réel.'
}
},
// Footer
footer: {
navigation: 'Navigation',
services: 'Services',
copyright: 'Tous droits réservés.',
legalNotices: 'Mentions légales',
privacyPolicy: 'Politique de confidentialité',
servicesList: {
webDev: 'Dev Web',
mobileApps: 'Applications Mobile',
apiBackend: 'API & Backend',
consulting: 'Consultation'
}
},
// Common
common: {
loading: 'Chargement...',
error: 'Une erreur s\'est produite',
retry: 'Réessayer',
close: 'Fermer',
save: 'Sauvegarder',
cancel: 'Annuler',
confirm: 'Confirmer',
delete: 'Supprimer',
edit: 'Modifier',
view: 'Voir',
back: 'Retour',
next: 'Suivant',
previous: 'Précédent',
search: 'Rechercher',
filter: 'Filtrer',
sort: 'Trier',
reset: 'Réinitialiser'
},
// SEO
seo: {
home: {
title: 'Killian - Développeur Full Stack',
description: 'Portfolio de Killian, développeur full stack spécialisé en Vue.js, React et Node.js. Découvrez mes projets et services.'
},
projects: {
title: 'Projets - Killian',
description: 'Explorez mon portfolio d\'applications web, d\'outils et de solutions innovantes.'
},
about: {
title: 'À propos - Killian',
description: 'Découvrez mon parcours, mes compétences et ma passion pour le développement web.'
},
contact: {
title: 'Contact - Killian',
description: 'Prêt à discuter de votre prochain projet ? Créons ensemble quelque chose d\'incroyable.'
}
}
}