Société Stock2com 24 rue des cordeliers Lycée Paul Louis Courier A Tours (37) 2 place Grégoire de Tours TOURS (37) Blandine CHOLLET Stage de 2 ème année de BTS SIO option SLAM Du 11/01/2016 au 26/02/2016 Sous la direction de Mickaël Maronneau RAPPORT DE STAGE
TABLE DES MATIÈRES Sommaire Présentation de l entreprise Remerciements 1 Présentation des projets 3 Compte rendu journalier 7 Table des abréviations - Lexique 19 Bilan du stage 21
PRÉSENTATION DE L ENTREPRISE REMERCIEMENTS Présentation de l entreprise Remerciements La société Stock2Com a été créée en novembre 2006 et est actuellement dirigée par René Hys. Elle est située au 24 rue des cordeliers à Tours (37). Son siège est immatriculé auprès des greffes et tribunaux de la ville de Tours. Elle est enregistrée avec le code NAF 6201Z qui correspond au secteur Programmation informatique. La société se base sur trois activités principales qui sont : - La proposition de site dynamique. Principalement pour les agences de voyage, leur permettant ainsi de vendre leurs produits. Ces sites ont plusieurs fonctionnalités proposées par la société, qui sont un graphisme attrayant, un multi-système de payement en ligne, un système de ventes flash, le rappel automatique, l optimisation pour le référencement et une galerie de photos personnalisée. - La proposition de site BtoC et BtoB aux «Tour-Operator», une interface de gestion des options ou/et excursion ou un système rappel automatique sont les différentes fonctionnalités proposées aux Tour-operator. - Le pack de newsletter nommé Créadif, qui permet aux entreprises de programmer des envois et de diffuser des newsletters. Ce pack comporte différentes fonctionnalités qui sont le report de crédits, la gestion des listes, la création par lien URL en HTML, l envoi différé de newsletters, des statistiques de suivi ainsi qu une aide vidéo. Je tiens à remercier monsieur Hys de m avoir accueillie dans sa société Stock2com pour ce stage, ainsi que monsieur Maronneau qui a supervisé ce stage, confié des missions intéressantes et su trouver le temps de nous venir en aide lorsque nous en avons eu besoin. Faire ce stage de deuxième année au sein de votre entreprise fut un plaisir, j ai pu beaucoup apprendre grâce à une équipe solidaire et accueillante. Page 1
PRÉSENTATION DE L ENTREPRISE REMERCIEMENTS Organigramme de la société : René HYS Gérant Olivier MARTIN Directeur Commercial Makimi UCHIDA Comptable Peggy Drouault Technico-Commercial Mickael Maronneau Développeur Kim GAILLARD Stagiaire Blandine CHOLLET Stagiaire Julien RAYNAL Développeur David MOREAU Administrateur Web Maxime REUTIN Développeur en apprentissage Page 2
PRÉSENTATION DES PROJETS Présentation des projets Projet CRM : Version n 1 Réalisation d un système de gestion des relations avec les clients, appelé CRM dynamique permettant à l entreprise de l utiliser lorsque des clients en ont besoin sans avoir à en refaire un nouveau à chaque fois. Ce CRM devra avoir une phase d authentification, puis des interfaces d édition. L édition de la structure de la base de données en fonction des besoins que le client aura renseignés. Une fois la structure de base de données faite, cela permettra de générer les formulaires présents dans l application, les exports de données ainsi que les différentes recherches. Tout d abord il faut faire la phase d authentification grâce à la base de données, donc créer les tables nécessaires dans la base. Ensuite coder l authentification et l accès aux données via CodeIgniter. Ensuite, il faut faire la partie de gestion des entités dans laquelle on peut ajouter, modifier ou supprimer une entité. Et enfin la phase de gestion des données qui nous permet d ajouter, modifier et supprimer les données d une entité sélectionnée. Voici la structure de la base de données de la première version du projet : Page 3
PRÉSENTATION DES PROJETS Version n 2 La seconde version du projet comprend les mêmes fonctionnalités mais la base de données a changé, actuellement il y a une création dynamique des tables contenant les données. Dorénavant, il est préférable de faire une table par type de données dans laquelle on met un identifiant, l identifiant de l entité, le nom du champ, valeur nulle (booléen), la position et la version. Ainsi que des tables contenant les valeurs. Cela permet ainsi lorsque l on veut supprimer une entité de ne pas perdre toutes les données de celle-ci, comme cela s il y a une erreur de manipulation, le client pourra récupérer ses données. La structure de base de données avec la nouvelle version du projet : Page 4
PRÉSENTATION DES PROJETS Version n 3 La troisième version du projet comporte toujours les mêmes fonctionnalités, mais la structure de la base de données a évolué. On ajoute une table champs_relation dans laquelle on a un identifiant et une description. Cela permettra d avoir des relations entre les valeurs contenues dans les tables, par exemple pour une entité «Elèves» on va avoir des champs nom et prénom. Lors de l affichage des valeurs des champs on voudrait avoir une ligne avec le nom et le prénom de chaque élève alors que l on a une ligne pour le nom et une pour le prénom et cela pour chaque élève. Page 5
PRÉSENTATION DES PROJETS Projet Carpy Continuité de la réalisation du site Carpy débuté par monsieur Hys. Carpy.com est le site vitrine de présentation des différentes prestations et localisation de la chaine de salon de coiffure Carpy. La création de ce site permet à la chaine de présenter les différents services proposés, de faire connaître l entreprise et c est un moyen de communication idéal pour s adresser à un large public à moindre frais, cela permet de rester connecté avec les clients. Monsieur Hys nous a demander d ajouter tous les salons sur la carte, ainsi que de leur créer une page chacun afin d avoir des informations spécifiques à chacun. Suite à notre rendez-vous avec monsieur Kunzler de chez Carpy, nous avons différentes modifications à apporter sur le site. Revoir le menu afin de faire d un côté ce qui concerne les clients et de l autre ce qui concerne les franchises, et y ajouter les icones en liens vers les réseaux sociaux. Apporter quelques modifications visuelles sur les différents articles et pages. Ajouter des pop-up lors du clic sur les images avec l image en grand ainsi que le descriptif correspondant. Harmoniser la taille des différentes sections de la page. Ajouter les mentions légales. Sur les pages de contact accessibles depuis les polaroids, - Changer une image de fond qui est trop pixellisée ; - Ajouter le planning pour les différents stages proposés ; - Repenser la page de franchise. Mettre en place un sondage journalier. Page 6
Compte rendu journalier 11/01: Exercices en php afin de voir le niveau et d effectuer des révisions, affichage de données sur une page php depuis une base de données. Découverte du framwork CodeIgniter. 12/01 : Exercices sur CodeIgniter (les mêmes que la veille pour avoir un comparatif) afin de le prendre en main. 13/01 : Commencement du codage du CRM dynamique. Installation de GIT afin de pouvoir travailler en collaboration avec tout le monde. 14/01 : Codage de l étape de connexion terminé. Ajout du système de gestion des entités. Intégration d un template bootstrap au modèle MVC 15/01 : Ajout du système de gestion des entités. Début du système de gestion des données. 18/01 : Suite de la gestion des données, affichage des données par entité. Ajout des boutons pour les fonctionnalités de modifications, suppressions et d ajout des données. 19/01 : Résolution de problèmes rencontrés la veille, pour les boutons qui ne fonctionnent pas correctement. Mise en place de la fonctionnalité d ajout de données. (Fini) Début de la mise en place des modules de suppression et de modification des données. 20/01 : Finalisation des modules de suppression et modification des données. 21/01 : Il nous faut donc adapter la base de données ainsi que le code des modèles de notre MCV. Page 7
Intégration des pages par rapport à la nouvelle base de données (affichage de la liste des données). 22/01 : Carpy : Ajout des liens sur des images qui ont une animation, sans enlever l animation ni modifier le style de base. En faisant un simple ajout de balise <a href= > les images prenaient toutes la même rotation de 5 degré alors que l on veut intervertir entre une à 5 degré et une à 10 degré. Ajout des placemarks des salons : 25/01 : Ajout de l extrait de l article principal en face de sa photo, premier essai avec la fonction the_excerpt, cet essai ne fut pas concluant. Ensuite nous avons essayé avec le plugin «Advanced Excerpt» mais celui-ci ne fonctionne pas sur la version de WordPress que nous avons. Page 8
26/01 : Après les soucis de la veille, nous avons trouvé le bon fichier à modifier afin d afficher le début de l article. On a ajouté la fonction string_limit_words($string, $word_limit) qui permet de définir le nombre de mots à afficher. Ainsi que la fonction new_excerpt_more($more) qui permet d afficher le lien «Lire plus» à la fin de l extrait. On a ici le dernier article publié avec l extrait Et ici nous avons les précédents articles qui eux n ont pas leur extrait 27/01 : Retour au CRM, modification de la fonction de suppression des entités afin que le bouton supprimer une entité fonctionne. On doit faire la liste des champs pour l afficher lorsque l on clique sur la loupe. 28/01 : On a la liste des champs, on souhaite maintenant pouvoir les modifier. Problème lorsque l on modifie un champ, cela modifie les autres de cette même entité. Nouvelle mission sur le site de Carpy, il faut : - Modifier le surlignement qui est en blanc pour que le texte se voit une fois surligner. - Modifier le marker par défaut de google. - Aligner le texte à gauche pour les bulles lorsque l on clique sur mes placemarks. Page 9
- Faire les articles pour chaque salon avec ses coordonnées et les photos. - Mettre les liens sur les articles dans la bulle de description du placemark. Partie 1 le surlignement : (Kim) Partie II le marker : Avant : Après : 29/01 : Partie IV articles avec la mise en page : Mise en place de trois colonnes avec l utilisation de lignes et de colonnes. Page 10
Partie V ajout des liens sur les placemarks : 01/02 : CRM : Modification du formulaire d ajout d un champ, en fonction du type que l on sélectionne, un champ de sélection apparaît, soit obligatoire soit défaut. Cela a été fait avec JQuery. Puis finalisation de ce module avec l ajout du champ dans la base de données. Retour sur le module de modification de champ. 02/02 : Finalisation de la modification des noms de champs. Problèmes avec la selection de la table à modifier. Page 11
Suppession d un champ Passage à la gestion des données. 03/02 : Affichage de la liste des données en fonction de l entité dans laquelle elles sont. Début de la fonction d ajout des données, mais elle ne fonctionne pas encore entièrement. Site Carpy : - Passer le surlignage en noir et non en blanc ( sous Firefox ) - Mettre le texte des articles en justifié - Diminuer la largeur des blocks pour queles images reprennent leur largeur d origine Page 12
- Retirer les informations sur l auteur, le fil, la partie interactive et le titre car il apparaissait deux fois. - Sur la carte, ajouter le logo de carpy sur chaque placemark et remplacer le lien «site» par «Voir le salon». 04/02 : Création des pages de presse, de recrutement, de franchise et mise en place d un lien vers le site aveda. Et mise en place des liens de chaque pages sur les polaroides en bas du site Carpy. Page presse : Page recrutement Page 13
Page franchise : Polaroides : 05/02 : Amélioration de la page formation modification de la vidéo de fond. Ajout d un description des différentes formations proposées. Correction d un bug, le menu ne fonctionnait que sur la page d accueil. Amélioration sur le visuel des formulaires. (Page recrutement) Tous les formulaires ont désormais cette apparence. Page 14
08/02 : CRM : Finalisation de l ajout des données. Module de suppression des données, petit soucis de redirection après la suppression. Passage à la modification, l affichage des données actuelles ne se fait pas toujours. Carpy : Enlever le fil Home/article Enlever un blanc en dessous du titre de l article. 09/02 : Problème de redirection après la suppression réglé. Résolution du problème d affichage des données de la base. Finition de ce module. Mise en place d un bouton pour vider une table afin de pouvoir la supprimer sans supprimer les champs présents dedans un à un. Fini et fonctionnel. Finalisation du projet CRM version 2. Modification : Vider un table : Passage à la version 3 du CRM. 10/02 : Ajout d un onglet configuration au menu avec la gestion des entités et des données. Mise en place d un menu dynamique, affichage de toutes les entités dans le menu. Rendez-vous avec le gérant de Carpy afin de voir avec lui les dernières corrections à apporter au site. Compte rendu de l entretient avec monsieur Kunzler par mail à monsieur Hys afin qu il prenne connaissance des nouvelles requêtes de celui-ci. 11/02 : Carpy : Ajout des icones des réseaux sociaux au menu du site. Modification de l ordre des pages dans le menu. Sur les pages des salons, modification de la disposition des photos et textes. Page 15
Modification de l image de fond sur la page du service consomateur. Modification du lien sur la polaroid d aveda. Ajout du planning et mise en avant des liens vers le planning en pdf et la description des formations. Recadrage de l image de fond de la page franchise, et mise en place d une nouvelle mise en page. La précédente ne plaisait pas au responsable il faut donc en penser une autre. Ancienne page : Nouvelle page : 12/02 : Recherches afin d afficher l image du dernier article publié a coté du texte correspondant. Utilisation du plugin Latest Post. Modification du logo sur tous les placemarks et les articles. Début de recherches pour mettre en place un quiz interactif à réponse immédiate. (Pas encore abouti) Rendez-vous avec monsieur Kunzler afin de visualiser les modifications effectuées depuis le dernier entretient. Suite à cela il nous a fait part des soucis qu il a rencontré et que nous avons dû résoudre pour lundi matin. Menu : - Remettre les liens vers les réseaux sociaux (Ils ne fonctionnent que sous chrome) Page 16
Sliders : - Mettre les textes correspondant aux photos dans les sliders Placemarks & Articles : - Réduire la taille du logo et mettre le téléphone en gras Franchise : - Mettre les liens vers les images en pdf Maps : - Recentrer la map de façon à voir apparaître tous les salons dès le début - Remettre la bonne adresse pour le salon de Mondeville 15/02 : Mise en place du sondage demandé par monsieur Kunzler. 16/02 : Résolution d un problème sur le lien du «Lire plus» qui ne renvoyait pas au bon article. CRM : Mise en place d un jeu d essai significatif, puis commencement de la gestion des relations entre les différentes valeurs entrées dans la base. Module d ajout, modification et de suppression des relations. Renseignement de la relation lors de l ajout des données. 17/02 : Carpy : Le site n est pas responsive car le thème utilisé ne l est pas, il faut faire la mise à jour du thème parent qui est disponible pour que cela affecte le thème enfant qui est utilisé. Remise des photos dans les vignettes des actus. Modification de plusieurs photos dont la qualité était inférieure aux autres. Changement des couleurs de fonds. Ajout d un logo de téléchargement sur certaines images. Mise en avant des polaroids. Page 17
Interversion de deux sections. Menu en transparence. CRM : Affichage des champs en fonction de la relation qu ils ont. 18/02 : Carpy : Adaptation du site sur tous types d écrans. 19/02 : Finalisation du site de Carpy.com CRM : Affichage des données en fonction de leur relation. 22/02 : CRM : fonction de suppression des données. Boutique en ligne de Carpy : ajout des photos sur tous les produits. 23/02 : Rédaction d une note d utilisation pour le site Carpy. 24/02 : CRM : Module de modification des données. Résolution d un problème d affichage lors de l ajout d une donnée. 25/02 : Problème avec la fonction vider une entité, normalement elle devrait supprimer les champs et leurs données. Résolu. Problème lors de l affichage des données. Résolu. 26/02 : Rédaction d un guide d utilisation pour le CRM universel. Page 18
TABLE DES ABRÉVIATIONS - LEXIQUE Table des abréviations - Lexique MVC : Modèle vue contrôleur C est un modèle destiné à répondre aux besoins des applications interactives en séparant les problématiques liées aux différents composants au sein de leur architecture respective. CodeIgniter : CodeIgniter est un framework PHP qui s'exécute côté serveur. C'est un ensemble de ressources qui va vous permettre de développer plus rapidement en PHP. CRM : Gestion des relations avec les clients, en anglais customer relationship management. Il s'agit de l'ensemble des outils et techniques destinés à capter, traiter, analyser les informations relatives aux clients et aux prospects, dans le but de les fidéliser en leur offrant le meilleur service. WAMPServer : C est une plateforme de développement Web de type WAMP (Windows Apache MySQL PHP), permettant de faire fonctionner localement des scripts PHP. GIT : C est un logiciel de gestion de versions décentralisé. Cela permet de sauvegarder le travail que l on effectue sur un serveur et à nos collaborateurs de le récupérer tout en conservant les versions antérieures. WordPress : C est un système de gestion de contenu. Cela permet à tous de créer un site internet. WordPress repose sur un système de «thèmes» qui représentent en quelques sorte le squelette du site sur lequel vous pouvez ensuite apporter les personnalisations que vous souhaitez. Page 19
TABLE DES ABRÉVIATIONS - LEXIQUE MySQL : C est un système de gestion de bases de données relationnelles. Un serveur de bases de données stocke les données dans des tables séparées plutôt que de tout rassembler dans une seule table. Le SQL dans "MySQL" signifie "Structured Query Language" : le langage standard pour les traitements de bases de données. FileZilla : C est un logiciel de transfert FTP (File Transfert Protocol). Il permet d'envoyer vos pages web (html, css, php...) sur un ordinateur distant (on parle de serveur). Une fois les pages arrivées sur votre serveur, vous pouvez consulter en ligne votre site Internet. FTP : Protocole de transfert de fichiers, c est un protocole de communication destiné à l'échange informatique de fichiers sur un réseau TCP/IP. Il permet, depuis un ordinateur, de copier des fichiers vers un autre ordinateur du réseau Template : C est en fait l'architecture du design d'une page. En quelques sortes la trame de fond. C'est le template qui va définir la position des éléments de votre page. Bootstrap : Bootstrap est une collection d'outils utile à la création de sites et d'applications web. C'est un ensemble qui contient des codes HTML et CSS, des formulaires, boutons, outils de navigation et autres éléments interactifs, ainsi que des extensions JavaScript en option. Bootstrap fournit une feuille de style CSS qui contient des définitions de base pour tous les composants HTML, ce qui permet de disposer d'une apparence uniforme pour les textes, tableaux et les éléments de formulaires. Page 20
BILAN DU STAGE Bilan du stage Ce stage au sein de la société stock2com m a permis de découvrir un nouveau framework CodeIgniter, lequel est très pratique et va sans aucun doute m être utile par la suite. Mais aussi d approfondir mes connaissances à propos de WordPress, en l utilisant quotidiennement. Travailler chez Stock2Com m a fait découvrir le milieu du travail et l envie d aller travailler le matin pour finir ce qui a été démarré la veille. J aimerais travailler dans une entreprise comme celle-ci, l ambiance y est agréable et l entraide est de mise. Les missions confiées ont été réalisées et rendu dans les temps impartis, avec un cahier des charges entièrement rempli. Elles sont utiles à l entreprise, cela leur permettra un gain de temps à l avenir à l image du CRM Universel que nous avons mis en place. Ce que nous avons fait, le gérant en avait besoin mais n avait pas le temps actuellement de le faire, car ils ont en ce moment plusieurs projets importants. Ce stage a confirmé mes choix, et m a permis de choisir l orientation qui me convient parfaitement pour l an prochain. J ai pu préciser mon orientation professionnelle future qui serait idéalement plus dans le design web que le développement a proprement parlé. Page 21