public-courses / 2017-pwa-public

more-installation.html 7.07 KB
edit raw blame history 
   1
   2
   3
   4
   5
   6
   7
   8
   9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  44
  45
  46
  47
  48
  49
  50
  51
  52
  53
  54
  55
  56
  57
  58
  59
  60
  61
  62
  63
  64
  65
  66
  67
  68
  69
  70
  71
  72
  73
  74
  75
  76
  77
  78
  79
  80
  81
  82
  83
  84
  85
  86
  87
  88
  89
  90
  91
  92
  93
  94
  95
  96
  97
  98
  99
 100
 101
 102
 103
 104
 105
 106
 107
 108
 109
 110
 111
 112
 113
 114
 115
 116
 117
 118
 119
 120
 121
 122
 123
 124
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta http-equiv="Content-Style-Type" content="text/css" />
  <meta name="generator" content="pandoc" />
  <title></title>

<style type="text/css">
            body {font: arial;}
            body {margin: 15px;}
            body.constrained {margin: auto; max-width: 1000px;}
            h1 {background: #fdb863; border: 1px solid black; text-align: center; padding: 5px; font-size: 1.15em;}
            h2 {color: #e66101; font-size: 1.05em; margin-left: 0.5em;}
            h3 {color: #5e3c99;font-size: 0.95em; margin-left: 1em;}
            h3, p {margin-left: 1em;}
            .en {float:left; clear:left; width: 45%; margin-left: 2%;}
            .fr {float:right; clear:right; width: 45%; margin-right: 2%;}
            .clear {clear:both;}
            pre {margin-left: 30px; border: 1px solid #333; padding: 10px; background: #EEF;}
            pre>code {background: none !important; border: none !important;}
            em {color: darkgreen;}
            code:not(.sourceCode) {background: #EEE; margin: -2px; padding: 2px; border: 1px solid #DDD}
            .lineNumbers {width: 40px;}

            .WARN {background: red;}
            .WARN code {background: black; color: white;}
            blockquote {border: 1px solid grey; border-left: 3px solid black; padding: 0;}
            blockquote p {padding: 0;}
</style>
<script>
    window.onload = function() {
        if (window.location.hash != "") {
            window.document.body.classList.remove("constrained");
            setTimeout(function() {history.go(0)}, 2000);
        }
    }
</script>

</head>
<body class="constrained">
<p><strong>This page lists the elements that you'll need to install on your computer to do web development.</strong></p>
<hr />
<h1 id="java-and-netbeans">Java and Netbeans</h1>
<p>Vous aurez besoin d'un SDK Java (<strong>JDK</strong>).</p>
<p>Les démos et le code donné utilisera Netbeans. Pour installer le bon Netbeans, il faut prendre la version « Java EE » (or « all ») la plus récente, téléchargeable sur le <a href="https://netbeans.org/downloads/">site de netbeans</a>.</p>
<p>Nous allons utiliser « maven » (une version vient avec Netbeans) qui va télécharger pas mal de choses. Vous devez donc créer et compiler un projet pour pré-télécharger tout celà (voir ci dessous).</p>
<h1 id="créer-un-projet-spring-avec-netbeans">Créer un projet Spring avec netbeans</h1>
<p>Dans Netbeans, aller dans « Tools&gt;Plugins » puis dans l'onglet « Available plugins » entrez « spring » dans le champs « Search ». Cocher les différents plugins qui apparaissent (en particulier « NB SpringBoot » et « Spring Web MVC »). S'ils sont déjà installés, ils apparaissent dans l'onglet « Installed ».</p>
<p>Après avoir installé ces plugins, créez un projet et compiler le, en suivant les étapes suivantes :</p>
<ul>
<li>« File &gt; New Project » et choisir « Maven &gt; Spring boot initializr »</li>
<li>à l'écran suivant (choix du nom du projet etc), pour un projet de test, garder les valeurs par défaut</li>
<li>ensuite, cocher les éléments suivants avant de faire suivant
<ul>
<li>security</li>
<li>dev tools</li>
<li>lombok</li>
<li>web</li>
<li>HATEOAS</li>
<li>REST Repository</li>
<li>Thymeleaf</li>
<li>JPA</li>
<li>H2</li>
</ul></li>
<li>à l'écran suivant choissisez l'endroit où stocker votre projet</li>
<li>une fois le projet créé, il se peut qu'une erreur soit detectée (si c'est le premier projet maven que l'on crée), on peut alors l'ignorer</li>
<li>faites un click droit sur votre projet « demo » puis faites « build » pour télécharger toutes les dépendances</li>
<li>ensuite essayer de lancer le projet avec « run » dans le menu contextuel (d'autres choses sont alors téléchargées)</li>
<li>visitez http://localhost:8080 pour voir si le serveur est bien joignable (si/comme nous avons ajouté « security », un mot de passe sera demandé)</li>
</ul>
<p>Félicitation, une bonne partie des choses à télécharger l'ont été, vous pouvez stopper le server (carré rouge) et supprimer votre projet :).</p>
<h1 id="choses-en-plus">Choses en plus</h1>
<p>Autocompletion Thymeleaf : <a href="https://github.com/ArturWisniewski/NB-Thymeleaf-Code-Completion/releases" class="uri">https://github.com/ArturWisniewski/NB-Thymeleaf-Code-Completion/releases</a> (puis installer via netbeans)</p>
<p>Fichier HTML « minimal » avec déclaration du namespace Thymeleaf :</p>
<pre><code>&lt;!DOCTYPE html&gt;
&lt;html xmlns:th=&quot;http://www.thymeleaf.org&quot;&gt;
    &lt;head&gt;
        &lt;title&gt;???&lt;/title&gt;
        &lt;meta charset=&quot;UTF-8&quot;/&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;div&gt;TODO write content&lt;/div&gt;
    &lt;/body&gt;
&lt;/html&gt;</code></pre>
<hr />
<h1 id="git">Git</h1>
<p>You will be asked to use the git version control system.</p>
<p>Please follow the installation instructions on <a href="https://git-scm.com/book/en/v2/Getting-Started-Installing-Git" class="uri">https://git-scm.com/book/en/v2/Getting-Started-Installing-Git</a>.</p>
<hr />
<h1 id="simple-text-editor">Simple text editor</h1>
<p>You can use Netbeans, emacs, or any text editor you like (including eclipse). You can also try this one <a href="https://atom.io/" class="uri">https://atom.io/</a> (and optionally <a href="https://atom.io/faq">disable the &quot;metrics&quot; package</a>).</p>
<hr />
<h1 id="if-you-prefer-eclipse-eclipse-spring-tool-suite">If you prefer Eclipse: Eclipse Spring Tool Suite</h1>
<p>We'll be using Spring for server side development. The easiest way to start with Spring is to use the Eclipse STS distribution, that can be downloaded at <a href="https://spring.io/tools/sts/all" class="uri">https://spring.io/tools/sts/all</a>.</p>
<!-- clicky Cla -->
<script type="text/javascript">
var clicky_site_ids = clicky_site_ids || [];
clicky_site_ids.push(100779706);
(function() {
  var s = document.createElement('script');
  s.type = 'text/javascript';
  s.async = true;
  s.src = '//static.getclicky.com/js';
  ( document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0] ).appendChild( s );
})();
</script>
<noscript><p><img alt="Clicky" width="1" height="1" src="//in.getclicky.com/100779706ns.gif" /></p></noscript> 


<!-- Histats.com  START  (aync)-->
<script type="text/javascript">var _Hasync= _Hasync|| [];
_Hasync.push(['Histats.start', '1,2767123,4,0,0,0,00010000']);
_Hasync.push(['Histats.fasi', '1']);
_Hasync.push(['Histats.track_hits', '']);
(function() {
var hs = document.createElement('script'); hs.type = 'text/javascript'; hs.async = true;
hs.src = ('http://s10.histats.com/js15_as.js');
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(hs);
})();</script>
<noscript><a href="http://www.histats.com" target="_blank"><img  src="http://sstatic1.histats.com/0.gif?2767123&101" alt="javascript hit counter" border="0"></a></noscript>
<!-- Histats.com  END  -->
</body>
</html>