RAPPORT DE STAGE

Développeur Web : back End et front endAntoine ColotVestiaire collective | 33 BLV du general martial valin – 75015 paris

23 MAI-24 JUIN 2016

Table des matièresREMERCIEMENTS............................................................................................................................3

INTRODUCTION...............................................................................................................................3

I- L’ENTREPRISE ET SON SECTEUR D’ACTIVITÉ..................................................................................41) LE SECTEUR D’ACTIVITÉ.....................................................................................................................42) L’ENTREPRISE..................................................................................................................................4

II-MON STAGE.................................................................................................................................5

III-CONCLUSION..............................................................................................................................8

IV-ANNEXES....................................................................................................................................91) ANNEXE 1......................................................................................................................................92) ANNEXE 2....................................................................................................................................103) ANNEXE 3....................................................................................................................................10

RAPPORT DE STAGE

Développeur Web : back End et front end

2

RemerciementsAvant toute chose, je souhaite remercier Alexandre Cognard, directeur technique de

Vestiaire Collective, pour m’avoir offert cette opportunité d’approfondir mes connaissances et compétences et d’acquérir une expérience au sein d’une startup évoluant à grande vitesse et rapidement devenue une leader dans son domaine.

Je tiens aussi à remercier Marc Brillaut, Fabrice Ezzine et Jean Bélicot, ainsi que toute l’équipe de développement, qui ont pu me consacrer une majeure partie de leur temps afin d’apporter leur aide et leurs connaissances lorsque je leur demandais, mais aussi m’encourager à résoudre certains problèmes seul.

IntroductionLe marché de l’occasion a le vent en poupe et le prêt-à-porter ne fait pas exception.

Chaussures, sacs, vêtements, parfois de grandes marques, sont vendus par des particuliers jusqu’à 70% moins cher que du neuf. Une petite dizaine de sites Internet surfent sur la tendance. Dans le cadre de ma première année de BTS SIO, j’ai souhaité appliquer mes connaissances au service d’une entreprise étant spécialisée dans ce domaine : Vestiaire Collective. Le site a été lancé en 2009, avec le but d’être une plateforme communautaire (telle que Facebook) sur laquelle les membres pourraient acheter et vendre des vêtements et accessoires de luxe d’occasion. Le concept connut un certain succès très rapidement et aujourd’hui, près de 100 000 personnes s’inscrivent sur le site chaque mois, rejoignant ainsi une communauté de 4 millions de membres. Cette start-up, composée de 6 personnes à sa fondation emploie aujourd’hui près de 200 personnes dans Paris, mais aussi à l’international (New York, Londres, Berlin).Le but de ce stage était pour moi d’appliquer les connaissances apprises au cours de cette année de BTS à un milieu professionnel, mais aussi d’approfondir celles-ci, et acquérir de nouvelles compétences : nouveaux langages de programmation, travail en équipe, gestion de projets.Vestiaire collective était une entreprise idéale dans laquelle réaliser mes objectifs : en effet, les langages de programmation étaient exactement ceux appris durant cette première année de BTS : PHP pour le back-end et HTML, CSS pour le front-end et SQL pour la gestion de base de données. De plus, le Javascript et Jquery sont très utilisés pour le développement front-end, c’était donc l’occasion pour moi d’apprendre en peu de temps ces deux langages afin d’accomplir les tâches qui m’étaient confiées.

3

I- L’entreprise et son secteur d’activité

1) Le secteur d’activité

Le marché de biens d’occasion est un marché en plein essor, et ceci pour plusieurs raisons :

-un climat économique difficile, poussant les consommateurs à faire plusieurs restrictions budgétaires, et l’achat d’objets d’occasion est un moyen très efficace de faire des économies, y compris pour le prêt-à-porter.

-les effets de mode sont très changeants et certains articles dans la tendance peuvent très rapidement devenir dépassés, et cela peut pousser les consommateurs à préférer l’occasion au neuf, s’ils sont réticents à l’idée de dépenser des sommes importantes pour quelque chose qui pourrait ne pas durer.

-Internet a permis un essor très important de ce marché, grâce à la facilité que cela représente par rapport aux dépôts-vente classiques. Des sites comme eBay, et Vestiaire Collective pour le prêt-à-porter permettent à des gens du monde entier de vendre ou d’acheter des articles, parfois introuvables dans leur pays, à des prix très intéressants.

Toutefois, l’un des problèmes majeurs dans ce marché pour des biens de prêt-à-porter est le contrôle de l’authenticité des biens. En effet, des sites majeurs tels que eBay ne pouvaient assurer un contrôle de qualité pour ce genre d’articles et ont donc suspendu les ventes de ce type de bien. C’est à ce moment que Vestiaire Collective a été fondé.

2) L’entreprise

Fondée par Sébastien Fabre, PDG actuel de l’entreprise, Alexandre Cognard, Henrique Fernandes, Sophie Hersan, Christian Jorge et Fanny Moizant en 2009, Vestiaire Collective est rapidement devenu un leader de ce marché, grâce au contrôle expert de l’authenticité et de l’état des produits qui sont vendus sur leur site. 100% des articles sont contrôlés par leurs équipes d’experts avant leur vente. Ceci a permis à Vestiaire Collective d’assurer la confiance et la fidélité des utilisateurs du site, et ainsi d’acquérir plus de 4 millions de membres dans leur communauté en 6 ans.

Le processus de contrôle et d’envoi se fait en 6 étapes :

-Le vendeur propose son produit sur le site, le décrit et poste plusieurs photos, puis fixe un prix, qui peut varier.

4

-Vestiaire Collective contrôle dès ce moment le produit proposé, et s’il n’y a aucun défaut, celui-ci se retrouve dans le catalogue. Environ 70% des biens proposés sont acceptés.

-La communauté peut ensuite commenter le produit, contacter le vendeur ou Vestiaire Collective pour plus d’informations, voire même essayer de discuter un prix.

-Le vendeur peut ensuite envoyer son produit dans les bureaux de Vestiaire (dans le 15ème arrondissement de Paris), qui sera ensuite contrôlé selon deux critères : l’authenticité et la conformité.

-La transaction est faite entre le vendeur et l’acheteur, Vestiaire prend une commission de 25% en moyenne.

-Enfin, le bien est soigneusement emballé, puis envoyé à l’acheteur.

Durant mon stage, j’ai toutefois passé la plupart de mon temps avec l’équipe de développement, composée de 28 personnes, qui travaillaient donc sur le site et l’application mobile :

II-Mon stageDurant ce mois passé à Vestiaire Collective avec le département IT, j’ai pu travailler sur plusieurs

missions touchant à plusieurs aspects différents du site : le front-end, utilisant surtout le HTML, CSS et Javascript (et JQuery) comme langages de programmation et le back-end qui utilisait majoritairement le PHP.

IT: 28 personnes

DEV

14 employés

1 chef d’équipe

Dev Mobile 5 employés

Gestion De Projet

2 employés

1 chef d’équipe

Q&A 1 employé

Système et réseau 2 employés

Web-Design 2 employés

5

Il existe trois environnements différents du site de Vestiaire Collective :

-l’environnement « dev », réservé donc aux développeurs où tous les tests sont effectués et les missions (données aux développeurs par le biais de tickets sur PivotalTracker) sont réalisées.

-l’environnement « stage », qui est un intermédiaire entre le « dev » et la version finale du site, et qui permettait aux différents membres de l’entreprise de valider les missions confiées développeurs.

-la version finale, et visible par n’importe quel utilisateur du site.

Les premiers travaux effectués chez Vestiaire m’ont surtout permis de me familiariser avec l’environnement de travail et de prendre mes repères. Ainsi, j’ai donc réalisé une interface afin d’aider Marc (mon tuteur de stage) dans son travail sur le menu des soldes pour Iphone, cette interface permettait de voir les différentes tâches à effectuer, et utilisait des notions basiques de HTML, CSS, et PHP. Ceci m’a surtout permis d’apprendre à « commit » mon travail, grâce à SVN. En effet, toutes les modifications apportées aux fichiers du site étaient d’abord exclusives à celui qui le réalisait, puis une fois le commit passé et validé, toute l’équipe IT avait accès à cette version du fichier, ceci grâce à la commande update sur SVN, qu’il fallait effectuer au moins une fois par jour pour travailler sur la bonne version des fichiers. Un réflexe qui s’avérait indispensable pour ne pas supprimer des blocs entiers de code lors de ses propres commits. J’effectuais aussi par la même occasion quelques requêtes SQL, surtout pour me familiariser avec la base de données très conséquentes du site.

Ce stage fut aussi l’occasion d’apprendre à manipuler des langages que je n’avais jusque-là peu voire pas utilisés : le JavaScript et le Jquery. J’ai donc appris auprès de l’équipe front-end quelques notions de ces langages, notamment la création de carousels (voire Annexe 1). Toutefois sur ma version du site, celui-ci n’était pas en « responsive » et le carousel ne se modifiait pas selon la taille de l’écran. Une mise à jour du fichier config.php permit de régler ce problème. Cette mission consistait surtout à m’apprendre les bases de ce langage et n’avait donc pas d’utilité pour l’entreprise.

Exemple de carousel sur le site de Vestiaire Collective

6

Après ces quelques travaux de familiarisation, je pus attaquer des travaux plus sérieux, servant réellement l’entreprise. Le premier fut l’implémentation de balises de Google Analytics sur plusieurs liens, afin d’analyser lesquels sont cliqués, survolés,etc… sur la page d’un produit. Ainsi, je dus effectuer cette manipulation sur une trentaine de lien, avec pour testeur un code couleur affichant si le lien concerné encadré ou surligné selon l’information souhaitée.

Enfin, je pus effectuer la réalisation d’un ticket de PivotalTracker du début à la fin. Celui-ci avait été demandé par un employé du service finance de Vestiaire, et concernait une erreur qui permettait aux utilisateurs voulant régler un paiement en 3 fois mais ayant déjà un paiement de ce type non réglé de le faire. Certains utilisateurs (très peu étaient au courant) pouvaient donc en abuser en choisissant le paiement en 3 fois à plusieurs reprises sans avoir à payer la somme intégralement. Ainsi, il fallut ajouter une valeur dans la base de données (3XForbidden) pour tous les moyens de paiements (carte bleue, Paypal etc…). Une fois l’erreur corrigée sur l’environnement « dev », la personne ayant donné le ticket valida mon travail sur l’environnement « stage » puis celui-ci fut directement implémenté sur le site.

Le travail le plus important que j’effectuai durant ce stage fut la création d’un « dashboard » ou tableau de bord, dans le style de ceux déjà existant, exploitant un Json qui affichait les noms de domaines appartenant au site arrivant à expiration dans 30, 60 et 90 jours (voir Annexe 2) Ce dashboard pourra ensuite être utilisé pour d’autres infos de ce genre.

Cette mission fut assez complète en terme d’apprentissage car les langages utilisés furent le HTML et CSS(avec Bootstrap), le PHP pour l’exploitation du json, et du jquery pour une actualisation automatique de la page et la création d’une alerte sonore et visuelle à l’écran lorsqu’un nouveau nom de domaine entrait dans la période des 30 jours avant son expiration. Les quelques problèmes rencontrés furent surtout liés avec l’apprentissage de Bootsrap qui est un outil très pratique pour le CSS d’une page, mais que je ne savais pas du tout manipuler.

Après avoir créé ce dashboard, je dus ensuite créer un Cron (un outil permettant de réaliser automatiquement des tâches récurrentes), afin d’envoyer un e-mail à l’administrateur système chaque matin l’informant des différents noms de domaines arrivant à expiration prochainement. Il fallut donc créer un Template d’e-mail étant dans le même style que ceux de Vestiaire Collective.

7

III-ConclusionCe stage au sein de Vestiaire Collective fut une opportunité incroyable, me permettant

d’approfondir mes connaissances en programmation, que ce soit en front ou en back-end, mais aussi d’acquérir une expérience professionnelle dans une entreprise évoluant très rapidement. Je pus découvrir presque toutes les facettes du métier de développeur web, que ce soit la programmation, la gestion des projets, du temps qui était souvent très voire trop précieux, et la résolution de problèmes, parfois en pleine nuit… Ce fut une expérience réellement enrichissante, qui me permit de rencontrer des personnes accueillantes et à l’écoute, et qui me conforte sur la voie que j’ai choisi en faisant un BTS SIO. Encore un grand merci à tout Vestiaire !

8

IV-Annexes1) Annexe 1

HTML

CSS

JavaScript

9

2) Annexe 2

3) Annexe 3

Schéma du réseau de Vestiaire Collective

10