Vous êtes sur la page 1sur 47

INF 201 : Programmation Web

Objectifs - Programme

Fid`el Jiomekong Azanzi


Universit
e de Yaound
e1D
epartement dInformatique

15 septembre 2016
1 / 46

Copyright (c) 2013 Jiomekong Azanzi Fid`el.


Permission is granted to copy, distribute and/or modify this document
under the terms of the GNU Free Documentation License, Version 1.2
or any later version published by the Free Software Foundation ; with
no Invariant Sections, no Front-Cover Texts, and no Back-Cover
Texts. More information about the license is included in the section
entitled The GNU Free Documentation License.

2 / 46

Aider `a ameliorer le support

Ce support est en cours de construction. Pri`


ere denvoyer
toutes remarques permettant de lam
eliorer `
a ladresse
jiofidelus@gmail.com.

3 / 46

Technologies

4 / 46

Site web : vitrine de toute organisation


AVG

5 / 46

Site web : vitrine de toute organisation


McAfee

6 / 46

Site web : vitrine de toute organisation


cs4hs

7 / 46

Architecture client / serveur

Client

Serveur

Internet

Site web
DB

8 / 46

Support de
communication

Site Web
Site Web/Site Internet : ensemble de pages Web reli
ees entre elles

par des liens hypertextes


Permettent `
a plusieurs personnes de communiquer
Accessible partout en tout temps et par tout le monde
Vitrine pour toute organisation ou toute entreprise

Pr
erequis :
Avoir une base en algorithmique
Savoir configurer un r
eseau poste-poste
9 / 46

Objectif

Ce cours vise `a donner aux etudiants des bases leur permettant de


pouvoir construire les applications Web totalement `a la main et avec
les outils.

10 / 46

Objectifs specifiques

Avoir des techniciens s


erieux et professionnels
Avoir de bon d
eveloppeurs de sites Web
Avoir 80% de r
eussite au moins en session normale

11 / 46

Objectifs specifiques
Savoir ce quest une licence logicielle, les diff
erentes licences

logiciels qui existent et le risque de piratage logiciel


Savoir les langages utilis
es sur le web
Savoir les bases du HTML-CSS-javaScript
Comprendre la notion de site web statique et de site web

dynamique
Savoir construire des sites web en PHP-(PostgresQL etc.)
12 / 46

Objectifs specifiques
Savoir analyser et de mettre en place un site web
Savoir designer un site web
Savoir utiliser les outils pour construire un site web
Savoir construire des sites accessibles sur des mobiles
D
eployer un site web sur un reseau (Intranet/Internet)
Valider les acquis dans la mise en place dun site web
13 / 46

Language Ranking

14 / 46

Language Ranking

15 / 46

Language Ranking

16 / 46

Language Ranking

17 / 46

Language Ranking

18 / 46

Language Ranking

19 / 46

Language Ranking

20 / 46

Language Ranking

21 / 46

Metier
Un des domaines o`
u on rencontre beaucoup de demandes
On peut distinguer plusieurs situations :
Travailler dans une entreprise locale
Travailler `a letranger
Travailler dans une grosse entreprise
Enseignement
Recherche
Monter une start-up avec des amis
FreeLance

22 / 46

Metiers

23 / 46

Metiers

24 / 46

Metiers

25 / 46

Metiers

26 / 46

Salaire
IMG.jpg

27 / 46

Salaire

28 / 46

Niveau et duree

Cycle de License, niveau 2


Dur
ee = ?h :
Cours ?h
TP : ?h
Travail personnel de letudiant : 140h

29 / 46

Deroulement

Cours sous la forme dexpos


es
A la fin, les
etudiants exposeront aussi
Plusieurs
evaluations
Suivi des travaux pendant les cours
Sujets des CC, TP, Expos
es, projets et CodeJam remi

30 / 46

Deroulement
Sc
eance 1, 2 :
Introduction
Rappels de quelques notions importantes
Presentation des outils
TP 00 : installation des outils
TP 01 : installation et developpement dun site Web avec Google
Site, Drupal, WordPress
Sc
eance 3, 4 :
HTML 5
CSS 3
Presentation de quelques frameworks CSS et HTML
TP 02 : developpement des pages Web en HTML5 et CSS3

31 / 46

Deroulement

Sc
eance 5 :
JavaScript
TP 03 : integrer JS dans vos pages Web
Sc
eance 6, 7, 8 :
Presentation des frameworks JS (Jquery, Angular JS)
Presentation de Cordova
TP 04 : integrer les frameworks JS dans vos pages Web
TP 05 : faire une application cross platform en utilisant

32 / 46

Deroulement

Sc
eance 9 :
Introduction `a la gestion des bases de donnees PostgresQL
TP 06 : administration dune base de donnees PostgresQL
Sc
eance 10 :
Introduction `a PHP
Developpement de la partie Backend en PHP
TP 07 : developpement de la partie Backend de la plate-forme

33 / 46

Deroulement
Sc
eance 11 :
Presentation des framworks PHP
TP 08 : creation dune application Web avec CodeIgniter
Sc
eance 12, 13 :
Securite des applications Web
Sc
eance 14 :
Developpements Drupal
TP 10 : Developpements Drupal

34 / 46

Outils
Syst`
eme dexploitation : Linux (toute distribution confondue)
C
ables reseaux, pinces `a sertir
SGBD : postgresQL, mariaDB (tout SGBD libre)
Gimp pour le design
Navigateur web au choix des
etudiants
pgadmin, apache-tomcat-7
Google Search, Youtube, Google Drive, G+, etc.
35 / 46

Examen
CC :
Examen CC sur table (50%)
Exposes (25%)
CodeJam (25%)
TP :
Projet (25%)
Examen TP sur table (25%)
36 / 46

Conseils pratiques

Venez au cours `
a lheure
Les supports vous aident mais le cours est important
Faites vos TPs plusieurs semaines avant lexamen
Ne copiez pas le devoir de votre camarade
Ne laissez pas votre machine `
a la portee de votre

37 / 46

Conseils pratiques

Le jour de TP venez avec votre mat


eriel et assurez vous que vous

retournez chez vous avec votre materiel


Prenez ce que lon vous demande de faire au s
erieux
Avant de faire plus de choses, assurez vous que vous avez fait tout

ce qui est demande dans lepreuve


Lenseignant est votre guide et non votre bourreau

38 / 46

Conseils pratiques
Exposes

Plan non obligatoire


Tout le monde doit pr
esenter
On ne lit pas les diapos

Eviter
trop de textes dans les diapos
Penser au respect du temps de pr
esentation (generalement 1 diapo

= 1mn)
Bien sentraner seul et en groupe (il est possible dutiliser un

miroir)
39 / 46

Conseils pratiques
Exposes

Chaque diapo doit avoir un titre et un contenu (le titre doit


etre

un resume en une ligne du contenu)


Mettre les num
eros de diapos
Se regrouper pendant la pr
esentation, on doit sentir que cest un

travail de groupe
Ne pas mettre le nom de ceux qui nont pas travaill
e car ils

peuvent pourrir votre expose

40 / 46

Conseils pratiques
Exposes

Ecoutez
attentivement les questions avant de les repondre (si
possible, les noter)
Quand vous avez pos
e une question et quune reponse est en train

detre fourni, ne pas couper la parole


On ne coupe la parole `
a son interlocuteur
Mettre les dessins et les images illustratives
Ne r
epondez pas aux provocations ou moqueries de votre auditoire
41 / 46

Conseils pratiques
Projet

Bien penser son projet


Ne pas oublier de mettre le nom des membres de groupe dans le

document final (page de couverture)


Arr
eter son projet pendant le cours et faire valider par lenseignant
Commencer son projet t
ot et terminer `a temps
Ne pas plagier (tr`
es facile didentifier les tricheurs sur Internet)
Respecter les d
elais et les recommandations
42 / 46

Conseils pratiques
Examen

Bien pr
esenter sa copie
Lorsque vous commencez un exercice, le terminer
Ne trichez pas car ca va vous co
uter cher
Pr
eparer son examen = respecter les consignes et appeter tout le

necessaire (stylo, brouillon etc.) avant de partir de la maison


Lire toute l
epreuve, chercher 12/20 avant de chercher 18 ou 20/20
43 / 46

Propositions de sujets dexposes


HTTP 2.0
Moteurs de blog : WordPress, Dotclear
CMS : Magnolia, Joomla, Drupal, Xoops, Spip
Moteurs de forum : fluxBB, phpBB
Moteurs de wikis : MediaWiki
e-commerce : magento, Prestashop
e-learning : moodle
Framworks : Zend Framework, Symfony, Hazaar MVC, PHPixie,

Laravel

44 / 46

Propositions de projet
Conception et mise en place du site web dun des etablissements de
luniversite de Yaounde 1 :
Collecte de donn
ees et redaction du cahier de charges
Conception graphique et design
Cr
eation du site avec un outil de votre choix
Pr
eparation et presentation du travail sous forme dexposes

45 / 46

References
HTML5, disponible `
a ladresse

http ://www.w3.org/html/wg/drafts/html/master/ en avril 2013


CSS3, disponible `
a ladresse : http ://www.w3.org/Style/css3-

selectors-updates/WD-css3-selectors-20010126.fr.html en avril
2013
Joomla, disponible `
a ladresse http ://www.joomla.fr/ en avril

2013
Moodle, disponible `
a ladresse https ://moodle.org/ en avril 2013
Magento, disponible `
a ladresse

http ://www.magentocommerce.com/fr/ en 2013


46 / 46

References
Apprenez `
a creer votre site web avec HTML5 et CSS3 disponible

sur le site www.siteduzero.com en Novembre 2012


Cr
eez votre application web avec Java EE disponible sur le site

www.siteduzero.com en Novembre 2012


MichelMartin. Simplifiez vos d
eveloppements JavaScript avec

jQuery , disponible sur le site www.witeduzero.com en 2012


http ://fr.php.net

47 / 46