Router Verbindet einzelne LANs miteinander, die von verschiedenem Typ sein können; sind vom Netzprotokoll abhängig.

Gateway Verbindet Netzwerke; ermöglicht Kommunikation zwischen Anwendungsprogrammen.

IPv4-Adressen bestehen aus 32 Bit bzw. 4 Bytes, angegeben als Folge von 4 ganzzahligen, durch Dezimalpunkte getrennte Dezimalzahlen.

IPv4-Adressen sind in zwei Teile gegliedert: Adresspräf x und Adresssuff x.

Adresspräf x (Netzwerk-ID) identif ziert das physikalische Netzwerk.

Adresssuffix (Host-ID) identifiziert Rechner im Netzwerk der Netzwerk-ID.

Subnetzmaske: 32 Bit lang; kennzeichnet den Netzwerk-ID-Teil durch 1-Bits und den Host-ID-Teil durch 0-Bits. [Wikipedia] –Dotted-Decimal-Notation: 141.54.1.11/255.255.0.0 –Suff x-Notation: 141.54.1.11/16

Broadcast-Adresse. Alle Bits der Host-ID sind auf 1 gesetzt

Loop-Back-Adresse. 127.0.0.1, sendender Rechner erhält Paket zurück

IPv6-Adressen bestehen aus aus 128 Bit bzw. 16 Bytes, angegeben als Folge von 8 durch Doppelpunkt getrennte Hexadezimalzahlen.

IPv6-Adressen sind wie IPv4-Adressen in zwei Teile gegliedert: Adresspräfix und Adresssuffix, auch Interface Identifier genannt.

IPv6-Netzwerke werden gemäß CIDR notiert, durch Anhängen der Präfixlänge in Bits mit “/” an die Adresse.

In einer URL werden IPv6-Adressen in eckige Klammern eingeschlossen.

IPv6 ermöglicht 2128 Adressen (3.4·1038 bzw. 340 Sextillionen) gegenüber 232 (3.4 Milliarden) bei IPv4. Zum Vergleich: die Erde hat 1051 Atome.

IPv6 führt Verbesserungen u.a. im Protokollaufbau ein

Aktuelle Realisierung: Hierarchische Organisation durch organisatorische Partitionierung (.com, .edu, .gov, .mil, etc.) als auch geografische Partionierung (.de, .uk, .fr, etc.) Der Suffix nach dem letzten Punkt wird als Top-Level-Domain, TLD, bezeichnet. Liste aktueller und neu zugelassener TLDs.

Erste Realisierung: Alle Namen und Adressen befanden sich in einer zentralen Masterdatei, die per FTP auf jeden Rechner geladen wurde. nicht skalierbar, keine lokale Organisation möglich

Client-Server – Interaktionsmodell

Rollenverteilung in einem Web-basierten Informationssystem:

• Dienstgeber (Server), die einen bestimmten Dienst (Service) erbringen.
  Ein Dienst besteht aus einer oder mehreren Funktionen (Operationen, Methoden), die aufgerufen werden können. Ein Server ist ein Prozess oder eine Prozessgruppe auf einem Rechner.
• Dienstnehmer (Clients), die Serverdienste von anderen Prozessen in Anspruch nehmen.

Das Gegenstück zum Client-Server-Paradigma ist das Peer-to-Peer-Paradigma: die Kommunikation unter Gleichgestellten.

Portkonzept

• Dienste (auf Anwendungsebene) werden über eine Endpunkt-zu-Endpunkt-Verbindung auf Basis der Transportschicht abgewickelt.
• Ein Port ist ein Dienstzugriffspunkt (Service Access Point) der Transportschicht des TCP/IP-Protokolls. Ports sind als 16Bit-Zahl codiert.
• Zusammen definieren die IP-Adresse (Internetschicht, Schicht 3) und die Portnummer (Transportschicht, Schicht 4) einen Kommunikationskanal.

Unterscheidung nach Verbindungsart bzw. Zuverlässigkeit:

• TCP-Port.
  Einrichtung von verbindungsorientiertem, zuverlässigem Transportdienst.
• UDP-Port.
  Einrichtung von verbindungslosem, unzuverlässigem Transportdienst.

Klassifikation von Ports

1. Standardisierte Ports.
   Weltweit eindeutig für Standarddienste reserviert: 0 – 255 für TCP/IP-Anwendungen, 256 - 1.023 für besondere Unix-Anwendungen.
2. Registrierte Ports.
   1024 – 49151, werden von der IANA verwaltet.
3. Private, dynamische Ports.
   Restliche Nummern von 49152 – 65535.

qDie Ports von 0 bis 1023 werden auch als „well-known Ports“ bezeichnet

qAuf Unix-Systemen sind in der Datei /etc/services die Ports mit ihren Service-Zuordnungen beschrieben

Socket-API

• Die (Programmier-)Schnittstelle einer Anwendung zur Transport schicht wird als API (Application Program Interface) bezeichnet.
• Protokollstandards wie z.B. TCP/IP definieren keine API, sondern abstrakte Dienste bzw. Operationen.
• Der de-Fakto-Standard der API zur Transportschicht ist die Socket-API
  – Sie stellt einen Dienst von Schicht 4 für Schicht 5 bereit.
• Ursprung: Teil von BSD-Unix, University of California at Berkeley.

Socket-Datenstruktur:

• realisiert bei Client und Server einen Kommunikationsendpunkt
• ist vom Typ Stream SOCK_STREAM oder Datagramm SOCK_DGRAM
• macht die Abwicklung des TCP/IP-Protokolls (IP-Adressen, Ports, Pufferung) transparent
• stellt Funktionen zum Schreiben, Lesen, Lauschen, etc. zur Verfügung

Verbindungsherstellung mit Sockets

• Server fordert vom Betriebssystem eine Server-Socket-Datenstruktur an (eigene IP-Adresse, Service-Port).
• Client fordert vom Betriebssystem eine Client-Socket-Datenstruktur an (Server-IP-Adresse, Server-Service-Port); dabei wird auch ein lokaler Port beim Client reserviert.

Anmerkungen:

• Schritte bei der Verbindungsherstellung:
  1. a) Server: Passiven Socket instanziieren (listening, asynchron).
     b) Server: Wartet auf Anfrage (accept(), synchron).
  2. a) Client: Instanziiert neuen Verbindungs-Socket (initialized, synchron).
     b) Client: Setzt Verbindungswunsch ab (connect(), synchron).
• Server: Der accept()-Aufruf liefert einen neuen Verbindungs-Socket bzgl. des Clients.
• Server, Client: Die beiden Verbindungs-Sockets bilden einen gemeinsamen Kommunikationskanal. Im Falle eines Stream-Sockets ist das ein bidirektionaler Stream.

Schritte bei der Verbindungsherstellung: 1. a) Server: Passiven Socket instanziieren (listening, asynchron). b) Server: Wartet auf Anfrage (accept(), synchron). 2. a) Client: Instanziiert neuen Verbindungs-Socket (initialized, synchron). b) Client: Setzt Verbindungswunsch ab (connect(), synchron). 3. Server: Der accept()-Aufruf liefert einen neuen Verbindungs-Socket bzgl. des Clients. 4. Server, Client: Die beiden Verbindungs-Sockets bilden einen gemeinsamen Kommunikationskanal. Im Falle eines Stream-Sockets ist das ein bidirektionaler Stream.

Der passive Socket ist in Java durch die Klasse ServerSocket implementiert

qDer Verbindungs-Socket ist in Java durch die Klasse Socket implementier

Passing Data Deeply with Context

Typing Immediately Destructured Parameters

Of course, TypeScript offers a way to provide an explicit type annotation. It's a little verbose, yet (if you think about it) consistent:

 function toJSON (value : any , { pretty } : { pretty : boolean }) { const indent = pretty ? 4 : 0 ; return JSON . stringify (value, null , indent); } 

styled-components is the result of wondering how we could enhance CSS for styling React component systems. By focusing on a single use case we managed to optimize the experience for developers as well as the output for end users.

You Might Not Need Redux

Getting Started with Redux

How to Style Your React Apps with CSS Like a Pro

Using data attributes

CSS preprocessor

Native CSS Mixins My Thoughts on Native vs Sass Mixins

Theming Web Apps with SASS

Sass Theming: The Neverending Story

Maps in Sass hold pairs of keys and values, and make it easy to look up a value by its corresponding key. They’re written (<expression>: <expression>, <expression>: <expression>). The expression before the : is the key, and the expression after is the value associated with that key. The keys must be unique, but the values may be duplicated. Unlike lists, maps must be written with parentheses around them. A map with no pairs is written ().

Theming with Sass: An SCSS Tutorial

Think of variables as a way to store information that you want to reuse throughout your stylesheet. You can store things like colors, font stacks, or any CSS value you think you’ll want to reuse. Sass uses the $ symbol to make something a variable.

Queries are the methods that Testing Library gives you to find elements on the page. There are several types of queries ("get", "find", "query"); the difference between them is whether the query will throw an error if no element is found or if it will return a Promise and retry.

The Intl namespace object contains several constructors as well as functionality common to the internationalization constructors and other language sensitive functions. Collectively, they comprise the ECMAScript Internationalization API, which provides language sensitive string comparison, number formatting, date and time formatting, and more.

Straightforward React UI Testing

Socket-Verbindung mit Java (Client-side)

Auf der Client-Seite bildet ein Telnet-Client das Gegenstück einer Verbindung zu dem Beispiel-Server. Der Telnet-Client lässt sich auf diese Art einsetzen, weil das Telnet-Protokoll lediglich Tastatureingaben vom Client zum Server bzw. Textausgaben vom Server zum Client überträgt.

public void startListening(int port, int backlog) throws IOException {
    // Start a passive socket, step (1a).
    ServerSocket passiveSocket = new ServerSocket(port, backlog);
    // Now the passive socket is listening.
    System.out.println("Server started on port " + port + ".");
    boolean listen = true;
    while(listen) {
        // Blocking wait for a connection.
        // If a client connects, a connection socket is returned
        // by the passive socket.
        Socket connectionSocket=passiveSocket.accept(); // step (1b+3)
        handleConnection(connectionSocket); // step (4)
        // Eventually, set boolean variable terminate.
        ...
    }
}

---

private void handleConnection(Socket connectionSocket) throws IOException {
    // Send a string to the client, step (4).
    OutputStream os = connectionSocket.getOutputStream();
    PrintWriter pw = new PrintWriter(os);
    pw.println("Tell me your name, please.");
    pw.flush(); // "Flushing" empties the send buffer.

    // Receive a string from the client, step (4).
    InputStream is = connectionSocket.getInputStream();
    BufferedReader br = new BufferedReader(new InputStreamReader(is));
    String name = br.readLine();
    if (name != null) {
        pw.println("Welcome " + name + "!");
        pw.flush();
    }
    // Close the connections.
    br.close();
    pw.close(); 
}

---

package networkprotocol;

import java.net.*;
import java.io.*;

public class Server {

    public void startListening(int port, int backlog) ... 
    private void handleConnection(Socket connectionSocket) ...

    public static void main(String[] args) {
        Server s = new Server();
        int port = 2005;
        int backlog = 100;
        try {
            s.startListening(port, backlog);
        } catch (IOException ioe) {
            System.out.println("There was an exception, the message is: " + ioe.getMessage());
        }
    }
}

---

[stein@webis stein]$
[stein@webis stein]$ telnet localhost 2005
Trying 127.0.0.1...
Connected to localhost (127.0.0.1).
Escape character is ’ˆ]’.
Tell me your name, please.
Benno
Welcome Benno!
Connection closed by foreign host.
[stein@webis stein]$

Dienstabwicklung durch Anforderungs-/Antwortprotokoll

Zur Abwicklung eines Dienstes ist neben dem Kommunikationskanal noch ein Protokoll notwendig. Vorherrschend im Web: Anforderungs-/Antwortprotokoll.

• Client initiiert Kommunikation, sendet Auftrag an Server.
• Server nimmt Auftrag entgegen, bearbeitet ihn und schickt das Ergebnis an den Client zurück.
• Stichwort „synchrone Kommunikation“: Client blockiert, bis Antwort eintrifft.
• Server wartet auf nächsten Auftrag.

Uniform Resource Locator

• URI
  Identifiziert eindeutig eine Informationsressource im WWW, unabhängig davon, ob es sich um ein Hypermedia-Dokument handelt.
• URL
  Identifiziert über eine eindeutige Adresse den Ort (Location) einer Informationsressource im WWW.
• URN
  Identifiziert über einen eindeutigen Namen eine Informationsressource im WWW. Auf Basis der URN soll (in Zukunft) der Zugriff auf die Ressource sowie die Abfrage ihrer Eigenschaften möglich sein.

URL versus URI

The term “Uniform Resource Locator” (URL) refers to the subset of URIs that, in addition to identifying a resource, provide a means of locating the resource by describing its primary access mechanism (e.g., its network “location”).

...

A common misunderstanding of URIs is that they are only used to refer to accessible resources. The URI itself only provides identification; access to the resource is neither guaranteed nor implied by the presence of a URI. Instead, any operation associated with a URI reference is defined by the protocol element, data format attribute, or natural language text in which it appears.

Namensauflösung URN → URL

• URN-Syntax [RFC 2141]:
  "urn:" <namespace-id> ":" <namespace-specific-string>
• Beispiel: urn:ISBN:0-262-01210-3

Namensauflösung URN → URL mittels Resolver Discovery Service [RFC 2276]:

• Ein Ort (URL) einer Ressource kann sich ändern, ihr Name
  (URN) nicht. Ziel ist es, Änderungen des Ortes einer Ressource
  automatisch nachzuvollziehen. Hierfür ist ein Dienst
  erforderlich, der in der Lage ist, aus dem Namen einer Ressource
  deren Standort zu ermitteln.
• Zurzeit werden im WWW fast ausschließlich URLs zur
  Identifikation von Ressourcen verwendet; hinsichtlich der
  Standardisierung eines Dienstes zur Abbildung URN →URL konnte
  sich noch nicht geeinigt werden: Die Category von RFC 2276
  (URN Resolution) ist „Informational“, die von RFC 2141
  (URN Syntax) ist „Standards Track“.
• Namensauflösung URN →URL bei Digital Object Identifiern, DOI, [www.doi.org]:
  1. Für die Namespace-ID „DOI“ wird der URN-Resolver dx.doi.org herausgesucht.
  2. Der URN-Resolver ermittelt für den
     Namespace-Specific-String 10.1007/s10579-010-9115-y die URL
     http://link.springer.com/article/10.1007%2Fs10579-010-9115-y.
  3. Die URL verweist auf das Dokument
     „Stein/Lipka/Prettenhofer: Intrinsic Plagiarism Analysis“,
     das durch den in der URL spezifizierten Web-Server
     ausgeliefert wird.
• Die Schritte 2 und 3 werden auf der Web-Seite www.webis.de/publications durch Klicken des Links dx.doi.org/10.1007/s10579-010-9115-y transparent ausgeführt.

How to reuse an embedded SVG element in the same page?