Javascript / Ajax / jQuery: Clientseitige Programmierung von Javascript / ECMAScipt mit Ausführung dieser Skripte im Browser von Desktops, Smartphones, Tablets und anderen Endgeräten

Javascript (ECMAScript Spezifikation) kann sowohl clientseitig im Browser als auch bedingt serverseitig ausgeführt werden. In diesen Themenblock widmen wir uns der clientseitigen Ausführung im Browser.

Javascript ist eine Programmiersprache, welche bereits in den 90er Jahren geschaffen wurde und eine Ausführung vom Programmen im Browser ermöglicht. Javascript ermöglicht auch über Ajax einen nachträglichen, weiteren Zugriff auf die Webseite/Domain, von welcher HTML-Code für eine Webseite oder das Frontend einer webbasierten Software ausgeliefert wurde, und ermöglicht über die Manipulation des Document Object Models DOM, dass HTML-, CSS-, SVG- und Javascript-basierte Ansichten im Browser nicht mehr vollständig vom Server ausgeliefert werden müssen sondern in Echtzeit berechnet, verändert oder auch um weitere nachgeladene Komponenten ausgebaut werden können. 

Javascript: Bedeutsame Javascript-Bibliotheken jenseits von jQuery zeigen auf, dass immer zuerst Javascript verstanden haben sollte.

Javascript: Bedeutsame Javascript-Bibliotheken jenseits von jQuery zeigen auf, dass immer zuerst Javascript verstanden haben sollte.

Es gibt eine Javascript-Bibliothek welche über die Jahre eine so große Bekanntheit erlangt hat, dass es längst Menschen gibt, welche glauben, dass es eine eigene Programmiersprache sei: jQuery. Klipp und klar: jQuery ist eine prima Sache, aber jQuery ist nur eine Funktionsbibliothek für Javascript von vielen, und jQuery war auch nicht die erste Funktionsbibliothek für Javascript, und wird auch nicht die letzte sein. Es gab und gibt Alternativen zu jQuery, und der zunehmende Einsatz von Javascript auf Serverseite (NodeJS, Oracle/Nashorn von Java-Javascript JJS oder vormals Mozilla/Rhino) wird Javascript-Bibliotheken den Durchbruch verschaffen, die mehr ermögichen als nur das Anhübschen von Frontends. DOM-Minipulation und Selektionen, für welche jQuery sehr beliebt ist, ist auch mit anderen Bibliotheken möglich, und wir mit Javascript 6.0 Kernbestandteil der Sprache Javascript selbst werden.

Solide Javascript-Kenntnisse sind die Voraussetzung dafür, auch weitere Frameworks und Javascript-Bibliotheken über jQuery hinaus zu verstehen und zudem beim Streichen von jQuery als Voraussetzung weiterhin handlungsfähig zu bleiben.

Javascript: Wo Javascript bei Webseiten und Software ausgeführt wird.

Javascript: Wo Javascript bei Webseiten und Software ausgeführt wird.

Javascript wird im Browser (Position 1, grün) ausgeführt. Der zugehörige Quellcode der Javascript-Programme wird hierzu allerdings vom Server (Position 6, blau) über eine Internet-Verbindung wie auch HTML-, CSS-, XML- oder SVG-Code nebst JPG-, GIF- und JPG-Grafiken ausgeliefert. Die Programmierung des clientseitigen Javascript-Quellcodes erfolgt also auf Serverseite, aber die Ausführung auf Clientseite.

Javascript: Warum man zwingend die Grundlagen verstehen sollte

Javascript: Warum man zwingend die Grundlagen verstehen sollte

Javascript dient schon lange nicht mehr nur dazu, irgendwelche netten Animationen zu zaubern oder mit Javascript die Dinge zu programmieren, die über jQuery (Javascript Bibliothek) noch nicht als Plugin möglich sind, sondern ermöglicht längst viel, viel mehr. Um Javascript herum sind viele zusätzliche Programm-Bibliotheken, sogenannten Libraries entstehen, von denen jQuery derzeit nur die bekannteste ist. Javascript mit der Option, inzwischen auch serverseitig zur Programmierung eingesetzt zu werden, ist längst um MVC-Frameworks ergänzt worden.

Diese Themen sind zwar nicht Inhalt dieser Schulung, sollten aber die Bedeutung von Javascript verdeutlichen: Javascript setzt längst den Sprung an, serverseitige Programmiersprachen wie PHP zu ergänzen oder ggf. sogar zu verdrängen, und Javascript ist zugleich die einzige Skriptsprache, welche in jedem Browser auch ohne Plugin derzeit ausgeführt werden kann.

Javascript mit/ohne jQuery: Responsive Web Design, Mobile Web Design

Javascript mit/ohne jQuery: Responsive Web Design, Mobile Web Design

Die mobilen Endgeräte wie Smartphones und Tablets sind eine prima Errungenschaft und erwecken immer wieder den Eindruck, dass diese die wirkliche Neuerung sind, welche seit 2012+ fast jeden erreicht hat. Die wirkliche Neuerung aber ist der Tot statisch geplanter Layouts für Webseiten, denn im Responsive Web Design RWD müssten sich REST-konform über URLs addressierte Dokumente und damit auch Einzelseiten von Webseiten über 1 Adresse referenzieren lassen, zugleich aber eine Darstellung in jedem Gerät ermöglichen. Mit Hilfe von jQuery werden DOM Manipulationen über Skripte zur Laufzeit im Browser stark vereinfacht, und darüber hinaus werden über jQuery UI und jQuery Mobile jQM User Interface Elemente ermöglicht, bei welchen HTML-Code um Javascript-Klassen oder data-Attribute so ergänzt werden, dass die jQuery Javascript-Funktionsbibliothek diese UI-Elemente darstellen kann.

Hierbei sollte grundsätzlich nicht vergessen werden, dass auch Javascript sich weiterentwickelt und damit DOM Manipulationen ohne jQuery ebenso ermöglicht wie auch die individuelle Programmierung von UI Elementen in Original-Javascript.

Javascript: Clientseitige Programmierung im Gesamtkontext einer Anwendung

Javascript: Clientseitige Programmierung im Gesamtkontext einer Anwendung

Auch wenn wir uns im Rahmen einer Grundlagen-Schulung zu Javascript nicht mit Softwarearchitekturen in verteilten Systemen befassen können, so kann die Bedeutung von Javascript-Kenntnissen aber ebenso in diesem Zusammenhang erkannt werden: Die bisherige Vorgehensweise bei Webseiten, Content Management Systemen oder auch anderer webbasierter Software sah zumeist so aus, dass auf Serverseite mit PHP, ASP, JAVA, JSP oder einen anderen Sprache HTML- und CSS-Quellcode für die Ansicht von Layouts oder auch Online-Formularen an den Client/Browser geschickt wurde.

Mit Hilfe von Javascript und der breiten Akzeptanz und Unterstützung von Javascript im Browsers ist es heute möglich, dass einige Programmbestandteile heute nicht mehr bei jedem Zugriff auf eine Webseite als HTML/CSS-Quellcode komplett neu geladen sondern über Ajax asynchron bei Bedarf nachgeladen oder über Javascript-Programmcode im Browser erst erzeugt wird.

JSON, XML und anderen Datenformaten für den Austausch von serialisierten Objekten über eine Internet-Verbindung zwischen Browser und Server bekommt hierbei ebenso eine große Bedeutung zu, weil wir mit Javascript heute nicht mehr den kompletten HTML- und CSS-Code als Markup und Formatierung hin- und herschicken müssen, sondern nur die eigentlich Kerndaten wie Formular-Daten oder Rohdaten. Wir sprechen auch von Dokumenten.