1101:
JavaScript ist eine sehr mächtige Sprache, auch wenn sie (meist) in einer eingeschränkten Umgebung läuft. Mit JavaScript ist so einiges möglich, was dem Benutzer den Alltag erleichtern kann, aber auch viel Unfug (z.B. das lustige Wie-viele-alerts-kann-ich-aufpoppen-lassen-bis-der-User-den-Browser-mit-dem-Taskmanager-schließt-Spielchen).
Bis man JavaScript wirklich kann und auch schätzen lernt, dauert es aber ein Weilchen und dabei helfen einem viele Tutorials oder Fertiglösungen. Auch Frameworks gibt es zu Hauf, doch um die soll es hier gar nicht gehen. Hier geht es um 10 Seiten zum Thema JavaScript von Anfänger- bis Profi-Niveau, die man kennen sollte.
Peter Kropff - JavaScript - Einleitung
Ein absolutes Basis-Tutorial. Gut erklärt und auch für Laien verständlich. Es werden sowohl die JavaScript-Grundlagen als auch eine Einführung in die objektorientierte Programmierung gegeben.
Ajaxian
Ein interessantes Blog, auf dem News, Tools, Essays und vieles mehr rund um das Thema JavaScript und AJAX zu finden sind.
JavaScript: Formulare: Text an Cursorposition einfügen
Oft gehört und oft beantwortet: die Frage nach dem Einfügen von BB-Code an der Cursorposition. Dies ist zwar nicht direkt ein Tutorial, aber es bietet einen Code für eben dieses Problem, der sich auch einfach an die eigenen Bedürfnisse anpassen lässt.
Whitespace in the DOM - MDC
Jeder, der schonmal mit dem DOM, dem Document Object Model, gearbeitet hat, kennt das Problem: Mozilla-Browser werten Whitespace im Dokumentenbaum als eigene Textknoten. Dies kann vor allem beim Traversieren über den Baum sehr lästig sein. Diese Anleitung aus dem Mozilla Developer Center zeigt, wie man das Problem lösen kann.
Canvas Tutorial - Introduction
Das Canvas-Element ist ein Markup-Element des HTML-5-Standards, das es ermöglicht, Grafiken mit JavaScript zu erstellen. Dieses Tutorial zeigt auf spielerische Weise, wie es funktioniert.
Learning Advanced JavaScript
Wenn man sich dann zu den Fortgeschrittenen unter den JavaScript-Programmieren zählt, sollte man sich mit Best Practises und der Lösung häufiger Problemstellungen beschäftigen. Hier in Präsentationsform Probemstellungen und die dazugehörige Lösung.
Design Patterns in JavaScript, Part 1 - WebReference.com -
JavaScript erlaubt oder erfordert nicht viele Design Patterns, wie man sie aus anderen Sprachen kennt. Vor allem Dekorierer etc. sind relativ überflüssig, da einem Objekt in JavaScript zur Laufzeit mühelos neue Member hinzugefügt werden können. Ebenso können vorhandene überschrieben werden. Einige Patterns aber lassen sich dennoch sinnvoll einsetzen. Hier wird erklärt, wie man das das Factory- und das Singleton-Pattern in JavaScript implementieren kann.
Converting an app using document.designMode from IE to Mozilla.
Viele Anwendungen bieten mittlerweile einen Richttext-Editor (so wie leider auch dieses Forum). In vielen Fällen völlig überflüssig, doch in manchen Fällen, wie z.B. bei einem CMS für unbedarfte Kunden eine durchaus sinnvolle Angelegenheit. Dabei handelt es sich allerdings nicht um Zauberei, sondern nur um den DesignMode, den die Browser bereits selbst mitbringen.
Wer dazu noch eine Demo sehen will, der sei hier bedient: Mozilla Rich Text Editing Demo
Implementing a syntax-higlighting JavaScript editor in JavaScript
Ein etwas ausgefallenes Thema findet man hier. In diesem Dokument wird der Aufbau eines Editors mit Syntaxhighlighting beschrieben. Sehr interessant und auf jeden Fall einen Blick wert.
Yahoo! Design Pattern Library
And last but not least: die Yahoo-Design-Patterns. Diese darf man allerdings nicht mit den allgemein bekannten Design-Patterns verwechseln. Hierbei geht es um die Lösung häufiger Probleme wie „Wie erstellt man einen Datepicker?“ oder „Wie realisiere ich ein Pagegrid?“
Bis man JavaScript wirklich kann und auch schätzen lernt, dauert es aber ein Weilchen und dabei helfen einem viele Tutorials oder Fertiglösungen. Auch Frameworks gibt es zu Hauf, doch um die soll es hier gar nicht gehen. Hier geht es um 10 Seiten zum Thema JavaScript von Anfänger- bis Profi-Niveau, die man kennen sollte.
Peter Kropff - JavaScript - Einleitung
Ein absolutes Basis-Tutorial. Gut erklärt und auch für Laien verständlich. Es werden sowohl die JavaScript-Grundlagen als auch eine Einführung in die objektorientierte Programmierung gegeben.
Ajaxian
Ein interessantes Blog, auf dem News, Tools, Essays und vieles mehr rund um das Thema JavaScript und AJAX zu finden sind.
JavaScript: Formulare: Text an Cursorposition einfügen
Oft gehört und oft beantwortet: die Frage nach dem Einfügen von BB-Code an der Cursorposition. Dies ist zwar nicht direkt ein Tutorial, aber es bietet einen Code für eben dieses Problem, der sich auch einfach an die eigenen Bedürfnisse anpassen lässt.
Whitespace in the DOM - MDC
Jeder, der schonmal mit dem DOM, dem Document Object Model, gearbeitet hat, kennt das Problem: Mozilla-Browser werten Whitespace im Dokumentenbaum als eigene Textknoten. Dies kann vor allem beim Traversieren über den Baum sehr lästig sein. Diese Anleitung aus dem Mozilla Developer Center zeigt, wie man das Problem lösen kann.
Canvas Tutorial - Introduction
Das Canvas-Element ist ein Markup-Element des HTML-5-Standards, das es ermöglicht, Grafiken mit JavaScript zu erstellen. Dieses Tutorial zeigt auf spielerische Weise, wie es funktioniert.
Learning Advanced JavaScript
Wenn man sich dann zu den Fortgeschrittenen unter den JavaScript-Programmieren zählt, sollte man sich mit Best Practises und der Lösung häufiger Problemstellungen beschäftigen. Hier in Präsentationsform Probemstellungen und die dazugehörige Lösung.
Design Patterns in JavaScript, Part 1 - WebReference.com -
JavaScript erlaubt oder erfordert nicht viele Design Patterns, wie man sie aus anderen Sprachen kennt. Vor allem Dekorierer etc. sind relativ überflüssig, da einem Objekt in JavaScript zur Laufzeit mühelos neue Member hinzugefügt werden können. Ebenso können vorhandene überschrieben werden. Einige Patterns aber lassen sich dennoch sinnvoll einsetzen. Hier wird erklärt, wie man das das Factory- und das Singleton-Pattern in JavaScript implementieren kann.
Converting an app using document.designMode from IE to Mozilla.
Viele Anwendungen bieten mittlerweile einen Richttext-Editor (so wie leider auch dieses Forum). In vielen Fällen völlig überflüssig, doch in manchen Fällen, wie z.B. bei einem CMS für unbedarfte Kunden eine durchaus sinnvolle Angelegenheit. Dabei handelt es sich allerdings nicht um Zauberei, sondern nur um den DesignMode, den die Browser bereits selbst mitbringen.
Wer dazu noch eine Demo sehen will, der sei hier bedient: Mozilla Rich Text Editing Demo
Implementing a syntax-higlighting JavaScript editor in JavaScript
Ein etwas ausgefallenes Thema findet man hier. In diesem Dokument wird der Aufbau eines Editors mit Syntaxhighlighting beschrieben. Sehr interessant und auf jeden Fall einen Blick wert.
Yahoo! Design Pattern Library
And last but not least: die Yahoo-Design-Patterns. Diese darf man allerdings nicht mit den allgemein bekannten Design-Patterns verwechseln. Hierbei geht es um die Lösung häufiger Probleme wie „Wie erstellt man einen Datepicker?“ oder „Wie realisiere ich ein Pagegrid?“
Kommentar