Développeur web – 1ère partie

Plan de formation (v0.9b - janvier 2011)

Temps prévu: 4 heures

Objectif de la formation:

  • Faire un tour d'horizon du développement d'Internet depuis les débuts jusqu'à ce jour.
  • Mise à niveau des connaissances générales quant à Internet de l'apprenant.
  • Tenter de déterminer le champ d'intérêt de l'apprenant pour déterminer l'approche de cours suivants.

1. Qu’est-ce qu’Internet ?

Terminologie en bref.

Internet est le réseau informatique mondial qui rend accessibles au public des services variés comme le courrier électronique, la messagerie instantanée et le World Wide Web, en utilisant le protocole de communication IP (Internet protocol). C’est le réseau des réseaux.

Les moyens d’accès à Internet à ce jour:

  • filaire (modem dialup [56k], ADSL, câble, fibre optique)
  • sans fil (WiFi, satellite, 3G+)

Les applications de l’internet (as of today…)

  • web (www)
  • courrier électronique (POP, SMTP, autres protocoles)
  • messagerie instantanée
  • usenet
  • FTP (file transfer protocol), SSH, Telnet, Whois, VoIP, etc.

Le World Wide Web, littéralement la « toile (d’araignée) mondiale », communément appelé le Web, le web, parfois la Toile ou le WWW, est un système hypertexte public fonctionnant sur Internet qui permet de consulter, avec un navigateur, des pages accessibles sur des sites. L’image de la toile d’araignée vient des hyperliens qui lient les pages web entre elles.

Architecture client-serveur sur internet:

Un serveur internet peut être :

  • un ordinateur tenant le rôle de serveur informatique sur lequel fonctionne un logiciel serveur HTTP, courriel, FTP, usenet, etc, ;
  • le serveur HTTP lui-même ;
  • un ensemble de serveurs permettant le fonctionnement d’applications Web et internet.

Un client est le logiciel qui envoie des demandes à un serveur. Il peut s’agir d’un logiciel manipulé par une personne, ou d’un bot. Est appelé client aussi bien l’ordinateur depuis lequel les demandes sont envoyées que le logiciel qui contient les instructions relatives à la formulation des demandes et la personne qui opère les demandes. L’ordinateur client est généralement un ordinateur personnel ordinaire, équipés de logiciels relatifs aux différents types de demandes qui vont être envoyées, comme par exemple un navigateur web, un logiciel client pour le World wide web.

2. Historique en bref

link Historique complet ici

Les ancêtres – les réseaux institutionnels

Réseaux ayant chacun leurs protocoles de communications, avec parfois des passerelles entres eux. Pas ouvert au public.

  • ARPANET (Advanced Research Projects Agency Network)
  • USArmy
    • DARPA -Defense Advanced Research Projects Agency
    • MILNET – Military Network
  • Universités
  • Centres de recherche
  • Apparition du courriel vers 1970 (utilisation du @)
  • Arpanet issu de la guerre froide == légende urbaine
  • Réseaux X.25 (plus publique que Arpanet)
  • CompuServe (1er systeme publique de courrier electronique)
  • Tymnet, Bitnet
  • AOL, Prodigy,
  • Les Bulletin board systems BBS
    • The WELL
    • FidoNet
  • UUCPnet
  • NSFNet (premier réseau étendu conçu sur TCP/IP)
  • Etc.

Unification via les Protocoles TCP/IP: vers le web tel que connu aujourd’hui.

Fin des années 1970

  • TCP (Transmission Control Protocol) et IP (Internet Protocol)

Début 1980

  • époque où le réseau de l’ARPA commença à fusionner avec celui de la National Science Foundation; le terme « Internet » apparut.
  • commercialisation du réseau ( PSINet, UUNET, Netcom, et Portal Software, The World)
  • les prémisses du web: Gopher, Archie (pré moteur de recherche – Université McGill), WAIS (Wide Area Information Servers)
  • Hypertexte (HyperCard de Apple, Memex, etc.)
  • Mise en place des instances de régulations: InterNIC, IANA, ICANN

Début 1990

  • Tim Bernes-Lee au CERN: base du HTML tel que connu aujourd’hui
  • World Wide Web Consortium, abrégé par le sigle W3C, un organisme de standardisation à but non-lucratif, fondé en 1994 comme un consortium chargé de promouvoir la compatibilité des technologies du World Wide Web telles que HTML, XHTML, XML, RDF, CSS, PNG, SVG et SOAP. (fondé par Tim Berners-Lee)

Les logiciels clients: les navigateurs web

link Timeline des navigateurs web

Quelques-uns des navigateurs (ordre chronologique):

  • World Wide Web (Nexus)
  • ViolaWWW
  • NCSA Mosaic (1ere interface graphique)
  • Netscape(Mozaic, Firefox)
  • Internet Explore
  • Safari
  • Opera

La guerre des navigateurs internet

linkUsage des navigateurs internet

  • 1996 à 2001: Les versions de Netscape Navigator (Netscape Communicator plus tard) et d’Internet Explorer se succédèrent rapidement durant les quelques années qui suivirent. L’ajout précipité de fonctionnalités prit le pas sur le développement de spécifications techniques concertées, et cette guerre eut comme conséquences des navigateurs instables, de faible respect des standards alors naissants, de plantages fréquents, de trous de sécurité et de beaucoup d’autres problèmes pour les utilisateurs. (exemple avce les CSS, avec les javascripts, etc.)
  • La guerre des navigateurs prit fin lorsque IE cessa d’avoir des concurrents sérieux. Cela entraîna également la fin des innovations dans le navigateur web dominant : il n’y eut pas de nouvelle version d’Internet Explorer entre 2001 (version 6.0) et 2006 (version 7).
  • Fin 2004, la guerre a été relancée suite à la sortie du navigateur Firefox qui est basé sur le moteur Gecko du navigateur de Netscape.
    • affaiblissement des standards (png sur IE6, retardement des CSS, etc.)
    • mots de tête aux développeurs web (pour compatibilté avec IE6, IE7, etc.) – voir les % d’utilisation des navigateurs – IE a encore près de 45% du marché
    • relentissment du développement du web (Google a arreté de supporter IE6 fin 2009 seulement)

Le web

Système hypertexte public fonctionnant sur Internet qui permet de consulter, avec un navigateur, des pages accessibles sur des sites.

link Le world wide web (Wikipedia)

Web1.0

  • 1990 à 2003 génération des contenus des sites Internet par des professionnels
  • Pages statiques
  • Vers 2000 : apparition progressive des « géants du web »:
    • Google
    • Wikipedia
    • Amazon
    • Facebook
    • Flickr
    • Youtube
    • MySpace

Web2.0

  • 2004 à ce jour
  • Sites plus interactifs
  • Contenu généré par les utilisateurs
    • blogues
    • commentaires
    • ratings
    • critiques des acheteurs
    • wikis
    • médias sociaux
    • etc.

3. Les métiers de l’internet

(liste non exhaustive)

linkLes familles des métiers de l’Internet

linkConnaissez-vous les métiers du web ?

  • coordonnateur
    • chef de projet
    • directeur technique
    • directeur de projet
    • chargé de projet
  • développeur
    • analyste-programmeur
    • programmeur
    • intégrateur
    • directreur artistique
    • graphiste 2D
    • graphiste 3D
    • animateur (Flash)
  • webmaster (toutes ces métiers, ie: polyvalence)
  • créateur de contenu / agrégateur
    • rédacteur / e-journaliste
    • animateur (forum,blog, site)
  • webmarketing
    • online marketing manager
    • e-marketeur
    • analyste en marketing relationnel
    • chef de publicité ou media planer
    • traffic manager
  • expert en sécurité du système d’information
  • consultant en TI et Internet
  • juriste internet
  • chief Internet evangelist
  • veillleur technologique

Survol des éléments d’une page HTML

Serveurs:

Apache (le plus populaire – 75% des serveur HTTP- logiciel libre) , IIS(23% des serveur http / technologie sur WinXP de Microsoft…), Sun Java serveur, lighttpd, nginx (Webinar systems comme Big Blue Button)

 

HTML / XHTML : langage de balises

link Hypertext Markup Language (Wikipedia)

  1. paragraphe :: <p>Métier</p><p>Webmaster</p>
  2. saut de ligne :: Métier : <br /> webmaster
  3. bouton « submit » :: <input type= »submit » name= »button » id= »button » value= »Submit » />

Rendu http:

1.

Métier

Webmaster

2.

Métier :
webmaster

3.

 

 

CSS (cascading style sheets )

feuilles de style en cascade est un langage informatique qui sert à décrire la présentation des documents HTML et XML. Les standards définissant CSS sont publiés par le World Wide Web Consortium (W3C). Introduit au milieu des années 1990, CSS devient couramment utilisé dans la conception de sites web et bien pris en charge par les navigateurs web dans les années 2000.

link Feuilles de style en cascade (Wikipedia)

  • Séparer la structure d’un document de ses styles de présentation
  • Décliner les styles de présentation selon le récepteur
  • Permettre la cascade des styles

Fichiers multimédias

  • Fichiers graphiques (jpeg, gif, png)
  • mp3
  • swf(Flash)
  • mov, wmv, avi, xvid, etc.

 

Langages de programmation

linkListe des langages de programmation (Wikipedia)

Liste en bref:

Langages « scripts »

  • Javascript
  • PHP
  • ASP
  • Perl
  • TCL

Langages « compilés »

  • Java
  • C / C++

 

Bases de données

En informatique, une base de données (BD) est un lot d’informations stockées dans un dispositif informatique. Les technologies existantes permettent d’organiser et de structurer la base de données de manière à pouvoir facilement manipuler le contenu et stocker efficacement de très grandes quantités d’informations.

linkBases de données (Wikipedia)

Les plus populaires sur le web :

  • MySQL
  • PostgreSQL
  • Oracle

Architecture typique du développement web : LAMP

CMS

Un système de gestion de contenu ((en) Content Management System ou CMS) est une famille de logiciels destinés à la conception et à la mise à jour dynamique de site web ou d’application multimédia. Ils partagent les fonctionnalités suivantes :

  • ils permettent à plusieurs individus de travailler sur un même document ;
  • ils fournissent une chaîne de publication (workflow) offrant par exemple la possibilité de mettre en ligne le contenu des documents ;
  • ils permettent de séparer les opérations de gestion de la forme et du contenu ;
  • ils permettent de structurer le contenu (utilisation de FAQ, de documents, de blogs, de forums de discussion, etc.) ;
  • certains SGC incluent la gestion de versions.

Liste non exhaustive:

  • WordPress
  • MediaWiki
  • Joomla
  • Drupal
  • CodeIgnitor
  • PHPNuke
  • CakePHP

 

Autres technologies dans la mouvance web 2.0:

  • Webinars
  • RSS
  • AJAX
  • DOM / DHTML
  • etc.

Le futur de l’internet

link Le web 3.0

link L’internet des objets

  • Chaque pinte de lait sur internet ?
  • Web sémantique ou Web3D ?

.