Bonjour, je m'appelle Dylan Ayache

Je suis Développeur Fullstack, bienvenue sur mon Portfolio.

Développeur Web en train de créer un site web
Développeur Web en train de créer un site web

Statut actuel :

En préparation d'une Licence Profesionnelle en développement informatique à l'UHA de Mulhouse, je suis à la recherche d'un stage non rémunéré du 07 Avril au 06 Juillet 2026.
Je reste ouvert à toute proposition d'emploi.
Je suis également disponible pour réaliser vos projets, n'hésitez pas à me contacter 😊.

A Propos de moi

Bonjour, je m'appelle Dylan Ayache j'ai 30 ans et je prépare actuellement une Licence Professionnelle en développement informatique à l'UHA de Mulhouse.

Mon intérêt pour l'informatique et les nouvelles technologies a commencé étant jeune. Après mon bac j'ai commencé à apprendre la programmation de manière autodicacte en ligne. Puis j'ai suivi des cours sur OpenClassroom tout ceci a conforté mon idée de travailler dans le domaine du numérique. Ne réussissant pas à trouver une alternance à ce moment là dans le développement informatique, je me suis mis à travailler.

Grâce à mes compétences personnelles et mon autodidactisme j'ai décroché un premier emploi en tant que Technicien Informatique itinérant. A la suite de cette première expérience, j'ai décroché un second emploi en tant que Technicien Helpdesk / Gestionnaire de parc informatique. J'ai travaillé au total 3 ans en tant que Technicien Informatique.

En 2021 je me suis replongé dans les tutoriels OpenClassroom, ce qui m'a donné envie de redécouvrir le Développement Informatique.

J'ai obtenu un titre professionnel de Développeur Web et Web Mobile en 2022 (Bac+2), à la suite de cela j'ai travaillé comme Développeur Fullstack de Mars 2023 à Septembre 2024 chez un média. Je code depuis fin 2021.

Aujourd'hui je poursuis ma montée en compétences en licence professionnelle et je continue de me perfectionner et de mettre en oeuvre mes capacités à travers des projets personnels.

Localisation : Colmar, France

Anglais : Niveau B2 (Avancé)

Espagnol : Niveau B2 (Avancé)

Création de site web par un développeur

Mes Compétences

Mon but est de réaliser à chaque fois un nouveau projet pour mettre en oeuvre ce que j'ai pu apprendre.

Mes Réalisations

Ma Météo

Projet de licence : une application de bureau avec Electron.js, Tailwind, Web Components et deux API.

Le projet est une application de données météorologiques qui utilise principalement OpenWeather pour la météo et Geoapify pour afficher une liste de villes selon la recherche effectuée. Les fonctionnalités sont :

  • Rechercher n'importe quelle ville dans le monde grâce à l'API Geoapify. Une fois la ville sélectionnée, vous obtiendrez les prévisions météorologiques de cette dernière.
  • Affichage des informations météorologiques actuelles et sur 24 heures comprenant : la température, la température ressentie, l'icône de la météo, la vitesse du vent, le taux d'humidité, la pression atmosphérique, les heures de lever et de coucher de soleil ainsi qu'une description de la météo du jour.
  • Les données sont enregistrées dans la mémoire locale de votre navigateur afin de pouvoir être affichées lors de la prochaine utilisation de l'application.
  • Vous pouvez accéder à l'historique des villes recherchées directement sous la barre de recherche. Ces éléments sont cliquables et vous permettent d'afficher rapidement les prévisions météorologiques de la ville sélectionnée.
  • Météo quotidienne pour les 7 prochains jours de la ville sélectionnée : la température maximale, la température minimale, l'icône de la météo, le lever et coucher du soleil.
  • J'ai également créé un thème sombre que vous pouvez activer à l'aide du bouton situé dans le coin supérieur droit de l'application.
  • Il y a également deux indicateurs santé: la qualité de l'air allant de 1 à 5 et l'indice UV allant de 1 à 12. Selon le niveau de chacun de ces critères, un conseil personnalisé est affiché suivant les recommandations de l'OMS.
  • Un cache a été implémenté pour éviter l'excès d'appels API.

Décembre 2025

photo projet app-météo
Technologies utilisées
  • icone electron
  • icone web-components
  • icone javascript
  • icone tailwind
  • icone api

App Ecommerce

Projet personnel, c'est un site Ecommerce réalisé avec Symfony 6.

Le projet comporte les fonctionnalités clés d'un site de vente en ligne avec une architecture MVC. Les fonctionnalités sont :

  • Une page affiche dynamiquement une liste de produits selon leurs catégories, leurs créateurs, ainsi qu'une page dédiée aux nouveautés et aux promotions. Un système de pagination est intégré avec KnpPaginator
  • Une page affiche dynamiquement les détails d'un produit, où l'utilisateur peut ajouter le produit à son panier en sélectionnant une taille et une quantité valide. Il existe également une option pour ajouter le produit aux favoris, avec une requête AJAX afin d'améliorer l'expérience utilisateur (UX)
  • Authentification et inscription des utilisateurs, avec l'utilisation d'une regex pour le mot de passe suivant les recommandations de l'OWASP, et un champ « honeypot » pour prévenir les attaques automatisées de type bot. Un e-mail est envoyé à l'utilisateur pour confirmer son compte
  • Accès à différentes pages de compte utilisateur pour le suivi des commandes, la modification des informations personnelles et la gestion des adresses
  • Un système de panier est implémenté, permettant aux utilisateurs d'ajouter, supprimer ou gérer les quantités de produits avant de valider leur commande. Toutes les interactions se font via des requêtes AJAX pour améliorer l'UX
  • Un système de paiement est implémenté, permettant à l'utilisateur de choisir une adresse de livraison et de facturation existante ou d'en créer une nouvelle, de sélectionner un mode de paiement, et de visualiser un récapitulatif des produits avant de confirmer l'achat. La logique est en place, à l'avenir un module Stripe sera ajouté
  • Une fois la commande confirmée, une page de succès s'affiche et une confirmation de commande est envoyée par e-mail
  • Plusieurs vulnérabilités sont prises en compte, notamment l'injection SQL, le CSRF et le XSS. Des vérifications supplémentaires redirigent vers une page 404 si un utilisateur n'est pas autorisé à effectuer une action ou à accéder à un contenu donné
  • Une barre de recherche permet de chercher par créateur, catégorie, nom de produit, ou une combinaison de deux mots-clés
  • Un back-office complet permet au propriétaire du site de gérer librement les produits, les utilisateurs, le stock, les tailles, les variantes disponibles, le statut des commandes, celui-ci est implémenté via EasyAdminBundle
  • Utilisation de Docker et du serveur d'applications moderne FrankenPHP
  • Utilisation de Cloudinary pour l'hébergement des images
  • Le projet est entièrement responsive

Janvier 2023 à aujourd'hui

photo projet app e-commerce
Technologies utilisées
  • icone symfony
  • icone bootstrap
  • icone mysql
  • icone javascript
  • icone jquery
  • icone sass
  • icone docker

App Plantes

Projet personnel, initiation à React, TypeScript, Next.js et Tailwind.

Le projet est un site de plantes, avec un système de filtre et de tri. Il permet d'obtenir des informations détaillées au sujet de plusieurs types de plantes. Les fonctionnalités sont :

  • Liste des plantes sous forme de card en homepage
  • Système de tri par : Récent, Nom et Popularité
  • Système de filtrage par : Catégories, Arrosage et Exposition
  • Détail d'une plante avec : image, description, caractéristiques et un footer récupérant les plantes de la même catégorie
  • Création de plusieurs composants : ActiveFilter, DropdownFilter, Header, LikeButton, PlantCard, PlantDetail, SeeMoreButton et SelectSort

Juillet 2023

photo projet Le-commerce
Technologies utilisées
  • icone react
  • icone typescript
  • icone next js
  • icone tailwind

App Centre de Formation

Projet de formation, c'est un intranet de gestion de tâches administratives d'un centre de formation réalisé avec Symfony 5.

Le projet permet à un centre de formation de gérer les stagiaires inscrits et les sessions de formations. Les fonctionalités sont :

  • Plusieurs pages contenant les listings des stagiaires, formations, sessions, modules et catégories des cours
  • CRUD des différentes données
  • Authentification et inscription d'un utilisateur, utilisation d'une regex pour le mot de passe en suivant les consignes d'OWASP et d'un captcha pour contrer l'attaque par force brute
  • Rôle admin et user, pour répartir l'accès aux différentes pages de l'application
  • Système de messagerie interne pour que les utilisateurs inscrits puissent communiquer entre eux
  • Plusieurs failles sont gérées: (SQL, CSRF, XSS)

Aout 2022

photo projet fiches-films
Technologies utilisées
  • icone symfony
  • icone bootstrap
  • icone mysql
  • icone sass

App Forum

Projet de formation, c'est un Forum de discussion.

Le projet a été réalisé avec un Framework maison, basé sur Symfony avec un design pattern en MVC. La base de données est en SQL et faite avec phpMyAdmin. Les fonctionalités sont :

  • Créer un nouveau sujet de discussion dans une catégorie avec un titre et un message
  • N'importe quel user peut rajouter une réponse dans le sujet
  • Il y a un login qui permet de s'incrire et de s'authentifier
  • Il y a un rôle admin et user, en tant qu'admin on peut supprimer un sujet et on peut voir la liste des users
  • On peut modifier son mot de passe ainsi que ses informations personnelles et on y retrouve la liste de ses derniers messages postés
  • Injection SQL gerée grâce aux requêtes préparées, XSS géré grâce aux fonctions d'échappement des données, Password protégé par un hash

Juillet 2022

photo projet Le-commerce
Technologies utilisées
  • icone bootstrap
  • icone php
  • icone mysql
  • icone sass

App Fiches Films

Projet de formation, c'est un projet regroupant divers informations sur le Cinéma.

Le projet contient la création, la suppresion et la modification d'un film. On peut également consulter les listes d'acteurs, de réalisateurs, de films et de genres. Il est réalisé en PHP POO avec une base de données crée via phpMyAdmin et une architecture MVC.

Juin 2022

photo projet fiches-films
Technologies utilisées
  • icone html 5
  • icone javascript
  • icone bootstrap
  • icone php
  • icone mysql

Galerie Photo

Projet Personnel, c'est une galerie photo effectuée en JS Vanilla.

Cette galerie comporte plusieurs fonctionalités, dans un premier temps il y a un filtre qui affiche les photos selon une catégorie sélectionée. Ensuite il y a une modal qui permet d'afficher la photo en grand quand on clique dessus. Enfin il y a un slider qui permet de naviguer entre les différentes photos.

Mars 2022

pictures gallery javascript
Technologies utilisées
  • icone html 5
  • icone css 3
  • icone javascript

Calculateur de tip

Projet Personnel, c'est un calculateur de tip, c'est un projet du site Frontend Mentor.

L'objectif était de réaliser un calculateur de tip (pourboire) en JavaScript. Il permet de calculer le montant d'un tip par personne ainsi que le montant total (facture + tip) par personne. Il y a des pourcentages de tips prédéfinis, on a également la possibilité de calculer un pourcentage au choix.

Mars 2022

jeu du plus ou moins
Technologies utilisées
  • icone html 5
  • icone css 3
  • icone javascript
  • icone sass

Page d'accueil

Projet Personnel, c'est une page d'accueil que j'ai réalisé comme premier projet du site Frontend Mentor.

L'objectif était de réaliser une page ayant des éléments à superposer et d'utiliser mes acquis en JavaScript pour créer les animations de la barre de navigation.

Février 2022

jeu du plus ou moins
Technologies utilisées
  • icone html 5
  • icone css 3
  • icone javascript
  • icone sass
  • icone bootstrap
jeu du plus ou moins
Technologies utilisées
  • icone html 5
  • icone css 3
  • icone javascript
  • icone sass
  • icone adobe xd

Jeu du Plus ou Moins

Projet Personnel, c'est un jeu en JavaScript, le but est de trouver un nombre entre 1 et 100 généré par l'ordinateur en dix tentatives. Le joueur marque 1 point pour chaque nombre qu'il a trouvé, si il échoue l'ordinateur marque 1 point.

Il y a plusieurs parties du jeu qui sont dynamiques, l'objectif était de réaliser un projet pour travailler sur les aspects du DOM en JavaScript.

Février 2022

calculateur imc
Technologies utilisées
  • icone html 5
  • icone css 3
  • icone php
  • icone adobe xd

Calculateur IMC

Projet Personnel, c'est un calculateur d'IMC en PHP, il y intègre un calculateur et grâce à une formule, celui-ci vous permet de calculer votre indice de masse graisseuse ainsi que votre poids idéal.

Pour l'instant ce projet est fini mais une suite lui sera donnée plus tard, en y intégrant d'autres calculateurs santé.

Janvier 2022

univers running picture
Technologies utilisées
  • icone html 5
  • icone css 3
  • icone javascript
  • icone bootstrap
  • icone adobe xd
  • icone indesign
  • icone illustrator

Univers-Running

Voici mon premier projet, j'ai décidé de réaliser un site vitrine statique, une charte graphique ainsi que les maquettes du site.

C'est un site sur l'univers de la course à pied, on y retrouve des conseils, des informations et des actualités.

Novembre 2021

Contactez-moi

Champs requis *