Compte Rendu : Environnement WEB HNT · Compte Rendu Environnement 3 Compte Rendu WEB HNT BTS-SIO Les fonctionnalités attendues : Contexte : Pour un chaque page générée dynamiquement,

BTS-SIO

HOULLIER Fabrice (chef de projet)

FONTAINE Ludovic

HOARAU Anthony

Compte Rendu : Environnement WEB HNT

1 Compte Rendu

Compte Rendu Environnement WEB HNT BTS-SIO

Sommaire :

Contexte Général ………………………………………………………………page 2

Partie technique

Les Fonctionnalités attendues ……………………………………………page 3

La Reprise sur Incident ……………………………………………………….page 10

Partie gestion de projet

La gestion du projet …………………………………………………………..page 13

Bilan ………………………………………………………………………………….page 14

2 Compte Rendu


Contexte Général :

Humanist Network souhaite désormais faire évoluer son site Web vers une solution

entièrement dynamique pour ainsi faciliter la mise à jour de certaines informations tel que la

liste des news ou encore la page d’accueil.

La nouvelle version du site Web devra être hébergée sur l’un des serveurs de la société dont

la configuration avait été mise en place lors du projet précédent.

La solution devait être développée avec PHP et MySQL (avec accès PDO aux données)

3 Compte Rendu


Les fonctionnalités attendues :

Contexte :

Pour un chaque page générée dynamiquement, un formulaire de mise à jour devait être

créé.

Ce formulaire étant réservé à l’administrateur du site et ne peux être accessible qu’après

authentification.

Les pages que l’on devait rendre dynamique sont :

- Les news de la page d’accueil

- La liste des membres (cf. PPE3)

- L’historique (présidents et effectifs)

- Liens utiles

Déroulement de la mission :

Tout d’abord nous avons commencé par rendre les « en-tête », les menus et les « pieds de

pages » totalement dynamique.

Voici les lignes de codes que nous avons utilisés pour cela

4 Compte Rendu


Ensuite, afin d’alimenter les pages : news, liens utiles, historiques et la liste des membres ;

nous avons mis en place une connexion à la base de données qui récupère toutes les

informations nécessaire. Nous avons alors mis en place deux solutions qui sont les suivantes.

Dans la

première les

données

étaient

récupérées

et manipulé

directement

sur la page

Dans la

deuxième,

une fonction

permet de

récupérer les

données

dans la base

de données

pour ensuite

les manipuler

grâce à la

collection

5 Compte Rendu


(Suite des lignes de code de la deuxième solution.)

Au final, celle que nous avons retenu la deuxième solution car la première avait déjà été

utilisé lors du projet précédent. Nous ne voulions pas reprendre la même. Au contraire

avons fait des recherche pour ainsi innover et tirer profit des autres avantages que procure

la deuxième solution tel que le fait de pouvoir manipuler les objets directement depuis la

collection.

Voici les lignes de codes qui

nous ont été nécessaires

pour établir une connexion

à la base de données.

6 Compte Rendu


Connexion de l’administrateur :

Puis nous avons mis en place un bouton dans le menu principale afin que l’administrateur

puisse se entrer ses identifiants et se loguer sans difficultés sur le site.

La ligne de code nécessaire à cette tâche est la suivante :

<li class="fin first"><a href="Ludo.php">Se connecter</a></li>

Pour pouvoir

procéder à des

changements sur

le site

l’administrateur

devra entrer son

login ainsi que

son mot de

passe. Il devra

renseigner ces

informations

dans la page que

nous avons ci-

après.

7 Compte Rendu


Voici les lignes de codes auxquelles nous avons eu recours pour remplir cette tâche

Après s’être connecté, l’administrateur devra confirmer sa connexion au site en cliquant sur

le bout « Aller sur version administrateur ».

Il est à présent sur la version « administrateur » du site d’où il pourra faire les modifications

qu’il souhaitera.

<body> <?php include("EnTete.php"); ?> <div id="cadre1"> <?php include("menu.php"); ?> <?php include("piedpage.php"); ?> <div id="corps"> <form action="Ludo1.php" method="POST"> <div id="lien0"> <H1>Identifiez vous !</H1> </div> <p> <div id='lien1'> <br><br>

Login : <input type="text" name="login"><br><br><br> Mot de passe : <input type="password" name="mdp"><br><br> </p> <div> <input type="submit" value="connexion"> <input type="reset" value="Annuler"> </div> </div> </form> </div> </body>

8 Compte Rendu


En effet, l’administrateur, aura ainsi la possibilité de modifier, d’ajouter des membres voir

même en supprimer.

Comme nous pouvons le constater ci-dessus l’administrateur disposera de boutons

supplémentaire et spécifique.

Ici nous

pouvons

constater sur

cette photo,

qu’un bouton a

été mis à

disposition si

l’administrateur

veut ajouter un

news :

9 Compte Rendu


L’administrateur n’aura qu’à indiquer le chemin de destination de sa « news » ensuite ,

l’ajout se fera en cliquant sur le bouton enregistrer. L’administrateur aura aussi à mettre

le titre de la « news » et la date à laquelle il poste la photo :

Ici nous avons le code utilisé pour la création des textbox pour la saisie de la nouvelle new :

<p id="p2"> Tire: <input type="text" name="Titre" size=20><br><br> Date : <input type="text" name="Date" size=20><br><br> Image : <input type="file" name="IdPhotos" size=20><br><br> <br> </p>

Et ici nous avons celui utilisé pour l’enregistrement dans la base de données de la nouvelle

news :

<?php include ('connexion.php'); $query="insert into news values(NULL, '".$_POST['Titre']."', '".$_POST['IdPhotos']."', 'Fabrice' ,'".$_POST['Date']."');"; $result = mysql_query($query); ?>

10 Compte Rendu


La Reprise sur incident :

Contexte :

En cas de problème avec le serveur Web, HNT désirait que l’on mette en place une procédure

simplifiée de reprise sur incident

HNT désirait que les opérations de sauvegarde et de restauration sur le site web et la base de

données, soient réalisables via un menu interactif. On pouvait lancer ce script depuis une

console distante comme PuTTY par exemple.

Déroulement de la mission : Tout d’abord il a fallu que ne récupérions le serveur que nous avions mis en place lors de la mission précédente. Nous avons ensuite hébergé notre nouveau site avant d’exporter notre base de données sur phpMyAdmin. Puis nous avons commencé à mettre en place la reprise sur incident. Nous avons commencé par créer le script pour la sauvegarde manuelle que nous pouvons voir ci-dessous.

Nous l’avons mis en place à l’aide des différents tutoriels présent sur l’ENT. Et nous les

avons adaptés à notre cas et au dossier de notre site

11 Compte Rendu


Ensuite nous avons testé notre script.

Nous avons commencé par le tester dans le terminal de la machine virtuel. Le résultat obtenu était satisfaisant. La sauvegarde était opérationnelle ainsi que la restauration, du site et de la base de données qui précisons-le, nous a donné un peu de mal. En effet, nous ne disposions pas des droits nécessaires pour ces actions.

Cependant nous avons pu régler cela grâce à un chmod, pour être plus précis nous avons utilisé : chmod –R 777 /opt/lampp

Ensuite nous avons testé notre script depuis une console distante. Pour cela nous avons eu recours à PuTTY. Il fallait tout d’abord se

loguer, puis il a fallu

lancer un « chmod

u+v » afin de disposer

des droit nécessaire

pour lancer notre script

à distance.

12 Compte Rendu


Puis nous avons mis en place le script de la sauvegarde automatique. Pour cela nous nous

somme servis d’éléments présents dans notre premier script de sauvegarde manuel puis nous

avons adapté le reste.

Le script étant terminé, il fallait encore le rendre automatique, c’est-à-dire faire en sorte que

celle-ci soit journalière. Pour cela il a fallu faire un « crontab –e » dans le terminal

administrateur de notre machine virtuelle.

Nous arrivions

sur cette page

ou nous pouvons

définir l’heure ou

le script de

sauvegarde

automatique

devra se lancer.

Ici nous pouvons

voir que le nôtre

se lancera tous

les jours à

14h45.

13 Compte Rendu


Nous avons pu vérifier son bon fonctionnement en allant dans le dossier « Autosave » créer

sur le bureau de notre machine virtuelle. Celui-ci contient un dossier « Database » dans lequel

se trouve la sauvegarde la base de données et un dossier HNT44 dans lequel se trouve la

sauvegarde du site.

Un dossier similaire a aussi été créé pour la sauvegarde manuelle. Celui-ci s’appelle tout

simplement « Sauvegardes ».

Gestion du projet :

Nous avons commencé ce projet le 27 mars 2014, avec une séance de retard, étant donné que

plusieurs membres de l’équipe étaient absents lors de celle du 20 mars. Nous avons terminé

le projet le 24 avril 2014. Cela correspond à environ 16h de travail, au lieu des 20h convenues,

sans compter le travail réalisé en autonomie et sachant que la séance du 17 avril n’a pas pu

avoir lieu.

Nous nous somme concentré sur les fonctionnalités principales qu’attendait HNT pour son site

web et n’avons pas approfondis nos recherches sur les fonctionnalités secondaire tel que la

mise en place du DNS. Néanmoins tout fonctionne correctement, que ça soit au niveau du

serveur, de la reprise sur incident ou encore au niveau des pages du site.

Dans la mesure où HNT supporte un coût mensuel pour ses Bac + 2 de 2500 euros avec toutes

les cotisations comprises, mais que nous n’avons manqué quelques heures de travails, les 2

développeurs et le technicien de réseau ont touché 285.76 euros net sachant qu’HNT payait

17.86 euros de l’heure par employé à raison de 4h de travail par semaine.

14 Compte Rendu


Bilan :

Durant ce projet, nous avons dû faire face à de léger contretemps tel que le serveur qui ne

voulaient plus fonctionner, ce qui nous obligeait parfois à chercher une solution pendant un

bon moment et parfois même recommencer toute sa configuration au risque de le mettre

hors service. Nous avons aussi eu quelques soucis au niveau des scripts. Malgré les tutoriels

et autres aides, nous avons parfois eu quelques difficulté à les mettre en place. Les tests ont

été nombreux il nous a fallu du temps avant d’en arriver à un résultat convenable.

Au niveau de la programmation, ce qui nous n’avons pas vraiment rencontré de problèmes, à

part au niveau de la base de données. En effet parfois les images, ou encore les tableaux du

site ne voulaient s’afficher ce qui nous obligeait à revoir tout le code.

Notre objectif était de finir les attentes principales d’HNT dans les temps malgré notre léger

retard. Au final nous avons perdu 20% du salaire attendu.

Cependant l’entente et la coordination était présente malgré le fait que nous ne faisions pas

tous le même travail (partie développement et partie réseaux).

Documents

Compte Rendu : Environnement WEB HNT · Compte Rendu Environnement 3 Compte Rendu WEB HNT BTS-SIO Les fonctionnalités attendues : Contexte : Pour un chaque page générée dynamiquement,