Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Ratgeber

Tools die jeder Web-Developer braucht: Wir optimieren euren Workflow

Workflow für Web-Developer. (Bild: Shutterstock)

Web-Developer arbeiten vermehrt mit einer Vielzahl von Programmen gleichzeitig. Neben sehr viel Monitor benötigt es also auch einen abgestimmten Workflow und Programme die ineinander übergreifen.

Die Möglichkeiten und Variationen von Webseiten haben in dem letzten Jahrzehnt stark zugelegt. Eine Webseite besteht schon lange nicht mehr nur aus HTML, sondern es erfordert deutlich mehr Technik und Grips, um eine moderne und aktuelle Webseite zu erstellen. Der Quellcode wird somit immer umfangreicher und wir müssen trotzdem weiterhin eine gewisse Ordnung schaffen. Wie uns das tagtäglich gelingt? Hier kommen jetzt unsere Tools für euren Workflow!

Was braucht der Web-Developer? Tools die euren Workflow verbessern

Ein neues Projekt beginnt oft mit der Erstellung von einem Git-Repository. Dies ermöglicht uns mit mehreren Leuten gleichzeitig an einem Projekte zu arbeiten und wir erhalten eine komfortable Code-Versionierung. Dies ist nicht nur wichtig, sondern ein Must-Have für jedes größere Projekt. Ein solches Git-Repository kann als Service gemietet werden, zum Beispiel bei Github, Bitbucket oder Gitlab, oder natürlich auch auf dem eigenen Server bereitgestellt werden (benötigt Git-Support).

Für die Verwaltung eignet sich zum Beispiel wunderbar Git-Tower, das erst vor kurzem in der Version 3.0 erschienen ist. Git-Tower ermöglicht es nicht nur lokale Git-Projekte zu organisieren, sondern auch externe Repositorys anzubinden. Ein sehr umfangreicher und guter Git-Client, der einem immer einen Überblick verschafft.

Sucht euch einen Editor, mit dem ihr gerne arbeitet!

Ist das Git-Repository erstellt und verknüpft beginnt die weitere Vorbereitung. Hierfür öffnet man jetzt seinen favorisierten Code-Editor. Wer gerne clean und simple arbeiten möchte und zudem einen hohen Grad an Individualisierbarkeit wünscht, ist mit AtomVisual Studio Code oder Sublime-Text gut bedient. Wer hingegen lieber die Scham von einem WYSIWYG-Editor will, der sollte sich Coda oder Espresso anschauen. Hingegen der Fullstack-Entwickler doch lieber mit der Phpstorm-IDE arbeitet. Wer die Wahl hat, hat die Qual.

Ist der lieblings Editor geöffnet beginnt die Erstellung der Struktur. Ordner und Dateien werden angelegt, Packages und Bibliotheken werden hinzugefügt. Eine solche Struktur könnte folgendermaßen aussehen:

/assets/
-- /js/
-- /css/
-- /images/
-- /svg/
-- /icons/
-- /fonts/
/i18n/
/gateway/
/vendor/
index.html

In den Ordner assets kommen alle Materialien die für die Umsetzung benötigt werden. i18n ist für eine mögliche Mehrsprachigkeit, der Ordner gateway kann AJAX-Requests oder Schnittstellen bereitstellen und vendor beinhaltet Packages und Bibliotheken. Dies ist natürlich nur ein Beispiel für ein mögliches Web-Projekt. Egal wie ihr euer Projekt organisiert, ihr werden definitiv mit HTML, CSS und Javascript arbeiten und möglicherweise auch mit PHP.

Bitte beachte unsere Community-Richtlinien

Schreib den ersten Kommentar!

Melde dich mit deinem t3n Account an oder fülle die unteren Felder aus.