Was es bedeutet, im Jahr 2020 (und darüber hinaus) ein Frontend-Entwickler zu sein

Haben Sie jemals darüber nachgedacht, was der Front-End- Teil des Front-End- Entwicklers wirklich bedeutet? Ich habe einmal Eric Meyer (der Websites erstellt, seit es Websites gibt) einmal gefragt, ob er wusste, was der Begriff in den frühen Tagen bedeutete, und er sagte ja. Es handelt sich also nicht um einen brandneuen Titel oder eine brandneue Position, aber der Umfang hat sich im Laufe der Jahre sicherlich geändert.

​​„Frontend“ bedeutet im Wesentlichen Webbrowser. Ich betrachte mich als Front-End-Entwickler und würde es ehrlich gesagt nicht hassen, wenn Sie mich als Webbrowser-Entwickler bezeichnen würden. Aber das wird sich wahrscheinlich nicht durchsetzen (und klingt so, als würden Sie Webbrowser bauen). Als Frontend-Entwickler arbeiten Sie sehr eng mit Webbrowsern zusammen und schreiben den Code, der darin ausgeführt wird, insbesondere HTML, CSS, JavaScript und die Handvoll anderer Sprachen, die Webbrowser sprechen (z. B. Medienformate wie SVG). Oder, vielleicht noch häufiger erklärt, Code, der letztendlich in die Sprachen verarbeitet wird, die Browser verstehen. Das ist Ihr Revier als Frontend-Entwickler!

Browser existieren nicht allein, sie laufen auf einer breiten Landschaft von Geräten. Das haben wir durch die Ära des responsiven Designs gelernt. Und am wichtigsten: Benutzer verwenden diese Browser auf diesen Geräten. Niemand ist näher am Benutzer als Frontend-Entwickler. Front-End-Entwickler schreiben also Code für Benutzer, die Browser verwenden, die auf einer Vielzahl von Geräten ausgeführt werden.

Allein der Umgang mit dieser riesigen Landschaft von Benutzern, Geräten und Browsern ist eine Aufgabe für sich! Ich denke, dass man nicht jeden Tag philosophisch über seine Berufsbezeichnung nachdenkt, und das ist in Ordnung; Wir denken hier nur ein wenig mit deinem alten Großvater Chris nach.

​​Wenn Sie gerade ein Coding-Bootcamp abgeschlossen haben und Ihre Erfahrung beim Erstellen von Websites etwas eng und neu ist, könnte es Ihnen verziehen werden, wenn Sie Front-End-Entwicklung als „das React-Zeug“ und Back-End-Entwicklung als „das Node Zeug“ oder „das Python-Zeug“, wie es heutzutage die heißesten Geschmacksrichtungen sind. Du liegst auch nicht falsch. React wird im Allgemeinen als Front-End-Framework verwendet (es ist buchstäblich JavaScript, das in Browsern ausgeführt wird). Node und Python sind Beispiele für Sprachen, die nicht wirklich in Webbrowsern laufen; Sie sind so gebaut, dass sie auf Webservern (ähm, Computern) laufen.

Bleiben Sie eine Weile in diesem Bereich, und Sie werden sehen, wie diese Bibliotheken, Sprachen, Erstellungsprozesse und zum Teufel sogar ganze Philosophien darüber, wie Websites am besten erstellt werden, wie eine langsame Flut kommen und gehen.

​​Sie werden vielleicht Zeuge werden, wie einige Oldtimer von Zeit zu Zeit mit der Faust winken und schreien, dass wir aus den Fehlern der Vergangenheit lernen sollten. Sie könnten auch Zeuge einiger besonders ausgelassener Jugendlicher werden, die genauso hoch mit den Fäusten winken und die Vergangenheit zu einem irrelevanten Kontext und nicht mehr zu einem nützlichen Gesprächsthema erklären.

Wahrscheinlich haben sie beide recht. Solange niemand böse ist, ist alles Teil des Flusses.

Dinge ändern sich. Ich finde es richtig, dass viele Websites von heute komplexer sind als Websites von früher. Besonders die Großen. Die sozialen Netzwerke und Mediaplayer. Die Reisebuchungsseiten. Die E-Commerce-Schaufenster. Die Engineering-Tools. Diese Seiten haben groß angefangen und sind nur noch größer geworden. Sie sind Ökonomien für sich selbst, mit massiven Teams, die sie unterstützen. Diese Komplexität ist eine Ursache für Veränderungen in der Webtechnologie und eine Ursache für Reibungen zwischen der neuen und der alten Schule (wenn wir es so einfach darstellen können).

​​Viele Leute, die in der Technik arbeiten, arbeiten im Wesentlichen für eine große Website. Und so hören wir am häufigsten von diesen Leuten. Diese Leute bauen Werkzeuge. Sie schreiben Blogbeiträge, sie machen Podcasts, sie halten Vorträge. Sie helfen, die Technologie selbst zu ändern, um sie an ihre Bedürfnisse anzupassen.

Dabei ist das „Frontend“ immer noch nur der Browser. Die Browsersprachen HTML, CSS und JavaScript sind immer noch die Kerntechnologien, die im Spiel sind. Diese Sprachen entwickeln sich weiter, ebenso wie die Browser selbst, aber langsamer. Sie tun genau das Gegenteil von Silicon Valleys Lieblingsslogan: move fast and break things . Sie bewegen sich langsam und brechen sehr selten etwas.

​​Als Frontend-Entwickler kümmern Sie sich immer noch um Benutzer, die diese Browser auf diesen Geräten verwenden. Ihre Erfahrung ist unser Job. Die Werkzeuge helfen uns hoffentlich dabei.

Was machst du als Frontend-Entwickler?

• ​​Sie führen das Design so aus, dass es auf jedem Bildschirm gut aussieht
• ​​Sie wenden Semantik auf Inhalte an
• ​​Sie erstellen die Benutzeroberfläche abstrakt, sodass Sie Teile und Stile effizient wiederverwenden können
• ​​Sie erwägen die Zugänglichkeit dessen, was im Browser gerendert wird
• ​​Sie sind besorgt über die Leistung der Website, was bedeutet, dass Sie damit zu tun haben, wie groß und wie viele Ressourcen vom Browser verwendet werden.

​​Diese Dinge waren schon immer wahr und werden es immer sein, da es sich im Wesentlichen um Bedenken auf Browserebene handelt, und genau das ist das Front-End.

​​Was sich ändert, ist, dass der Browser immer mehr Arbeit leisten kann. Dafür gibt es alle möglichen Gründe, wie zum Beispiel, dass Browser-APIs leistungsfähiger werden, Bibliotheken schicker werden und Computer im Allgemeinen besser werden. Das Auslagern von Arbeit vom Server auf den Browser hat im Laufe der Jahre immer mehr Sinn gemacht (Single Page Apps!). Obwohl es interessant ist zu beobachten, wie das Pendel zurückschwingt (vorgerenderte Seiten!) und einen Mittelweg findet (JAMstack!).

​​Front-End-Entwicklung kann heutzutage auch Folgendes umfassen:

• ​​Architektur der gesamten Website von der kleinsten Komponente über ganze Seiten bis hin zur URL-Ebene
• Abrufen Ihrer eigenen Daten von APIs und Bearbeiten der Daten nach Bedarf für die Anzeige
• Selbstständiges Behandeln des Zustands der Website
• ​Mutieren/Ändern von Daten durch Benutzerinteraktionen und -eingaben und Beibehalten dieser Daten im Zustand und zurück zu den Servern über APIs

​​Das sind alles Dinge, die jetzt im Browser erledigt werden können, sehr zur großen Augen dieses alten Entwicklers. Das ist ein verdammt großer Heuhaufen an Verantwortung, wenn man bedenkt, dass es zu all dem Zeug kommt, das man bereits erledigen muss.

​​Während dieser Heuhaufen von Jobs im Laufe der Jahre tendenziell wächst, hat sich das Leitbild, das wir als Frontend-Entwickler haben, nicht allzu sehr verändert. Unsere Hauptaufgabe besteht nach wie vor darin, uns um Benutzer zu kümmern, die Webbrowser auf Geräten verwenden. Wir müssen also einige Daten abrufen. Das ist cool, wir tun es im Dienste des Aufbaus einer schnellen, semantischen und zugänglichen Seite, die den Bedürfnissen unserer Benutzer entspricht. Wir müssen also ein Designsystem aufbauen. Das ist cool, wir tun es, um eine verständliche Benutzeroberfläche für unsere Benutzer zu erstellen, die sich weiterentwickeln kann, ohne ein inkonsistentes Durcheinander zu verursachen. Also müssen wir eine neue, unbekannte Technologie lernen. Nun, es ist unsere Aufgabe, ein wachsames Auge zu behalten und sicherzustellen, dass neue Dinge letztendlich da sind, um unsere Website für die Benutzer zu verbessern.

Viel Glück!

Was kommt als nächstes: Warum Chris Coyier Local und Flywheel wählt, um seine Websites zu betreiben

Erfahren Sie, wie Chris Local und Flywheel nutzt, um seine Websites auf die nächste Stufe zu heben. Sehen Sie, was seine Lieblingsfunktionen sind, wie er sich auf Flywheel verlässt, um seine Websites (kostenlos!) zu migrieren, und vieles mehr! Klick hier um mehr zu erfahren.