Die 10 wichtigsten zeitsparenden Tipps zur Verkürzung der Web-App-Entwicklung (grafisches Tutorial)

In der heutigen Entwicklungsumgebung ist schnell besser.

Heutige Schlagworte und Begriffe wie „schnelle Anwendungsentwicklung“, „agile Softwareentwicklung“ und „asynchrones JavaScript und XML“ (wir können heutzutage nicht einmal geduldig darauf warten, dass eine Webseite neu geladen wird) geben Ihnen eine Vorstellung davon, in was für einer schnelllebigen Welt wir leben.

Aber Eile bedeutet nicht, dass Sie Überstunden machen müssen – Sie müssen bei der Arbeit auch Ihren Kopf benutzen. In diesem Artikel geben wir Ihnen zehn zeitsparende Tipps, um die Entwicklung von Webanwendungen zu verkürzen.

1. Nutzen Sie das Framework

Frameworks abstrahieren den normalen Code und bieten Ihnen eine grundlegende Struktur und Grundlage zum Schreiben von Webanwendungen.

Ein sehr typisches Beispiel für ein Framework ist Rails, ein Framework zur Web-Anwendungsentwicklung für die Programmiersprache Ruby. Indem wir Ihnen vorgefertigte Codepakete bereitstellen (beispielsweise Methoden zur Validierung von Benutzereingaben), sparen Sie nicht nur Zeit beim Schreiben Ihres eigenen Codes in Ruby, sondern Sie wissen auch, dass diese Pakete von anderen Entwicklern getestet und geprüft wurden. Dadurch sparen Sie sich viel Ärger, wenn es zu umfangreichen Tests kommt, und vermeiden potenzielle Sicherheitslücken, die durch mangelnde Tests entstehen können.

Die gleichen Vorteile gelten für die Verwendung eines JavaScript-Frameworks wie MooTools. Einige der von diesen Frameworks bereitgestellten Klassenmethoden werden von Kernentwicklern und der Community bereitgestellt und wurden in vielen Browsern ausgiebig getestet. Andere clientseitige Skriptsprachen-Frameworks sind jQuery, Prototype JS und YUI. Wenn Sie einige nicht-Mainstream-JS-Frameworks verwenden möchten, können Sie einen Blick auf diese Liste von JavaScript-Frameworks mit großem Potenzial werfen.

Für serverseitige Frameworks können Sie CakePHP, CodeIgniter, Zend oder Symphony in Betracht ziehen. Wenn Ihnen von Microsoft unterstützte Sprachen wie VB und C# gefallen, können Sie das .Net-Framework in Betracht ziehen.

Sie können sogar ein CSS-Framework wie 960Grid oder BluePrint verwenden, um schnell Ihren eigenen Stil der Seitenstruktur zu schreiben und zu standardisieren.

2. Verwenden Sie die integrierte Entwicklungsumgebung

Natürlich können Sie eine Webanwendung und deren Seiten auch einfach mit einem Texteditor wie Notepad und FTP erstellen. Ich glaube jedoch, dass die meisten Leute der Meinung sind, dass dies kein kluger Ansatz für die Entwicklung komplexer und robuster Website-Projekte ist.

Eine integrierte Entwicklungsumgebung (IDE) bietet Ihnen die Tools, die Sie zum Erstellen und Verwalten großer Website-Projekte benötigen. Die Funktionen integrierter Entwicklungsumgebungen ändern sich ständig, sie haben jedoch alle die folgenden gemeinsamen Funktionen:

1. Funktionen für Projektmanagement und Teamzusammenarbeit.

2. Debugging- und Diagnosefunktionen.

3. Syntaxhinweise und Autovervollständigung (IDE errät die Syntax, die Sie schreiben möchten)

4. Syntaxhervorhebung

5. Integriertes FTP, kann Dateien auf lokalen und Remote-Hosts synchronisieren

Das Wort „IDE“ klingt vielleicht etwas extravagant und ist manchen Leuten nicht geläufig, aber Big-Data-Leute dürften schon einmal von Adobe Dreamweaver gehört haben. Dreameweaver kann als integrierte Entwicklungsumgebung betrachtet werden. Da es einige der oben genannten Funktionen enthält, hilft es Ihnen, Code schneller zu schreiben. (Es ist normalerweise für die Front-End-Produktion geeignet. Es unterstützt aber auch serverseitige Sprachen wie PHP und ASP.NET.)

Heutzutage sind online unzählige IDEs verfügbar. Sie müssen lediglich eine für sich (oder Ihr Team) auswählen. Beliebte IDEs mit vollem Funktionsumfang wie Eclipse, Komodo IDE, NetBeans, Visual Studio und Aptana Studio.

3. Angemessene Modularität

Modularität ist der Schlüssel zur Erstellung komplexer Anwendungen, die leicht zu warten und zu skalieren sind. Im Wesentlichen bedeutet dies, dass Code in kleinen Komponenten geschrieben wird, anstatt den gesamten Code in einer großen Datei zu schreiben.

Modularität kostet am Anfang Zeit (weil Sie viel Zeit mit dem Entwerfen der Dateistruktur verbringen müssen). Sie spart Ihnen jedoch viel Zeit, wenn Sie eine Komponente ändern müssen oder Ihre Anwendung erweitern möchten.

Durch die Modularität bleiben Fehler außerdem auf das Modul beschränkt, sodass Sie das Problem schnell finden können, wenn etwas schief geht.

Der Missbrauch der Modularität führt allerdings zu aufgeblähtem Code und zu vielen unnötigen Include-Anweisungen, was die Ausführungsgeschwindigkeit der gesamten Anwendung erheblich verlangsamt. Daher müssen wir eine gute Balance zwischen einem zu hohen und einem zu niedrigen Grad an Modularität finden.

Einige modulare Entwurfsmuster umfassen MVC- und PAC-Muster.

4. Verwenden Sie Browser-Tools, um Front-End-Probleme effizient zu beheben

Es gibt nichts Schlimmeres, als sich mit Problemen hinsichtlich der Browserkompatibilität und der Analyse herumzuschlagen. Dieses Ding wird Sie in den Wahnsinn treiben und die Frustration, die es Ihnen bereitet, geht fast so weit, dass Sie das Gefühl haben, Sie könnten den Hass in Ihrem Herzen nicht loswerden, ohne etwas zu zerschlagen. Dank der in den Browser integrierten Debugging-Tools lassen sich Front-End-Probleme jedoch äußerst schnell und effizient finden und diagnostizieren.

Firebug und Web Developer sind absolut unverzichtbare Zeitsparer, die für Front-End-Webentwickler zu unverzichtbaren Tools geworden sind. Firbug kann das DOM problemlos anzeigen, um dessen Prinzipien zu verstehen, und kann CSS/HTML/JS im Handumdrehen anpassen. Darüber hinaus kann es Ihnen auch beim Debuggen und Kommentieren (Profilieren) Ihres JavaScript-Codes helfen, damit Sie herausfinden können, was genau die Unterbrechung Ihres Skripts verursacht hat. Web Developer stellt Ihnen eine Reihe nützlicher Tools zur Verfügung. Beispielsweise können Sie durch Klicken auf ein Seitenelement sehen, welche Stildeklarationen sich auf das Element auswirken, und Tools, mit denen Sie JavaScript und CSS einfach deaktivieren können, sodass Sie verstehen, wie Ihre Seite ohne JavaScript oder CSS funktioniert.

Wenn Sie im Internet Explorer debuggen müssen, können Sie die IE Developer Toolbar ausprobieren. Die Funktionalität ist Firebug und Web Developer sehr ähnlich. Wenn Sie weitere in den Browser integrierte IE-Debugging-Tools suchen, die Ihnen beim Debuggen Zeit sparen, können Sie auf diesen Link klicken.

5. Code-Wiederverwendung

Wenn Sie feststellen, dass Sie Dinge immer wieder wiederholen, ist es Zeit, Ihre Codestruktur zu überdenken. Erwägen Sie das Kennenlernen gängiger Entwurfsmuster, die Ihnen bei der Erstellung wiederverwendbarer und flexibler Methoden, Funktionen und Objekte helfen.

Wenn Sie beispielsweise häufig eine Verbindung zu einer Datenbank herstellen müssen, müssen Sie möglicherweise eine Datenbankzugriffsklasse erstellen, um Datenbankverbindungen, Abfragen und Datenübertragungen zu verwalten.

6. Online-Zusammenarbeit und Verfolgung des Projektstatus

Eigentlich sind Sie bei der Arbeit nicht alleine. Unabhängig davon, ob Sie für ein Entwicklungsteam oder für jemand anderen arbeiten (das kann Ihr Chef oder Ihr Kunde sein), sollten Sie die Vorteile der Online-Zusammenarbeit und der Verfolgung des Projektstatus in vollem Umfang nutzen.

Je weniger Zeit Sie mit Verwaltungsaufgaben oder in endlosen Meetings (oder, schlimmer noch, persönlichen Meetings, die eine Reise erfordern) verbringen, desto mehr Zeit können Sie in die Programmierung investieren.

Tools wie Basecamp, Lighthouse und activeCollab bieten Ihnen einen umfassenden Team-Collaboration-Service, mit dem Sie den Status des Projekts jederzeit verfolgen können. Sie können auch Projektziele und Meilensteine ​​festlegen, sodass alle automatisch synchronisiert werden. So sparen Sie sich die Zeit, die Sie sonst für das häufige Beantworten von E-Mails aufwenden müssten, und müssen nicht viel Zeit in Besprechungen zur Fortschrittsbestätigung verschwenden.

Diese Tools helfen Ihnen auch dabei, Prioritäten zu setzen und sicherzustellen, dass alles an einem zentralen Ort organisiert und aufgezeichnet wird.

7. Automatische Formatierung und Standardisierung des Codes

Sie müssen das Format Ihres gesamten Codes standardisieren. Das ist nicht nur eine gute Angewohnheit, sondern hilft Ihnen auch dabei, den Code schneller zu verstehen, wenn Sie später darauf zurückkommen müssen.

Durch die automatische Codeformatierung können Sie Ihren gesamten Code mit einem Klick formatieren, anstatt dies Zeile für Zeile tun zu müssen. Dadurch wird auch die Konsistenz beim Schreiben des Codes sichergestellt. Durch die automatische Formatierung wird zudem das Risiko von Fehlern durch manuelle Änderungen verringert.

Uns stehen hierfür zahlreiche Tools zur Verfügung, viele davon sind webbasiert. Für CSS ist CSSTidy eine beliebte Open-Source-Lösung (Clean CSS ist eine Online-Version von CSSTidy). Für HTML haben wir HTML Tidy.

Für Skripte haben wir PHP Source Code Formatter, Ruby Script Beautifier und Code Beautifier Plus (ein Tool zum Formatieren von C#, ActionScript und Java).

8. Verbringen Sie mehr Zeit mit der Anforderungserfassung und -planung

Vorbeugen ist weitaus besser als Heilen. Während einige Denkschulen Wert darauf legen, keine Zeit mit Planung zu verschwenden und sicherzustellen, dass Sie alle erforderlichen Informationen gesammelt haben, ist es dennoch notwendig, die nötige Zeit für die Hausaufgaben aufzuwenden. Wenn Sie sich bei der Erfassung der Anforderungen nicht ausreichend vorbereiten, kommt es zu einem Feature Creep, der durch alle möglichen unerwarteten Funktionsanforderungen verursacht wird.

9. Verwenden Sie bereits geschriebenen Code

Die Alten haben uns geholfen, das Rad zu erfinden, also müssen wir nicht selbst daran herumbasteln. Wenn Sie irgendwo eine Funktion sehen, die Sie interessiert, besteht eine gute Chance, dass jemand bereits den Code dafür geschrieben hat (also nicht nur für Sie, sondern für uns alle). Für PHP bietet das PHP Classes Repository eine große Sammlung von Klassen und Skripten, die Sie herunterladen und verwenden können. Hot Scripts bietet verschiedene Skripte in anderen Sprachen. Wenn Sie nur einige kleine Codeausschnitte möchten, können Sie unter devSnippets stöbern.

Hinweis: Diese Methode hilft Ihnen nur dann wirklich weiter, wenn Sie über genügend Erfahrung verfügen, um guten von schlechtem Code zu unterscheiden. Andernfalls werden Sie feststellen, dass Ihr Endprodukt voller Fehler und verwirrend geschrieben ist.

10. Optimierte Funktionen

Sie müssen eine Bewertung bestimmter Funktionen Ihrer Web-App vornehmen, um zu bestimmen, ob sich der Zeitaufwand für diese Funktion lohnt.

Benötigen Ihre Benutzer wirklich ein Content-Management-System, das nicht häufig aktualisiert wird und für jede Artikelkategorie einen benutzerdefinierten RSS-Feed bereitstellt? Sie benötigen unbedingt einen Website-Stilkonverter, der Ihnen hilft, den geografischen Standort des Benutzers zu ermitteln und die Website dann in einem anderen Stil zu präsentieren.

Das Schreiben von Website-Funktionen ist ein harter Kampf. Verschwenden Sie keine Entwicklungszeit mit Funktionen, die für den Endbenutzer nutzlos sind und die Benutzeroberfläche verkomplizieren.