BTS Services informatiques aux organisations Session 2017 E4 Conception et maintenance de solutions informatiques Coefficient 4 DESCRIPTION D UNE SITUATION PROFESSIONNELLE Épreuve ponctuelle PARCOURS SISR Contrôle en cours de formation PARCOURS SLAM NOM et prénom du candidat : ROGGEMANS Nicolas N candidat: Contexte de la situation professionnelle La section BTS SIO du lycée Saint-Adjutor de Vernon. Intitulé de la situation professionnelle Réalisation d'un site internet permettant de présenter les compétences acquises durant les années de BTS SIO à travers les situations issues des TP, PPE ou stages. Période de réalisation : du 7/09/2015 au 02/11/2015 Lieu : Centre de Formation Modalité : Seul En équipe Principale (s) activité (s) concernée (s) A1.3.4 Déploiement d'un service A4.1.2 Conception ou adaptation de l'interface utilisateur d'une solution applicative A5.2.4 Étude d une technologie, d'un composant, d'un outil ou d'une méthode Conditions de réalisation (ressources fournies, résultats attendus) Ressources : Tutoriels HTML CSS Résultat attendu : Un site internet répondant aux besoins. Productions associées Procédure de déploiement du site Modalités d accès aux productions URL de l applicatif : http://www.roggemans.eu Site Web : https://www.1and1.fr Code d accès hébergeur : Identifiant : nicolas@roggemans.fr mot de passe : Adjutor2015# Tutoriel de déploiement : http://stadjutor.com/plateforme_sio/suivi_ppe/documents_eleves/roggemansn_portefeuille_projet 134_act9_doc1.pdf Login administrateur : Identifiant : u82698270 mot de passe : Adjutor2015#
I Présentation de la situation professionnelle Dans le cadre de ma formation de B.T.S Services Informatiques aux Organisations, je dois présenter mon parcours professionnel lors de l'épreuve Parcours de Professionnalisation évaluée en CCF en fin de 2 ème année. Lors de cette épreuve, après avoir présenté mon parcours et mes motivations pour avoir intégrer ce BTS, je dois mettre en avant les compétences acquises aussi bien en PPE qu'en stages en illustrant différentes situations qui doivent couvrir le plus largement possible les activités du référentiel BTS SIO. Pour cela, j'ai conçu un site internet nommé portfolio dont l'objectif est de présenter les acquis de formation et les compétences que j ai pu acquérir tout au long du BTS. Il permet également à des recruteurs éventuels de s informer sur mes compétences et de consulter mon CV rapidement. La possibilité pour eux de me contacter via le formulaire de contact est un réel avantage dans ma quête de réussite future. II Productions réalisées N ayant pas de connaissances en matière de langage HTML et CSS, j'ai commencé par l'apprentissage de différents tutoriels mis à disposition qui m ont permis d acquérir quelques bases nécessaires pour la production de ce Portfolio. Un site «exemple» nous a guidés vers la production attendue. En parcourant le web et après avoir finis les tutoriels, quelques idées me sont venues quand à la présentation de mon site. Pour la charte graphique j ai opté pour des choix simples : 3 onglets (Accueil, Compétences, Curriculum Vitae) pour ne pas encombrer le menu. Le choix de ne pas dédié un onglet pour le contact a été remplacer par un icône «cliquable» dans la page Accueil. Un site sobre et lisible (couleur sombre). Une police de caractère plutôt grande toujours dans le but de lisibilité. Il sera possible pour moi d intégrer mes réalisations et mes compétences en back-office grâce au système d automatisation que j ai mis en place. En ce qui concerne l hébergement j ai choisis l hébergeur 1&1 ( voir tutoriel de déploiement)
PORTFOLIO A1.3.4 Déploiement d un service ROGGEMANS Nicolas La situation concerne l activité : A1.3.4 Déploiement d'un service ; Nous avions la possibilité de l accomplir entre le 07/09 et le 02/11. Dans le cadre d un contexte simulé et suite à la mise en œuvre de mon site pour présenter mes compétences il est nécessaire de déployer ce service sur un serveur hébergé sur internet. Cette opération peut être manuelle en suivant le tutorial de déploiement ou automatisée. L objectif est de définir la méthodologie du service jusqu'à sa mise en production. Cette activité m a permis d acquérir certaines compétences : C1.3.4.1 Mettre au point une procédure d'installation de la solution C1.3.4.2 Automatiser l'installation de la solution C1.3.4.3 Mettre en exploitation le service L utilisation de PC reliés à internet et la disponibilité des professeurs nous ont permis d accomplir cette activité. Je me suis posé plusieurs questions avant de commencer mon travail et pendant : - Comment créer un site sur internet? - Comment créer un nom de domaine et l associer au site? - Comment transférer mes pages html vers le site? - Comment automatiser le déploiement de mon site? Cela m a permis d aboutir aux résultats attendus. J ai choisis d héberger mon site chez un hébergeur payant disposant d un data center en Allemagne ; il s agit d un des leaders du marché : 1&1. J ai dédié deux séances de PPE à l hébergement de mon site et à une solution d automatisation. (Cases colorées). J ai aussi travaillé en parallèle chez moi, notamment sur l automatisation. Travail en classe : environ 6H 07/09 14/09 21/09 28/09 05/10 12/10 Travail hors-cours : 2H Ayant déjà évoqué l hébergement et la façon manuelle de transférer les données via FileZilla (http://stadjutor.com/plateforme_sio/suivi_ppe/documents_eleves/roggemansn_portefeuille_projet134_act9 _doc1.pdf ), je vais expliquer l automatisation que j ai mis en place pour facilité le transfert de ces dernières. 1- J ai d abord créé un fichier «Nicolas» dans le disque local C : puis dans celui-ci un fichier intitulé «PAGES» dans lequel il faut mettre toutes les pages nécessaires au bon fonctionnement du site. Page 1 / 6
PORTFOLIO A1.3.4 Déploiement d un service ROGGEMANS Nicolas 2- J ouvre un nouveau fichier Bloc-notes que j enregistre directement en.bat 3- Après ceci je peux commencer à coder : Je commence par déclarer mes trois variables (adresse du site, user du ftp, mot de passe ftp) grâce à @echo off qui sert de cache aux commandes. Les REM sont des remarques Si je lance ce programme, j obtiens ceci... Page 2 / 6
PORTFOLIO A1.3.4 Déploiement d un service ROGGEMANS Nicolas 4- Maintenant, il faut passer au traitement. On continue de coder à la suite et on efface le texte d avant grâce à la commande cls (= clear screen). On fixe les variables par défaut pour l adresse du site et le user FTP, on demande également le mot de passe. Il va effe ctu er le tran sfer t des don née s. Page 3 / 6
PORTFOLIO A1.3.4 Déploiement d un service ROGGEMANS Nicolas 5- On continue à coder et on arrive à la connexion au serveur. (explications directement sur l image). 6- Le programme est terminé, il faut maintenant lancer le fichier et suivre les instructions. Page 4 / 6
PORTFOLIO A1.3.4 Déploiement d un service ROGGEMANS Nicolas [ ] Je pense avoir atteint les objectifs fixés car mon site est fonctionnel et je vais pouvoir y mettre mes compétences acquises. Il est vrai que cela a été difficile car je n avais que quelques connaissances en matière d hébergement mais des recherches m ont permis d amener à bien ce travail. Avec le temps, je pourrais apporter quelques évolutions à mon site en terme d esthétique ou pour facilité la lecture de celui-ci. Page 5 / 6
PORTFOLIO A1.3.4 Déploiement d un service ROGGEMANS Nicolas Page 6 / 6
PORTFOLIO A4.1.2 Conception ou adaptation de l'interface utilisateur d'une solution applicative ROGGEMANS Nicolas La situation concerne l activité; A4.1.2 Conception ou adaptation de l'interface utilisateur d'une solution applicative. Nous avions la possibilité de l accomplir entre le 07/09 et le 02/11. L objectif est de concevoir un Portfolio pouvant répertorier les compétences acquises pendant les deux années de BTS en respectant les contraintes imposées. Cette activité m a permis d acquérir certaines compétences : C4.1.2.1 Définir les spécifications de l'interface utilisateur de la solution applicative C4.1.2.2 Maquetter un élément de la solution applicative C4.1.2.3 Concevoir et valider la maquette en collaboration avec des utilisateurs Comment disposer mon Portfolio pour qu il soit lisible et que les informations soient accessibles rapidement? J ai tout d abord commencé par essayer différentes configurations en commençant par le positionnement du menu ; ayant essayé de le positionner un peu partout sur la page d accueil, j ai finalement opté pour une position en haut de page pour l aspect lisible et clair avec une couleur sobre qui me parait appropriée pour un Portfolio. J ai également choisis de mettre trois onglets dans ce menu : Accueil, Compétences et Curriculum Vitae. Pour ajouter ma touche personnelle, j ai choisis un Portfolio défilant (voir vidéo) que j ai fabriqué en l aide du langage CSS ( voir l extrait de code). Video MENU Page 1 / 3
PORTFOLIO A4.1.2 Conception ou adaptation de l'interface utilisateur d'une solution applicative ROGGEMANS Nicolas Après avoir maquetté ma solution applicative et l avoir validé avec les professeurs, j ai compris qu elle correspondait aux attentes. Je me suis donc lancé dans sa conception en profondeur. J ai inséré mon CV directement sur la page dans l onglet curriculum Vitae : J ai créé un formulaire de contact accessible depuis ce petit icône dans l accueil : L utilisateur peut ainsi me contacter après qu il est entré les informations demandées. Page 2 / 3
PORTFOLIO A4.1.2 Conception ou adaptation de l'interface utilisateur d'une solution applicative ROGGEMANS Nicolas Le but principal de ce Portfolio est de répertorier les compétences acquises et qu elles soient visibles par les utilisateurs. C est pourquoi j ai décidé de créer un tableau dans la page «compétences» pour pouvoir y ajouter mes compétences une fois acquises. En cliquant sur les compétences, on est redirigé vers la fiche de validation de compétences de l activité. Tout au long des deux années de BTS, je pourrai adapter ma solution applicative et l interface utilisateur en fonction des besoins et de mes envies. Je pense avoir validé cette activité car mon Portfolio à été réfléchis et maquetté ; il possède maintenant une interface navigable. Page 3 / 3
PORTFOLIO A5.2.4 Étude d une technologie, d'un composant, d'un outil ou d'une méthode ROGGEMANS Nicolas La situation concerne l activité ; A5.2.4 Étude d une technologie, d'un composant, d'un outil ou d'une méthode. Nous avions la possibilité de l accomplir entre le 07/09 et le 02/11. L objectif est d'appliquer des nouvelles connaissances pour la conception du Portfolio et sa fonctionnalité. Cette activité m a permis d acquérir certaines compétences : C5.2.4.1 Se documenter à propos d'une technologie, d'un composant, d'un outil ou d'une méthode C5.2.4.2 Identifier le potentiel et les limites d'une technologie, d'un composant, d'un outil ou d'une méthode par rapport à un service à produire. Comment appliquer une technologie, un composant, un outil ou une méthode dans le but de la création de mon Portfolio? Une fois mon Portfolio terminé, j'ai pensé nécessaire de rendre fonctionnel mon formulaire de contact à l'aide du langage PHP de façon à ce que les personnes qui visitent le site et qui souhaitent me contacter puissent le faire directement via le formulaire. Ne connaissant pas les bases de cet outil, j'ai suivis plusieurs tutoriels sur Internet afin de comprendre son fonctionnement, et j'ai réfléchis à la manière dont j'allais l'appliquer à mon site. Après ceci, j'ai donc réussi à rédiger ce script : (J'ai repris les informations que j'avais déjà entrées dans le code HTML tel que le nom, le prénom, l émail et l'espace pour le message. ) J'ai enregistré le fichier sous le nom de «contact.php» et je l'ai lié à la page HTML du formulaire. Page 1 / 2
PORTFOLIO A5.2.4 Étude d une technologie, d'un composant, d'un outil ou d'une méthode ROGGEMANS Nicolas Pour testé le formulaire, je me mets à la place d'un utilisateur : En appuyant sur «envoyer» après avoir saisies les informations, ce message apparaît pendant 3 secondes environ puis on est redirigé automatiquement vers la page d'accueil du Portfolio. Il récapitule les informations saisies et confirme que le message a bien été transmis. En consultant ma messagerie, je peux voir que j'ai reçu instantanément un mail me résumant les informations qui m'ont été envoyées. Ainsi le langage PHP me permet de recevoir directement sur ma boite mail les différentes approches pour me contacter. Néanmoins, l'envoie de message nécessite un service de messagerie à l'utilisateur car le serveur qui héberge le site n'a pas de serveur SMTP, qui est un protocole pour envoyer des mails. Ceci constitue une limite à cet outil. Page 2 / 2