Skip to content

9. Załączniki

Poniżej przedstawiamy instrukcję instalacji narzędzi wykorzystanych w niniejszym dokumencie na komputerach z systemem Windows 7 lub 8.

9.1. Instalacja JDK

W URL można znaleźć [http://www.oracle.com/technetwork/java/javase/downloads/index.html] (październik 2014 r.), a najnowszą wersję JDK. W dalszej części folder instalacyjny JDK będziemy nazywać <jdk-install>.

 

9.2. Instalacja Mavena

Maven to narzędzie do zarządzania zależnościami projektu Java i nie tylko. Jest dostępne w URL oraz [http://maven.apache.org/download.cgi].

 

Pobierz i rozpakuj archiwum. Folder instalacyjny Mavena nazwiemy <maven-install>.

  • W pliku [1] plik [conf / settings.xml] konfiguruje Maven;

Znajdują się w nim następujące wiersze:


  <!-- localRepository
   | The path to the local repository maven will use to store artifacts.
   |
   | Default: ${user.home}/.m2/repository
  <localRepository>/path/to/local/repo</localRepository>
-->

Domyślna wartość w wierszu 4, jeśli tak jak u mnie wasz {user.home} ma spację w ścieżce (na przykład [C:\Users\Serge Tahé]), może stanowić problem dla niektórych programów, w tym IntellijIDEA. W takim przypadku należy wpisać coś w rodzaju:


  <!-- localRepository
   | The path to the local repository maven will use to store artifacts.
   |
   | Default: ${user.home}/.m2/repository
  <localRepository>/path/to/local/repo</localRepository>
  -->
<localRepository>D:\Programs\devjava\maven\.m2\repository</localRepository>

i w wierszu 7 należy unikać ścieżki zawierającej spacje.

9.3. Instalacja STS (Spring Tool Suite)

Zainstalujemy SpringSource Tool Suite [http://www.springsource.com/developer/sts], czyli środowisko Eclipse wyposażone w liczne wtyczki związane z frameworkiem Spring, a także z preinstalowaną konfiguracją Maven.

  • przejdź na stronę zestawu narzędzi SpringSource (STS) [1], aby pobrać aktualną wersję STS [2A] [2B],
  • pobrany plik jest instalatorem, który tworzy drzewo plików [3A] [3B]. W [4] uruchamia się plik wykonywalny,
  • w pliku [5] wyświetla się okno robocze programu IDE po zamknięciu okna powitalnego. W pliku [6] wyświetla się okno serwerów aplikacji,
  • w [7] wyświetla się okno serwerów. Zarejestrowano jeden serwer. Jest to serwer VMware zgodny z Tomcatem.

Należy wskazać w STS katalog instalacyjny Mavena:

  • w [1-2] konfiguruje się STS;
  • w [3-4] dodaje się nową instalację Mavena;
  • w polu [5] należy wskazać katalog instalacyjny Mavena;
  • w [6] zamyka się kreatora;
  • w [7] ustawia się nową instalację Maven jako instalację domyślną;
  • w [8-9] sprawdzamy lokalny repozytorium Mavena, czyli folder, w którym będą umieszczane pobrane zależności oraz w którym STS umieści wygenerowane artefakty;

9.4. Instalacja serwera Tomcat

Serwery Tomcat są dostępne pod adresem URL [http://tomcat.apache.org/download-80.cgi]. Przykłady zawarte w niniejszym dokumencie zostały przetestowane z wersją 8.0.9 dostępną pod adresem URL [http://archive.apache.org/dist/tomcat/tomcat-8/v8.0.9/bin/].

Należy pobrać plik ZIP odpowiedni dla danego stanowiska pracy: [1]. Po rozpakowaniu otrzymujemy strukturę katalogów [2]. Następnie można dodać ten serwer do listy serwerów STS:

  • w [1-3] dodajemy nowy serwer do STS; (aby wyświetlić okno serwerów, należy wybrać: Window / Show view / Other / Server / Servers);
  • w pliku [5] wybierz serwer Tomcat 8;
  • w [6] nadać nazwę temu serwerowi;
  • w polu [8] należy wskazać folder instalacyjny wcześniej pobranego serwera Tomcat;
  • w [9] – nowy serwer;
  • w [11-12] uruchom serwer Tomcat 8;
  • w [13-14] – okno logów;
  • w [15], aby go zatrzymać;

9.5. Instalacja [WampServer]

[WampServer] to zestaw oprogramowania do tworzenia aplikacji w PHP / MySQL / Apache na komputerze z systemem Windows. Będziemy go używać wyłącznie do obsługi SGBD i MySQL.

  • na stronie [WampServer] [1] należy wybrać odpowiednią wersję [2],
  • pobrany plik wykonywalny jest instalatorem. Podczas instalacji wymagane jest podanie różnych informacji. Nie dotyczą one MySQL. Można je zatem pominąć. Po zakończeniu instalacji wyświetla się okno [3]. Uruchamia się [WampServer],
  • w [4], ikona [WampServer] zostanie umieszczona na pasku zadań w prawym dolnym rogu ekranu [4],
  • po kliknięciu na nią wyświetla się menu [5]. Umożliwia ono zarządzanie serwerem Apache oraz SGBD i MySQL. Aby nim zarządzać, należy skorzystać z opcji [PhpPmyAdmin],
  • po czym pojawia się poniższe okno,

Image

W tym miejscu nie będziemy szczegółowo omawiać korzystania z [PhpMyAdmin]. Dokument zawiera informacje, które należy znać w razie potrzeby.

9.6. Instalacja wtyczki Chrome [Advanced Rest Client]

W niniejszym dokumencie korzystamy z przeglądarki Chrome firmy Google (http://www.google.fr/intl/fr/chrome/browser/). Dodamy do niej rozszerzenie [Advanced Rest Client]. Można to zrobić w następujący sposób:

 
  • aplikacja jest wtedy dostępna do pobrania:
  • aby ją pobrać, należy utworzyć konto Google. Aplikacja [Google Web Store] prosi następnie o potwierdzenie [1]:
  • W [2] dodane rozszerzenie jest dostępne w opcji [Applications] [3]. Opcja ta jest wyświetlana na każdej nowej karcie, którą tworzysz (CTRL-T) w przeglądarce.

9.7. Zarządzanie jSON w Javie

W sposób niezauważalny dla programisty framework [Spring MVC] korzysta z biblioteki jSON [Jackson]. Aby zilustrować, czym jest jSON (JavaScript Object Notation), przedstawiamy tutaj program, który serializuje obiekty do formatu jSON oraz wykonuje odwrotną operację, deserializując wygenerowane ciągi znaków jSON w celu odtworzenia pierwotnych obiektów.

Biblioteka „Jackson” umożliwia utworzenie:

  • ciągu znaków jSON dla obiektu: new ObjectMapper().writeValueAsString(object);
  • obiektu na podstawie ciągu znaków jSON: new ObjectMapper().readValue(jsonString, Object.class).

Obie metody mogą wywołać błąd IOException. Oto przykład.

  

Powyższy projekt to projekt Maven zawierający następujący plik [pom.xml]:


<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>

  <groupId>istia.st.pam</groupId>
  <artifactId>json</artifactId>
  <version>1.0-SNAPSHOT</version>

  <dependencies>
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.3.3</version>
    </dependency>
  </dependencies>
</project>
  • wiersze 12–16: zależność, która wprowadza bibliotekę „Jackson”;

Klasa [Personne] wygląda następująco:


package istia.st.json;

public class Personne {
    // dane
    private String nom;
    private String prenom;
    private int age;

    // producenci
    public Personne() {

    }

    public Personne(String nom, String prénom, int âge) {
        this.nom = nom;
        this.prenom = prénom;
        this.age = âge;
    }

    // podpis
    public String toString() {
        return String.format("Personne[%s, %s, %d]", nom, prenom, age);
    }

    // metody pobierające i ustawiające
...
}

Klasa [Main] ma następującą postać:


package istia.st.json;

import com.fasterxml.jackson.databind.ObjectMapper;

import java.io.IOException;
import java.util.HashMap;
import java.util.Map;

public class Main {
  // narzędzie do serializacji / deserializacji
  static ObjectMapper mapper = new ObjectMapper();

  public static void main(String[] args) throws IOException {
    // tworzenie osoby
    Personne paul = new Personne("Denis", "Paul", 40);
    // wyświetlanie jSON
    String json = mapper.writeValueAsString(paul);
    System.out.println("Json=" + json);
    // instancjonowanie obiektu Personne na podstawie JSON
    Personne p = mapper.readValue(json, Personne.class);
    // wyświetlanie osoby
    System.out.println("Personne=" + p);
    // tabela
    Personne virginie = new Personne("Radot", "Virginie", 20);
    Personne[] personnes = new Personne[]{paul, virginie};
    // wyświetlanie JSON
    json = mapper.writeValueAsString(personnes);
    System.out.println("Json personnes=" + json);
    // słownik
    Map<String, Personne> hpersonnes = new HashMap<String, Personne>();
    hpersonnes.put("1", paul);
    hpersonnes.put("2", virginie);
    // wyświetlanie JSON
    json = mapper.writeValueAsString(hpersonnes);
    System.out.println("Json hpersonnes=" + json);
  }
}

Wywołanie tej klasy powoduje wyświetlenie na ekranie następującego tekstu:

1
2
3
4
Json={"nom":"Denis","prenom":"Paul","age":40}
Personne=Personne[Denis, Paul, 40]
Json personnes=[{"nom":"Denis","prenom":"Paul","age":40},{"nom":"Radot","prenom":"Virginie","age":20}]
Json hpersonnes={"2":{"nom":"Radot","prenom":"Virginie","age":20},"1":{"nom":"Denis","prenom":"Paul","age":40}}

Z przykładu należy zapamiętać:

  • obiekt [ObjectMapper] niezbędny do transformacji jSON / Object: wiersz 11;
  • transformację [Personne] --> jSON: wiersz 17;
  • transformację jSON → [Personne]: wiersz 20;
  • wyjątek [IOException] wygenerowany przez obie metody: wiersz 13.

9.8. Instalacja [Webstorm]

[WebStorm] (WS) jest wersją IDE opartą na JetBrains, służącą do tworzenia aplikacji HTML / CSS / JS. Okazało się, że idealnie nadaje się do tworzenia aplikacji w Angularze. Strona pobierania to [http://www.jetbrains.com/webstorm/download/]. Jest to wersja płatna IDE, ale można pobrać 30-dniową wersję próbną. Dostępne są niedrogie wersje osobiste i studenckie.

Aby zainstalować biblioteki JS w aplikacji, WS wykorzystuje narzędzie o nazwie [bower]. Narzędzie to jest modułem programu [node.js], który stanowi zbiór bibliotek JS. Ponadto biblioteki JS są pobierane z serwisu Git, co wymaga zainstalowania klienta Git na komputerze, z którego odbywa się pobieranie.

9.8.1. Instalacja [node.js]

Stroną pobierania [node.js] jest [http://nodejs.org/]. Pobierz instalator, a następnie uruchom go. Na razie nie trzeba robić nic więcej.

9.8.2. Instalacja narzędzia [bower]

Instalację narzędzia [bower], które umożliwi pobieranie bibliotek JavaScript, można przeprowadzić na różne sposoby. My wykonamy ją z poziomu konsoli:


C:\Users\Serge Tahé>npm install -g bower
C:\Users\Serge Tahé\AppData\Roaming\npm\bower -> C:\Users\Serge Tahé\AppData\Roaming\npm\node_modules\bower\bin\bower
bower@1.3.7 C:\Users\Serge Tahé\AppData\Roaming\npm\node_modules\bower
├── stringify-object@0.2.1
├── is-root@0.1.0
├── junk@0.3.0
...
├── insight@0.3.1 (object-assign@0.1.2, async@0.2.10, lodash.debounce@2.4.1, req
uest@2.27.0, configstore@0.2.3, inquirer@0.4.1)
├── mout@0.9.1
└── inquirer@0.5.1 (readline2@0.1.0, mute-stream@0.0.4, through@2.3.4, async@0.8
.0, lodash@2.4.1, cli-color@0.3.2)
  • wiersz 1: polecenie [node.js], które instaluje moduł [bower]. Aby polecenie zadziałało, plik wykonywalny [npm] musi znajdować się w katalogu PATH na komputerze (patrz poniższy akapit);

9.8.3. Instalacja [Git]

Git to system do zarządzania wersjami oprogramowania. Istnieje wersja dla systemu Windows o nazwie [msysgit], dostępna w URL i [http://msysgit.github.io/]. Nie będziemy używać [msysgit] do zarządzania wersjami naszej aplikacji, a jedynie do pobierania bibliotek JS znajdujących się na stronach typu [https://github.com], które wymagają protokołuspecjalnego protokołu dostępu, który jest dostarczany przez klienta [msysgit]

Asystent instalacji proponuje różne etapy, w tym następujące:

W pozostałych etapach instalacji można zaakceptować proponowane wartości domyślne.

Po zakończeniu instalacji Git należy sprawdzić, czy plik wykonywalny znajduje się w katalogu PATH na komputerze: [Panneau de configuration / Système et sécurité / Système / Paramètres systèmes avancés]:

Zmienna PATH wygląda następująco:


D:\Programs\devjava\java\jdk1.7.0\bin;D:\Programs\ActivePerl\Perl64\site\bin;D:\Programs\ActivePerl\Perl64\bin;D:\Programs\sgbd\OracleXE\app\oracle\product\11.2.0\client;D:\Programs\sgbd\OracleXE\app\oracle\product\11.2.0\client\bin;D:\Programs\sgbd\OracleXE\app\oracle\product\11.2.0\server\bin;...;D:\Programs\javascript\node.js\;D:\Programs\utilitaires\Git\cmd

Sprawdź, czy:

  • ścieżka do folderu instalacyjnego [node.js] jest prawidłowa (tutaj D:\Programs\javascript\node.js);
  • czy podano ścieżkę do pliku wykonywalnego klienta Git (w tym przypadku D:\Programs\utilitaires\Git\cmd);

9.8.4. Konfiguracja [Webstorm]

Sprawdźmy teraz konfigurację [Webstorm]

Powyżej wybierz opcję [1]. Lista już zainstalowanych modułów [node.js] pojawia się w [2]. Lista ta powinna zawierać wyłącznie wiersz [3] modułu [bower], jeśli postępowano zgodnie z poprzednią procedurą instalacji.

9.9. Instalacja emulatora dla systemu Android

Emulatory dostarczane wraz z SDK dla systemu Android działają wolno, co zniechęca do ich używania. Firma [Genymotion] oferuje znacznie wydajniejszy emulator. Jest on dostępny na stronie URL [https://cloud.genymotion.com/page/launchpad/download/]

(luty 2014 r.).

Aby uzyskać wersję do użytku osobistego, należy się zarejestrować. Pobierz produkt [Genymotion] wraz z maszyną wirtualną VirtualBox;

Image

Zainstaluj, a następnie uruchom [Genymotion]. Następnie pobierz obraz dla tabletu lub telefonu:

  • w [1] dodaj urządzenie wirtualne;
  • w [2] wybierz jedno lub więcej urządzeń do zainstalowania. Możesz zawęzić wyświetlaną listę, określając żądaną wersję Androida ([3]) oraz model urządzenia ([4]);
  • po zakończeniu pobierania otrzymasz w [5] listę dostępnych terminali wirtualnych, na których możesz testować swoje aplikacje na Androida;
https://stahe.github.io
Ten kurs-samouczek, napisany przez Serge'a Tahé, jest udostępniany publicznie na warunkach licencji Creative Commons Uznanie autorstwa – Bez wykorzystania komercyjnego – Na tych samych warunkach 3.0 bez zmian.