Ce document présente le minimum vital pour une utilisation de l'environnement de développement intégré (EDI ou IDE en anglais) NetBeans pour la création de documents HTML simples. Les captures d'écran ont été réalisées avec la version 8.1 de Netbeans sous Windows 10.

under construction

Cette page est en cours de construction. Elle vous donne le minimum vital et sera complétée (peut-être ;-)) ultérieurement.

Qu'est-ce que Netbeans ?

NetBeans (http://www.netbeans.org) est un environnement de développement intégré (EDI), placé en open source par Sun en juin 2000, puis transmis à l'Apache Software Foundation en octobre 2016, sous licence CDDL et GPLv2 (Common Development and Distribution License). En plus de Java, NetBeans permet également de supporter différents autres langages, comme Python, C, C++, JavaScript, XML, Ruby, PHP et HTML. Il comprend toutes les caractéristiques d'un IDE moderne (éditeur avec coloration syntaxique, projets multi-langage, refactoring, éditeur graphique d'interfaces et de pages Web).

Conçu en Java, NetBeans est disponible sous Windows, Linux, Solaris (sur x86 et SPARC), Mac OS X ou sous une version indépendante des systèmes d'exploitation (requérant une machine virtuelle Java). Un environnement Java Development Kit JDK est requis pour les développements en Java.

Wikepedia

Dans cette introduction à NetBeans nous ne nous intéresserons qu'à une utilisation très restreinte de l'IDE :

  1. l'accès à votre système de fichiers,
  2. la création d'un document HTML,
  3. la visualisation du document dans un navigateur.

1. Accès au système de fichiers

Lorsque vous lancez Netbeans pour la première fois, la fenêtre suivante s'ouvre.

page accueil netbeans 8.1
fig. 1: Page d'accueil de Netbeans 8.1

Pour accéder depuis NetBeans à votre système de fichiers, dans le menu Window (Fenetre si vous êtes avec une interface en francçais) sélectionnez l'item Favorites

ouvrir les favoris
fig. 2: Ouvrir Favorites

A la gauche de la fenêtre d'accueil apparaît un explorateur de fichiers avec votre Home dir visible.

les favoris
fig. 3: L'onglet favorites
les favoris
fig. 4: navigation dans l'explorateur de fichiers

Vous allez maintenant créer un dossier PLAI dans votre home dir. Pour cela vous allez procéder comme indiqué sur la figure 5.

créer un dossier
fig. 5: créer un dossier

2. Création et édition d'un fichier HTML

Dans l'explorateur de fichiers de Netbeans (onglet Favoris), sélectionnez le dossier PLAI créé précédemment et créez à l'intérieur de celui-ci un fichier index.html en procédant comme indiqué sur la figure 6.

créer un fichier HTML
fig. 6: créer un fichier HTML.

Le fichier index.html est créé et ouvert dans l'éditeur de NetBeans, il contient un squelette de page HTML5 (figure 7).

un fichier HTML après sa création
fig. 7: le fichier index.html après sa création.

Modifiez le titre et définissez votre propre contenu pour le fichier index.html. Vous pouvez constater, que lorsque le fichier a été modifié et n'a pas été sauvegardé son nom apparait en gras dans l'onglet correspondant (figure 8).

fichier modifié et non sauvegardé
fig. 8: fichier modifié et non sauvegardé.

Pour sauvegarder le fichier vous pouvez soit passer par le menu File et sélectionner l'item Save soit directement utiliser le reccourci clavier Ctrl-S). Vous pouvez constater qu'une fois le fichier sauvegardé son nom n'apparait plus en gras dans l'onglet de l'éditeur.

fichier non sauvegardé et fichier sauvegardé
fig. 9: fichier modifié non sauvegardé et fichier sauvegardé.

3. Afficher un fichier HTML dans un navigateur

Pour affichez votre fichier HTML dans votre navigateur préféré, plusieurs possibilités vous sont offertes.

  1. Ouvrir votre fichier depuis votre bureau en effectuant un double clic sur celui-ci. Le navigateur par défaut sera aouvert automatiquement sur cette page.
  2. Si votre navigateur est déjà ouvert, vous pouvez soit charger le fichier en passant par le menu Fichier, soit tout simplement effectuer un glissé/déposé (drag and drop) dans la fenêtre du navigateur.
    chargement d'un fichier HTML dans le navigateur
    fig. 10: chargement d'un fichier HTML dans le navigateur.
  3. Ou tout simplement afficher le fichier directement depuis NetBeans (figure 11).
    affichage d'un fichier HTML dans le navigateur depuis NetBeans
    fig. 11: affichage d'un fichier HTML dans le navigateur depuis NetBeans.
under construction

Cette page est en cours de construction. Elle vous donne le minimum vital et sera complétée (peut-être ;-)) ultérieurement.