Everand Logo

Welcome to Everand!

  • Discover millions of ebooks, audiobooks, and so much more with a free trial

    Only $11.99/month after trial. Cancel anytime.

    Moderne Webanwendungen mit AngularJS
    Moderne Webanwendungen mit AngularJS
    Moderne Webanwendungen mit AngularJS
    Ebook71 pages37 minutes

    Moderne Webanwendungen mit AngularJS

    By Philipp Tarasiewicz and Robin Böhm

    ()

    Read preview

    About this ebook

    AngularJS ist ein JavaScript-Framework für die Konzeption moderner Webanwendungen. Der shortcut soll die Leser an die Entwicklung mit
    AngularJS heranführen und einen Teil der Tool-Chain, u. a. das Konzept der Direktiven, vorstellen. Zu diesem Zweck wird ein kleines Projekt mit AngularJS
    entwickelt, eine einfache Anwendung zur Visualisierung eines dreidimensionalen Würfels. In den Kapiteln zwei und drei werden weitere Konzepte und Features anhand
    des Beispiels erläutert und dargelegt, welche Möglichkeiten das Framework bietet, um testgetrieben entwickeln zu können.
    LanguageDeutsch
    Publisherentwickler.press
    Release dateApr 25, 2014
    ISBN9783868025064
    Moderne Webanwendungen mit AngularJS

    Related to Moderne Webanwendungen mit AngularJS

    Titles in the series (100)

    View More
    View More

    Related ebooks

    Software Development & Engineering For You

    View More
    View More

    Related podcast episodes

    Related articles

    • Article

      Schnell Gestrickt

      Feb 16, 2023

      Schnell Gestrickt
      5 min read

    • Article

      News

      Nov 3, 2021

      News
      6 min read

    • Article

      Rahmenkonstruktion

      Jul 7, 2021

      Rahmenkonstruktion
      7 min read

    • Article

      Völlig Losgelöst

      May 17, 2023

      Völlig Losgelöst
      4 min read

    • Article

      News

      Jan 5, 2022

      Verbraucher können seit Dezember bei einer Unterschreitung der vertraglich zugesicherten Bandbreiten bei ihrem InternetAnbieter eine Minderung der monatlichen Zahlungen beanspruchen. Die Bundesnetzagentur hat nun definiert, wie Kunden das durch Bandb

      7 min read

    • Article

      Völlig Losgelöst

      May 17, 2023

      Völlig Losgelöst
      4 min read

    • Article

      Eine Quelle, viele Apps

      Feb 3, 2022

      Eine Quelle, viele Apps
      9 min read

    • Article

      Vermittlungszentrale

      Apr 7, 2021

      Vermittlungszentrale
      11 min read

    • Article

      Sauber Abgepackt

      Feb 3, 2022

      Sauber Abgepackt
      4 min read

    • Article

      News

      May 5, 2021

      News
      8 min read

    • Article

      Skripte-TÜV

      Aug 18, 2022

      Skripte-TÜV
      1 min read

    • Article

      Rudergänger

      Nov 3, 2021

      Rudergänger
      10 min read

    • Article

      Vernetzt

      Jul 21, 2022

      Vernetzt
      6 min read

    • Article

      Sauber Abgepackt

      Dec 16, 2021

      Sauber Abgepackt
      4 min read

    • Article

      Der Doktor fürs Web

      Mar 17, 2021

      Der Doktor fürs Web
      8 min read

    • Article

      Scharfer Wachhund

      Aug 4, 2021

      Scharfer Wachhund
      10 min read

    • Article

      Aus dem Hut

      May 5, 2021

      Aus dem Hut
      4 min read

    • Article

      Macromania

      Mar 16, 2023

      Macromania
      6 min read

    • Article

      Auf Spurensuche

      Mar 3, 2022

      Auf Spurensuche
      10 min read

    • Article

      Schnell Verpackt

      Aug 18, 2022

      Schnell Verpackt
      6 min read

    • Article

      Profiliga

      Jun 2, 2022

      Profiliga
      7 min read

    • Article

      Komfort-Downloads

      Apr 21, 2022

      Komfort-Downloads
      9 min read

    • Article

      Einstellungssache

      Aug 4, 2022

      Einstellungssache
      5 min read

    • Article

      Saubere Arbeit

      Aug 4, 2022

      Saubere Arbeit
      7 min read

    • Article

      Gut Organisiert

      Sep 15, 2021

      Gut Organisiert
      6 min read

    • Article

      Gut Organisiert

      Oct 6, 2021

      Gut Organisiert
      6 min read

    • Article

      Gut Organisiert

      Oct 6, 2021

      Gut Organisiert
      6 min read

    • Article

      Gesichert Und Sortiert

      Jan 19, 2023

      Gesichert Und Sortiert
      7 min read

    • Article

      Patchwork

      Sep 1, 2021

      Patchwork
      10 min read

    • Article

      Statisch Gebaut

      Mar 17, 2021

      Statisch Gebaut
      5 min read

    Related categories

    Reviews for Moderne Webanwendungen mit AngularJS

    0 ratings

    0 ratings0 reviews

    What did you think?

    Tap to rate

    Review must be at least 10 words

      Book preview

      Moderne Webanwendungen mit AngularJS - Philipp Tarasiewicz

      Philipp Tarasiewicz, Robin Böhm

      Moderne Webanwendungen mit AngularJS

      ISBN: 978-3-86802-506-4

      © 2014 entwickler.press

      Ein Imprint der Software & Support Media GmbH

      1 Erstellung einer Projektstruktur

      AngularJS ist ein JavaScript-Framework für die Entwicklung von modernen clientseitigen Webanwendungen. Erstmalig halten bewährte Konzepte wie Dependency Injection und konsequente testgetriebene Entwicklung Einzug in die JavaScript-Welt und machen diese somit attraktiv für den Enterprise-Einsatz. Das Framework bietet hier einige sehr intuitive APIs und achtet im hohen Maße auf das Einhalten und Bilden von Schnittstellen.

      In diesem shortcut wollen wir Sie an die Entwicklung mit AngularJS heranführen und Ihnen einen Teil der Tool-Chain vorstellen, die sich um das Framework gebildet hat, um den Entwicklungsprozess zu vereinfachen. Insbesondere werden wir Ihnen zeigen, wie Sie sich mithilfe der Zwei-Wege-Datenbindung (Two-Way Data Binding) große Teile von Boilerplate-Code sparen können. Außerdem stellen wir Ihnen das Konzept der Direktiven vor. Damit sind Sie in der Lage, HTML um eigene Elemente und Attribute zu erweitern, um auf diese Weise wiederverwendbare UI-Komponenten und Anwendungsbausteine zu erstellen.

      Das Cube-Projekt

      Um die soeben erwähnten Konzepte an einem praktischen Beispiel zu erklären, werden wir mit AngularJS ein kleines Projekt entwickeln. Wir haben diesem Projekt den Namen Cube verpasst. Cube ist eine einfache Anwendung zur Visualisierung eines dreidimensionalen Würfels, bei dem wir den X-, Y- und Z-Rotationsgrad steuern können. Ein Kern;aspekt der Anwendung wird also sein, das entsprechende -HTML-Tag zu definieren, hinter dem sich die Logik und die Darstellung eines Würfels verbergen.

      Tool-Chain für das Beispiel

      In einem der nächsten Kapitel werden wir für das Beispiel einige Tests schreiben. Dazu benötigen wir Karma, eine Testausführungsumgebung für JavaScript-Anwendungen. Karma benötigt Node.js als Laufzeitumgebung. Der Node.js-Installer kann unter [1] für alle gängigen Plattformen heruntergeladen werden. Nachdem wir Node.js installiert haben, können wir Karma mit dem folgenden Konsolenbefehl installieren:

      npm install -g karma

      Das Beispiel erfordert darüber hinaus, dass wir die Applikation mithilfe eines Webservers ausliefern. Wer noch keinen lokalen Webserver installiert hat, kann sich mit dem folgenden Befehl das http-server-Modul für Node.js installieren:

      npm install -g http-server

      Mit dem Befehl http-server kann nun in jedem Verzeichnis ein HTTP-Server gestartet werden, der standardmäßig über Port 8080 das aktuelle Verzeichnis ausliefert.

      Die Projektstruktur

      Zunächst wollen wir allerdings klein anfangen, indem wir die grundlegende Projektstruktur erstellen und AngularJS einbinden. Dazu erstellen wir für unser Projekt ein Hauptverzeichnis mit dem Namen cube. In diesem Verzeichnis legen wir zwei Unterverzeichnisse app und test an. Wie wir hier an dem test-Verzeichnis erkennen können, wollen wir hinterher für unsere Anwendung auch Testfälle schreiben. An dieser Stelle machen wir jedoch zunächst weiter, indem wir in dem app-Verzeichnis die Datei index.html erstellen. Diese Datei dient als Einstiegspunkt in unsere Applikation.

      Wir beginnen damit, in der index.html eine simple HTML-Struktur aufzubauen und AngularJS einzubinden (Listing 1.1). Die verschiedenen Versionen der Frameworks können wir auf [2] herunterladen. Für unser Beispiel nutzen wir AngularJS in Version 1.2.4. Die entsprechende Datei, die wir benötigen, um das Framework in unserer Anwendung verfügbar zu machen, heißt angular.js, und wir können sie unter [3] herunterladen. Wie in Listing 1.1 durch das Tag angedeutet ist, erwartet unsere Anwendung, dass sich das Framework in dem Verzeichnis lib/angular/ befindet. Somit müssen wir in dem app-Verzeichnis noch das Verzeichnis mit dem Namen lib erstellen und in diesem das angular-Verzeichnis anlegen. In Letzteres kopieren wir schließlich die Datei angular.js. Damit wären wir mit dem Aufsetzen der Projektstruktur auch schon fertig.

      Enjoying the preview?
      Page 1 of 1