Die Front-End-Checkliste ist nur ein Werkzeug... alles hängt von Ihnen ab.

Avatar of David Dias
David Dias am

DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!

Vor einem Monat habe ich die Front-End-Checkliste auf GitHub veröffentlicht. In weniger als 2 Wochen haben mehr als 10.000 Menschen auf der ganzen Welt das Repository mit einem Stern versehen. Das war völlig unerwartet und unglaublich!

Ich arbeite seit 2011 als Front-End-Entwickler, aber ich habe 2000 mit dem Erstellen von Websites begonnen. Seitdem versuche ich, wie wir alle, die Qualität meines Codes zu verbessern und Websites schneller auszuliefern. Unterwegs habe ich Entwickler aus zwei verschiedenen Ländern betreut. Das hat mir geholfen, eine Checkliste zu erstellen, die sich von dem unterscheidet, was ich im Laufe der Jahre im Web gefunden habe.

Während ich die Checkliste erstellte, hatte ich ständig das Buch „The Checklist Manifesto: How to Get Things Right“ von Atul Gawande im Hinterkopf. Dieses Buch hat mir geholfen, Checklisten für meine Arbeit und mein Privatleben zu erstellen und Dinge zu vereinfachen, die manchmal zu komplex erscheinen.

Ob Sie alleine oder im Team arbeiten, individuell, remote oder vor Ort, ich möchte Ihnen einige Ratschläge zur Verwendung der Front-End-Checkliste und der dazugehörigen Webanwendung geben. Vielleicht kann ich Sie überzeugen, sie in Ihren Entwicklungszyklus zu integrieren.

#1 Entscheiden Sie, *welche* Regeln Ihr Projekt und Team befolgen müssen

Jedes Projekt ist anders. Bevor ein neues Projekt beginnt, muss das gesamte Team (d.h. die Projektmanager, Designer, Entwickler, QA usw.) vereinbaren, was die Ergebnisse sein werden.

Um Ihnen bei der Entscheidung zu helfen, habe ich 3 verschiedene Prioritätsstufen erstellt: **hoch**, **mittel** und **niedrig**. Sie müssen diesen Unterscheidungen nicht unbedingt zustimmen, aber sie können Ihnen helfen, Ihre Aufgaben zu ordnen.

Die Front-End-Checklisten-App wurde entwickelt, um die Erstellung von *personalisierten* Checklisten zu erleichtern. Ändern Sie einige JSON-Dateien nach Ihren Wünschen und Sie sind bereit zu starten!

#2 Definieren Sie die Regeln für die Überprüfung zu Beginn, während und am Ende Ihres Projekts

Sie sollten nicht alle diese Regeln nur am *Ende* eines Projekts überprüfen. Sie wissen genauso gut wie ich, wie es am Ende von Projekten zugeht! Zu hektisch. Die meisten Punkte der Front-End-Checkliste können zu Beginn Ihrer Entwicklung berücksichtigt werden. Es liegt an Ihnen, das zu entscheiden. Machen Sie Ihrem Team von Anfang an klar, was wann passiert.

#3 Erfahren Sie etwas mehr über jede Regel

Wer liest gerne die Dokumentation? Nicht die meisten von uns, aber es ist unerlässlich. Wenn Sie die Gründe für die Regel verstehen wollen, kommen Sie nicht darum herum, sich darüber zu informieren. Je mehr Sie das *Warum* jeder Regel verstehen, desto besser werden Sie als Entwickler.

#4 Fangen Sie an zu prüfen!

Die Front-End-Checklisten-App kann Ihr Leben als Entwickler erleichtern. Es ist eine Live-Checkliste, so dass Ihr Fortschritt und Ihre Punktzahl live aktualisiert werden, während Sie Elemente abschließen. Alles wird in localStorage gespeichert, so dass Sie gehen und zurückkehren können, wann immer nötig.

Das Projekt ist Open Source, also zögern Sie nicht, es zu forken und nach Belieben zu verwenden. Ich arbeite daran, sicherzustellen, dass alle Dateien kommentiert sind. Insbesondere lade ich alle ein, die sich für Pug interessieren, einen Blick in den views-Ordner zu werfen.

#5 Integrieren Sie automatisiertes Testen in Ihren Workflow

Wir alle träumen von Automatisierung (oder träume ich nur?). Vorerst ist die Front-End-Checkliste nur eine interaktive Liste, aber einige der Aufgaben *können* in Ihrem Workflow automatisiert werden.

Werfen Sie einen Blick auf die gulpfile, die zum Generieren des Projekts verwendet wird. Alle Aufgaben sind Pakete, die Sie mit npm, webpack usw. verwenden können.

#6 Validieren Sie jede Seite, bevor Sie sie an das QA-Team und in die Produktion senden

Wenn Sie leidenschaftlich gerne sauberen Code erstellen und sich um die Qualität Ihres Codes kümmern, sollten Sie Ihre Seiten regelmäßig testen. Es ist so einfach, Fehler zu machen und wichtigen Code zu entfernen. Oder jemand anderes in Ihrem Team hat es vielleicht getan, aber es ist Ihre gemeinsame Verantwortung, solche Dinge zu erkennen.

Die Front-End-Checkliste kann schöne Berichte generieren, die Sie an einen Projektmanager oder ein Qualitätssicherungsteam senden können.

#7 Genießen Sie vor allem Ihre Arbeit

Manche Leute mögen bei einer so langen Checkliste einen leichten Schwindel verspüren. Das Durchgehen einer solchen Liste kann Angst auslösen und wirklich keinen Spaß machen.

Aber die Front-End-Checkliste ist nur ein Werkzeug, das Ihnen hilft, qualitativ hochwertigeren Code zu liefern. Code, der alle Aspekte eines Projekts beeinflusst: das SEO, die Benutzererfahrung, den ROI und letztendlich den Erfolg des Projekts. Ein Werkzeug, das bei all diesen Dingen helfen kann, kann tatsächlich helfen, Ihre Angst zu reduzieren und Ihre Gesundheit zu verbessern!

Fazit

Der Erfolg, den die Front-End-Checkliste in so kurzer Zeit erzielte, erinnerte mich daran, dass viele Menschen wirklich daran interessiert sind, Wege zu finden, ihre Arbeit zu verbessern. Aber nur weil das Werkzeug existiert, hilft das nicht direkt dabei. Sie müssen sich auch dazu verpflichten, es zu nutzen.

In einer Zeit, in der KI viele manuelle Aufgaben übernimmt, ist Qualität ein Muss. Auch wenn die Automatisierung viele unserer Aufgaben übernimmt, wird ein gewisses Qualitätsniveau schwer zu automatisieren bleiben, und wir Front-End-Entwickler haben noch viele lange Tage, um unsere Arbeit zu genießen.