Webentwicklung kann oft sehr komplex sein. Heute möchte ich Ihnen für Anfänger 26 Konzepte und Techniken vorstellen, eines für jeden Buchstaben des englischen Alphabets. Klingt seltsam, also fangen wir an.
A——Ajax
AJAX steht für asynchrones JavaScript und XML und ist die treibende Kraft hinter all den Fluent-Webanwendungen, die Sie in den letzten Jahren verwendet haben. Als Technologie ist AJAX bereits weit verbreitet. Gmail, Flickr usw. Sie können es sogar im WordPress-Administrationsbereich finden. Was genau ist das also und wie funktioniert es?
Im Kern handelt es sich um xmlhttpRequest, das das Senden von Anfragen und das Empfangen von Antworten ermöglicht, nachdem die Seite vollständig gerendert wurde, ohne dass eine Verknüpfung mit anderen Teilen der Seite erforderlich ist. Dies bedeutet, dass Webanwendungen nicht bei jedem Vorgang die gesamte Seite aktualisieren müssen. Dies sorgt für ein sehr reibungsloses, dynamisches Desktop-App-ähnliches Benutzererlebnis.
Verwandte Lektüre
So stellen Sie AJAX-Anfragen mit rohem Javascript
24 Best Practices für AJAX-Implementierungen
Senden Sie ein Formular ohne Seitenaktualisierung mit jQuery
B——Browser (Browser)
Ein Browser ist das Ding, das die Struktur Ihrer Website oder Ihres App-Meisterwerks versteht. Mit ihm lässt sich nicht nur im Internet surfen, ein moderner Browser ist auch eine Multitasking-Plattform. Ich habe es beispielsweise mit IRC, FTP und der Möglichkeit installiert, Informationen mit jedem Gerät zu synchronisieren. Sie wissen vielleicht bereits, dass der Browser ein wertvolles Entwicklungstool ist, aber er bringt auch viel Ärger mit sich. Jeder Entwickler, der sicherstellen muss, dass seine Arbeit in jedem Browser perfekt aussieht, sollte dieses Problem verstehen.
Verwandte Lektüre
13 Möglichkeiten, Ihre Arbeit im Browser zu testen und zu validieren
Die 5 besten Möglichkeiten, Ihre Website einem Browsertest zu unterziehen
Die 9 häufigsten IE-Fehler und wie man sie behebt
C——CSS
CSS ist ein scharfes Schwert in der Frontend-Entwicklung. CSS, kurz für Cascading Style Sheets, ist eine Sprache, die definiert, wie Webseiten angezeigt werden. In den gruseligsten Tagen der Webentwicklung haben Entwickler oft Stilcode in HTML-Quellcode geschrieben. CSS trennt Stil und Inhalt sehr gut.
Verwandte Lektüre
Die 30 CSS-Selektoren, die Sie sich merken müssen
30 CSS-Best Practices für Anfänger
CSS-Spezifität verstehen
CSS: Noob to Ninja – Die komplette Videoserie
D——DOM
DOM steht für Document Object Model und ist die akzeptierte Konvention für die Interaktion mit HTML- oder XML-Dokumenten. Die DOM-API bietet Funktionen zum programmgesteuerten Durchlaufen und Bearbeiten von Dokumenten. „DOM erstellt eine konsistente hierarchische Struktur für das analysierte HTML-Dokument. Untergeordnete Elemente werden Knoten oder DOM-Knoten genannt.“ Wenn Sie Leute über DOM sprechen hören, sprechen sie tatsächlich über DOM-Skripte. Dies war früher ein Begriff, der den Zugriff auf und die Manipulation des DOM über JavaScript beschrieb. Dies ist die Technologie, die den meisten modernen Websites und Apps zugrunde liegt, die Sie heute sehen.
Verwandte Lektüre
JavaScript und die DOM-Reihe: Lektion 1
Javascript und das DOM: Lektion 2
Der Dom ist ein Chaos – Vortrag von John Resig
E——Ereignisse
Moderne Webanwendungen sind stark ereignisgesteuert. Was ist also ein Ereignis? Die meisten Dinge, die Sie auf einer Webseite tun, sind ein Ereignis. Das Platzieren der Maus auf einem Link, das Klicken auf eine Schaltfläche, das Drücken der Tabulatortaste usw. sind alles gültige Ereignisse. Unter Ereignisbehandlung versteht man die Ausführung eines bestimmten Codeabschnitts, wenn ein Ereignis auftritt. Dies ist auch das Grundkonzept der modernen Webentwicklung, das Sie beherrschen müssen.
Verwandte Lektüre
JavaScript von Null: Kapitel 5 – Ereignisse
JavaScript-Ereignisse von Grund auf
JavaScript von Null: Browserübergreifende Ereignisbindung
JavaScript-Ereignisdelegation in 4 Minuten
F——Feuerkäfer
Wenn ein Arbeiter seine Arbeit gut machen will, muss er zuerst seine Werkzeuge schärfen. Das Gleiche gilt für Webentwickler. Ein sehr leistungsfähiges Tool ist Firebug. Firebug ist eine Firefox-Erweiterung, die während Ihrer gesamten Arbeit funktioniert. Damit können Sie jeden Aspekt einer Seite im Handumdrehen bearbeiten und überwachen. Ich kann hier nicht näher auf die Funktionen eingehen, also klicken Sie auf den Link unten.
Verwandte Lektüre
10 Gründe, warum Sie Firebug verwenden sollten
So gestalten Sie jedes CMS mit Firebug
Firebug: Weißer bis schwarzer Gürtel
G – Gitter
Ein Raster ist ein visueller Rahmen zur Strukturierung einer Seite. Es wurde aus der einst entwickelten Druckindustrie übernommen und ist ein wesentlicher Bestandteil der aktuellen Webentwicklung. Es gibt viele CSS-Frameworks, mit denen rasterbasierte Layouts erstellt werden können, was bei einer sehr großen Anzahl von Seiten und Layouts intensive Übung erfordert.
Verwandte Lektüre
Ein detaillierter Blick auf das 960 CSS Framework
Ein genauerer Blick auf das Blueprint CSS Framework
Crashkurs: YUI Grids CSS
Das 960-Gitter-System beherrschen
H——HTML
Wenn Sie diesen Artikel jetzt lesen, haben Sie möglicherweise eine vage Vorstellung von seinem Konzept. Wenn Sie sich von diesem Link täuschen ließen, lesen Sie bitte weiter. Übrigens: Wir heißen alle herzlich willkommen, rockux zu besuchen. Wir bieten viele Artikel über die Webentwicklung. HTML ist die Abkürzung für Hypertext Markup Language und der De-facto-Standard für Websprache. HTML besteht aus mehreren Komponenten oder Elementen: Tags, Tag-Attributen und dem in den Tags enthaltenen Inhalt. Die neueste Version des HTML-Standards HTML5 bringt uns viele neue Funktionen und behebt einige Kompatibilitätsprobleme.
Verwandte Lektüre
Kurs „HTML5 und Sie“.
30 HTML-Best Practices für Anfänger
28 HTML5-Funktionen, Tipps und Techniken, die Sie kennen müssen
Die 10 HTML-Tags, die Anfänger nicht verwenden
Ich - IE
Äh, Internet Explore. Der Name löst Ehrfurcht und Wut aus. Es war ein Held, der vier aufregende neue Funktionen mit sich brachte, die die gesamte Branche voranbrachten, und außerdem die Geschichte der Browser-Stagnation beendete. Bis heute ist es führend bei Front-End-Entwicklern. Nach zehn Jahren Krieg ist die letzte Version des IE 9 und sie ist in die richtige Richtung der Innovation zurückgekehrt. Unabhängig von Ihrer Einstellung zum IE ist er immer noch ein unverzichtbarer Teil des Webentwicklungsprozesses.
Verwandte Lektüre
Die Dinge, die der Internet Explorer richtig gemacht hat
Die 9 häufigsten IE-Fehler und wie man sie behebt
Hat Internet Explorer das Box-Modell richtig verstanden?
J – JavaScript
JavaScript ist das letzte Mitglied der grundlegenden Trifecta für die Webentwicklung. JavaScript, nicht Java, ist die Skriptsprache des Webs. Es gibt Milliarden von Webseiten, die es verwenden, und was noch wichtiger ist, die Websites, die diese Behauptung stützen. Sie definieren Verhalten, verwalten Ereignisse, manipulieren das DOM und interagieren mit dem Server über JavaScript. Dank der Verwendung unglaublicher Bibliotheken wie jQuery wachsen das Verständnis und die Kenntnisse von JavaScript jedes Jahr. Ich denke, es ist angemessen zu sagen, dass JavaScript ein absolutes Muss für jeden modernen Webentwickler ist.
Verwandte Lektüre
24 JavaScript-Best Practices für Anfänger
JavaScript von Null: Videoserie
33 Entwickler, die Sie als JavaScript-Junkie abonnieren MÜSSEN
K – Keyword-Optimierung (Keyword-Optimierung)
SEO ist nur für die Webentwicklung relevant, dennoch ist es für Webentwickler wichtig, über grundlegende Kenntnisse darüber zu verfügen, was SEO ist und was es leisten kann. Unter Keyword-Optimierung versteht man die Auswahl der richtigen Keywords für Ihre Website und deren Optimierung, damit Ihre Besucher Ihre Website finden. Und wenn Sie sich mit allen SEO-Prinzipien befassen, denken Sie daran: Der Inhalt ist König. Wenn Sie über eine gute SEO, aber schlechte Inhalte verfügen, werden Benutzer Sie möglicherweise finden, aber schnell wieder verlassen. Wenn Sie gute Inhalte haben, werden die Nutzer Sie finden und bleiben.
Verwandte Lektüre
Die einzigen SEO-Tools, die Sie jemals brauchen werden
L——Weniger
„Less“ ist eine dornige Rosensprache. Auf ihrer Website wird LESS als eine Erweiterung des dynamischen Verhaltens von CSS, wie Variablen, Mixins, Operatoren und Funktionen, beschrieben, und ich tendiere dazu, diesen Ansatz zu bevorzugen. LESS ist CSS bei anabolen Steroiden. Ja, für mich hört es sich besser an, aber Sie wissen, was es bedeutet. Es bringt die Eigenschaften dynamischer Sprachen in CSS ein und macht Stylesheets dadurch leistungsfähiger und einfacher zu verwalten.
Verwandte Lektüre
So holen Sie das Beste aus WENIGER heraus
Sie müssen sich LESS.js ansehen
Geben Sie nie wieder ein Anbieterpräfix ein
M——MVC
Das Model View Control-Muster, besser bekannt als MVC-Muster, ist eines der am häufigsten verwendeten Muster in der Webentwicklung. Hierbei handelt es sich um ein Architekturmuster, das jeden Teil einer Webanwendung zur einfacheren Wartung in logische Blöcke aufteilt – das Modell verarbeitet die Daten, die Ansicht übernimmt die Präsentation und der Controller ist für den Datenfluss zwischen den beiden Teilen verantwortlich.
Wenn Sie ein modernes Webentwicklungsframework verwenden, verwenden Sie MVC. Ruby on Rails, Code Igniter und Zend Framework verwenden alle dieses Muster.
Verwandte Lektüre
MVC für Noobs
Erstellen Sie Ihr erstes Tiny MVC Boilerplate mit PHP
asp.net von Grund auf: MVC
N – node.JS
node.JS führt die Webentwicklung in eine neue Ära. Es ermöglicht die Ausführung von JavaScript auf einer sehr schnellen VM-Engine (V8). Die Ergebnisse dieses Wandels in den Denkmustern sind vielleicht nicht sofort erkennbar, aber mit der Zeit werden die Vorteile offensichtlich.
Die unglaubliche Geschwindigkeit und die Fähigkeit, Tausende gleichzeitiger E/A-Ereignisse zu verwalten, sind wichtige Gesprächsthemen für JavaScript-Entwickler auf der ganzen Welt.
Verwandte Lektüre
Erlernen von serverseitigem JavaScript mit Node.js
Offizielle Node.JS-Website
O——Objekt
Die objektorientierte Programmierung erfreut sich aufgrund ihrer Flexibilität großer Beliebtheit in der Programmiergemeinschaft. Mit OOP können Sie weniger Codezeilen schreiben, wodurch es sauberer und damit einfacher zu warten ist. Aber was genau sind Objekte? Es ist schwer, es in ein oder zwei Sätzen klar zu erklären, also schauen Sie sich den Link unten an.
Verwandte Lektüre
Objektorientiertes PHP für Anfänger
Die Grundlagen von objektorientiertem JavaScript
Wikipedia-Link
P——PHP
PHP ist zweifellos die beliebteste serverseitige Sprache – sie unterstützt Millionen, möglicherweise Milliarden von Webseiten und Anwendungen.
Trotz zahlreicher Aktualisierungen und Debatten darüber, ob PHP die bessere Wahl für das Schreiben von Webanwendungen sei, hat PHP nicht nur überlebt, sondern gedeiht sogar. WordPress, Joomla, Drupal und MediaWiki verwenden alle PHP als Backend-Sprache. Einer der Hauptgründe ist, dass die Bereitstellung einfach ist und Sie relativ leicht einen Host finden können, der PHP unterstützt.
Verwandte Lektüre
Über 30 PHP Best Practices für Anfänger
Warum Sie ein schlechter PHP-Programmierer sind
9 nützliche PHP-Funktionen und Features, die Sie kennen müssen
F——Abfrage
Abfragen in unseren Artikeln können viele Dinge bedeuten. Die Abfragesprache ist eine Schnittstelle zum Abrufen von Daten aus externen Systemen. SQL ist ein gutes Beispiel für das Abrufen von Informationen aus einer relationalen Datenbank.
Der Abfragestring hingegen ist der Teil, der als Teil der URL an die Webanwendung übergeben wird. Bei diesen Daten kann es sich um alles Mögliche von der Seite handeln, auf die der Benutzer zugreift, um eine ID oder Transaktion zu überprüfen. Abfragezeichenfolgen werden als Schlüssel-Wert-Paare formatiert.
Verwandte Lektüre
CodeIgniter von Grund auf: Suchergebnisse ohne Abfragezeichenfolgen
SQL-Abfrage „Beliebte Beiträge nach Kommentaranzahl“ in WordPress
R – Reguläre Ausdrücke
Reguläre Ausdrücke bieten eine flexible Möglichkeit, Zeichenfolgen im Text nach festgelegten Mustern abzugleichen. Es ist in einer bestimmten Sprache geschrieben und wird von einem Dolmetscher analysiert. Alle modernen Sprachen unterstützen reguläre Ausdrücke.
Verwandte Lektüre
Reguläre Ausdrücke für Dummies: Screencast-Serie
Sie wissen nichts über reguläre Ausdrücke: Eine vollständige Anleitung
Erweiterte Tipps und Techniken für reguläre Ausdrücke
S - Quellcodeverwaltung (Quellcodeverwaltung)
Die Quellcodeverwaltung ist eine beliebte Praxis im Entwicklungsprozess eines Teams, unabhängig davon, auf welchen Aspekt sie sich konzentrieren – Programmierer in allen Bereichen verwenden Quellcodeverwaltung. Aber was genau ist das? Einfach ausgedrückt ermöglicht die Quellcodeverwaltung einem Entwicklerteam, an einer Sammlung von Dateien zu arbeiten und dabei die Änderungen jedes Mitglieds zu verfolgen und zu identifizieren. Jede Version des Codes kann verglichen, zusammengeführt oder sogar wiederhergestellt werden.
Verwandte Lektüre
Terminal, Git und GitHub für den Rest von uns: Screencast
Eine visuelle Einführung in Git
Einfache Versionskontrolle mit Git
Den Dreh raus mit GitHub
T - TDD (Testgetriebene Entwicklung)
Dies ist wiederum ein gemeinsames Element aller Entwickler. TDD ist die Abkürzung für Test Driven Development und bezeichnet den Prozess der gleichzeitigen Ausführung von Code und der Automatisierung von Testfällen für diesen Code. Dadurch entfallen viele mühsame Softwaretests und werden Entwickler dazu ermutigt, mehr zu testen.
Verwandte Lektüre
Der Leitfaden für Einsteiger zur testgetriebenen Entwicklung
Testgetriebene JavaScript-Entwicklung in der Praxis
So testen Sie Ihren JavaScript-Code mit QUnit
U —— Unit-Test (Unit-Test)
Unit-Tests sind eine Reihe von TFFs, bei denen kleine Codeeinheiten getestet werden, um sicherzustellen, dass sie freigegeben werden können. Unit-Tests beziehen sich jedoch häufig auf Methoden in OPP, womit normalerweise die kleinste Einheit des Programms gemeint ist, die unabhängig getestet werden kann.
Verwandte Lektüre
So testen Sie Ihren JavaScript-Code mit QUnit
V——VIM
VIM ist ein sehr extremer Texteditor. Vim ist kostenlos, Open Source und bietet unzählige Funktionspakete zur Auswahl. Andererseits ist die Lernkurve fast unerträglich steil und ohne gute Ressourcen könnte man für lange Zeit verloren sein. Klicken Sie auf den Link unten, um zu erfahren, warum es sich lohnt.
W – WordPress
WordPress begann als minimales Blogging-System, hat sich aber mittlerweile unglaublich weiterentwickelt. Seine Skalierbarkeit ermöglicht den Einsatz für alles vom CMS bis zum E-Commerce-System. Es hat auch viele Enthusiasten und Anhänger, darunter Entwickler und Designer, die es zu einer zuverlässigen Plattform machen möchten, auf die Sie sich bei zukünftigen Websites verlassen können.
Verwandte Lektüre
So erstellen Sie ein WordPress-Theme von Grund auf
Unverzichtbare Plugins für jede WordPress-Installation
WordPress für hohen Datenverkehr skalieren
Top 50 WordPress-Tutorials
8 großartige WordPress-SEO-Plugins
X——XSS
XSS steht für Cross-Site-Scripting. Dies ist eine der vielen Sicherheitsfragen, die Sie beim Erstellen einer Website stellen können. Unter XSS versteht man den Vorgang, eine anfällige Website oder ein anfälliges Programm mit bösartigen Skripten zu laden, um Berechtigungen zu erweitern oder an vertrauliche Informationen zu gelangen, oft beides.
Verwandte Lektüre
Können Sie Ihre eigene Website hacken? Ein Blick auf einige wesentliche Sicherheitsaspekte
CodeIgniter von Grund auf: Sicherheit
5 hilfreiche Tipps zum Erstellen sicherer PHP-Anwendungen
Y——YUI
Die Yahoo User Interface Library ist eine JavaScript-Bibliothek, die den Prozess der Erstellung interaktiver Websites vereinfacht. Wie die meisten modernen Bibliotheken bietet sie DOM-Manipulation und gebrauchsfertiges AJAX. Obwohl YUI nicht so bekannt ist wie jQuery, hat es dennoch eine sehr große Benutzerbasis und wurde aktiv weiterentwickelt.
Verwandte Lektüre
Eine Einführung in YUI
2010 Durch die Linse des YUI-Theaters
Z——Z-Index
Z-Index ist eine CSS-Eigenschaft, die definiert, wie ein Element auf der Seite gestapelt wird – sie definiert, wie nah ein Element am oberen Rand des Ansichtsfensters liegt. Ein großer Wert bedeutet, dass es über dem Element mit einem kleinen Wert angezeigt wird. Obwohl diese Eigenschaft relativ speziell sein mag, kommt sie sofort ins Spiel, wenn Sie Widgets oder komplexere Webdesigns erstellen.