Meine Rolle als Front-End-Webingenieur erklärt?

Hallo, ich heiße Shaun Stone. Ich bin ein leitender Front-End-Webingenieur aus London, Großbritannien. Ich arbeite in der FinTech-Branche und liebe meine Arbeit. In diesem Artikel möchte ich etwas über meine Rolle erklären. Für alle da draußen, die eine Karriere in der Webentwicklung anstreben, ist dies möglicherweise hilfreich.

Ich werde behandeln: Was wir tun, wie wir unsere Arbeit verwalten, den Karriereweg, die Sprachen und Werkzeuge, die wir verwenden. Abschließend werde ich Ratschläge geben, wie Sie in die Softwareindustrie einsteigen können. Keine Sorge, ich verkaufe nichts - einige Ratschläge, die ich mir wünschte, als ich anfing. ?

Ein Front-End-Webingenieur ist für die Implementierung visueller Elemente verantwortlich, die Benutzer in einer Webanwendung sehen und mit denen sie interagieren.

Wir bauen UI ?

Wir konzentrieren uns auf die Erstellung der Benutzeroberfläche (User Interfaces) für die Benutzer unserer Website oder Webanwendung. Wir betrachten einige Dinge:

  1. Barrierefreiheit: Im Internet oft übersehen, entwickeln wir unsere Anwendungen so, dass sie für Benutzer mit Behinderungen geeignet sind. Dies kann eine kognitive Beeinträchtigung oder eine eingeschränkte Geschicklichkeit sein. Ein Beispiel ist jemand, der mit anklickbaren Bereichen wie Funkeingängen oder Kontrollkästchen zu kämpfen hat.
  2. Ästhetik: Die Stile unserer UI-Elemente wie Schaltflächen, Schriftarten und Abstände. Kürzlich haben wir ein Design-System implementiert, das die Konsistenz unserer Produkte gewährleistet. Weitere Informationen zu Designsystemen finden Sie hier.
  3. Leistung: Wir müssen über die Leistung unserer Anwendungen nachdenken, um die Seitengeschwindigkeit schnell zu halten. Dies beinhaltet die Reduzierung von Netzwerkanforderungen, die Optimierung von Bildern und SVG-Dateien mithilfe von Methoden wie der Komprimierung. Je schneller Sie diese Anmeldeseite laden, desto größer ist die Wahrscheinlichkeit, dass sich Benutzer anmelden. Wir verwenden Lighthouse von Google, um interessante Messdaten zu bewerten und zu sammeln.
  4. Sicherheit: Vorrangig. Winzige Fehler im Code können dazu führen, dass private Informationen verloren gehen, und es gibt Leute da draußen, die danach hungern. Natürlich ist es ein großes Thema. Lesen Sie die Grundlagen der Informationssicherheit von Mozilla:
  5. Codequalität : Wir verwenden Codeüberprüfungen, um die Arbeit des anderen zu überprüfen. Wir benötigen mindestens zwei Genehmigungen, bevor unsere Live-Anwendungen bearbeitet werden können. Wir verwenden Codierungsstandards, die im gesamten Frontend eingehalten werden müssen. Github ermöglicht es uns, dies und mehr zu tun.

Arbeitsmanagement?

Wir folgen den agilen Prinzipien der Softwareentwicklung, wie auch die meisten Unternehmen. Es ist eine Möglichkeit, unsere Arbeit für die nächsten zwei Wochen zu planen (ein Sprint). Während dieses Prozesses verfeinern wir die Tickets, die wir nach diesen zwei Wochen haben.

Die gesamte verbleibende Arbeit wird in einem sogenannten Rückstand gespeichert. Dieser Rückstand wird mit der Arbeit gefüllt, die wir in Zukunft erledigen werden.

Eine Straßenkarte gibt uns eine klare Richtung, wo wir sein wollen. Dazu verwenden wir ein Projektmanagement-Tool namens Jira von Atlassian.

Zeremonien ?

  1. Die Sprint-Planung bereitet das Team auf den Erfolg während des gesamten Sprints vor. Das Treffen beinhaltet das Durchlaufen des Auftragsbestands und die Priorisierung dessen, was für die nächsten zwei Wochen abgeschlossen werden soll. Das Team muss jede Geschichte schätzen, um zu sehen, wie viel Aufwand von uns verlangt wird. Anhand des Aufwandes können wir die Kapazität messen (wie viel im Vergleich zur verfügbaren Entwicklungsressource getan werden kann).
  2. Tägliches Aufstehen ist ein sehr kurzes Treffen mit Ihrem Team, um zu erklären: Was Sie gestern getan haben, was mache ich heute und hindert mich irgendetwas daran, meine Arbeit zu erledigen? (Blockierung). Dies hält alle auf dem Laufenden. Halt dich kurz. Es war einmal, eine Stand-up dauerte eine Stunde für mich ...?
  3. Die Sprint-Überprüfung erfolgt am Ende des Sprints. Wir zeigen anderen Stakeholdern (Mitglied des Produktteams, Benutzer unseres Systems), was wir erreicht haben. Wir tun dies, indem wir eine Demo unserer Arbeit machen. Dies gibt ihnen das Vertrauen, dass wir Fortschritte machen.
  4. Retrospektive ist eine Möglichkeit, darüber nachzudenken, was gut gelaufen ist und was nicht. Dies wirft Probleme auf. Aus diesen Problemen schaffen wir Aktionen. Eine Aktion ist eine Sache, um einen Prozess einzuleiten, bei dem wir verhindern können, dass diese negative Sache erneut auftritt. Die Dinge, die gut gelaufen sind, geben uns ein Verständnis dafür, was uns dazu bringt, besser zu arbeiten.

Karriereweg ↗️

Unternehmen haben ihre eigenen Karrierewege. Ein sehr verbreitetes Fortschrittsmuster als Softwareentwickler ist das Folgende.

Bitte beachten Sie: Dies ist meine eigene Meinung und basiert auf meinen eigenen Erfahrungen. Die Begriffe "Ingenieur" und "Entwickler" werden synonym verwendet.

  1. Nachwuchsentwickler haben wenig bis gar keine Erfahrung. Sie müssen von mehr hochrangigen Teammitgliedern geführt werden, um ihre Arbeit zu erledigen. Sie werden normalerweise viele Fragen stellen, können aber viel lernen und sind sehr motiviert, dies zu tun. Ihr Gehalt ist Einstiegsgehalt.
  2. Entwickler auf mittlerer Ebene verfügen über ein angemessenes Maß an Erfahrung. Sie können bestimmte Aufgaben selbst erledigen. Dennoch müssen Sie sich von Zeit zu Zeit an hochrangige Mitglieder wenden, um Rat zu erhalten. Sie können Junioren unterstützen und auch hochrangigen Mitgliedern gute Ideen liefern.
  3. Ältere Entwickler können von Anfang bis Ende ohne Anleitung liefern. Sie führen andere dazu, dasselbe zu tun und bewährte Praktiken zu befolgen. Sie sind erfahren genug, um zu wissen, wann etwas schief gehen kann und wie diese Probleme vermieden werden können.

Aber wenn Sie zu Senior kommen, ist es das? Nein, das sollte nicht sein. Es gibt zwei Wege, denen Sie folgen können.

4a. Der technische Leiter / Hauptentwickler / Architekt wird an den Kernentwickler / höherrangigen Entwickler im Team vergeben, der eine solide technische Vision bietet und den Respekt seiner Kollegen hat. Weniger in Code involviert als vielmehr in die Grundlagen der verwendeten Sprachen und Bibliotheken, den Entwicklungsprozess und die Infrastruktur.

4b. Der Teamleiter / Teammanager konzentriert sich jetzt mehr auf die Mitarbeiter des Teams. Ihr Wohlbefinden, ihr beruflicher Fortschritt und ein persönliches Gespräch mit jedem Teammitglied, um sicherzustellen, dass sie glücklich sind, aber auch wie erwartet liefern. Mehr Besprechungen würden zu weniger Entwicklungszeit führen. Managementfähigkeiten sind erforderlich, und es ist keine leichte Aufgabe.

Im Anschluss daran könnten Sie eine Führungsrolle übernehmen. Ein Beispiel ist ein Engineering Manager. Diese Person verwaltet mehrere Tech-Leads / Team-Leads. Ein weiteres Beispiel ist der Chief Technology Officer.

Unternehmen bewerten Ihr Kompetenzniveau in der Regel auf die Anzahl der Jahre Erfahrung, die Sie haben. Für mich ist das ein Trugschluss. Ich habe mit neuen Startern gearbeitet, die als jünger eingestuft wurden, aber kompetent und stark waren. Kandidaten sollten zum Nennwert genommen werden.

Sprachen lernen?

  1. HTML ist eine Auszeichnungssprache, die Struktur von Webseiten.
  2. CSS ist die Sprache zur Beschreibung der Präsentation des Webs, zum Umgang mit Farben, Layout, Abständen und mehr.
  3. JavaScript ist die Sprache des Webs. Es ist eine clientseitige Sprache und verbessert die Interaktion für den Benutzer auf einer Webseite.

Investieren Sie viel Zeit in die Beherrschung dieser drei Sprachen. Ich habe ein kurzes Beispiel dafür, wie sie in diesem CodePen zusammenarbeiten. Spielen Sie herum!

Bitte beachten Sie: Dieses Beispiel dient nur zu Demonstrationszwecken.

Sehen Sie sich hier meinen CodePen an

Wenn Sie dazu bereit sind, erstellen Sie Ihre eigene Version mit einem Firmennamen Ihrer Wahl und veröffentlichen Sie diese in den Kommentaren.

Zu verwendende Werkzeuge? ️

  1. Verwenden Sie Git, um die Versionen Ihres Codes zu verwalten. Es ermöglicht Teams, an Dateien zusammenzuarbeiten, ohne Arbeitsverlust zu verursachen.
  2. Verwenden Sie eine integrierte Entwicklungsumgebung (IDE), um Ihren Code zu schreiben. Es ist eine Software, die wie Notepad ist, aber mehr Schnickschnack bietet. Es kann Vorschläge zum Schreiben Ihres Codes und Farbcodes für Ihren Text enthalten, damit die Interpretation einfacher ist.

Rat ?

Als erstes erstellen Sie ein Github-Konto. Wie bei Behance for Designers ist dies ein Ort, an dem Sie den von Ihnen geschriebenen Code präsentieren können. Es gibt uns (Arbeitgebern) etwas, mit dem wir arbeiten können. Als ich die Universität verließ, suchte ich nach einer Möglichkeit, etwas zu bauen, auch wenn es kostenlos war. Ich wusste auf lange Sicht, dass es mir zugute kommen würde.

Freiberufliche Arbeit finden?

Eines meiner ersten freiberuflichen Projekte war für ein großes Unternehmen. Die Anwendung, die ich erstellen sollte, war leicht ein Angebot von 2 bis 3.000 Pfund. Ich habe es für ein paar hundert Pfund gemacht. Es war ein kompletter Schnäppchen für sie, aber es hat im Interview für meinen ersten Job geholfen, das ist sicher.

Beweisen Sie, dass Ihre Arbeit existiert?

Wann immer ich Lebensläufe überprüfe, normalerweise, wenn es heißt, dass Sie einen Kurs über Udemy gemacht haben und das war's, dann wird das nicht ausreichen. Ich möchte einen Beweis für Ihre Arbeit sehen. Für jedes Projekt, an dem Sie gearbeitet haben, auch wenn es ein persönliches Projekt oder ein Familienmitglied war, kann es in den Lebenslauf aufgenommen werden. Diese Erfahrungsansprüche sollten mit echten Beweisen belegt werden, sei es ein Link zur Videodemo oder ein Link zur realen Seite.

Erster Job? Toll! ?

Jetzt fassen Sie eine kleine Sammlung von Arbeiten zusammen. Sie beeindrucken ein kleines Unternehmen und beginnen Ihren ersten Job. Sie werden ein Junior sein und die Menschen um Sie herum haben Ihnen viel kostenlos beizubringen. Von Gleichaltrigen zu lernen ist nach meiner Erfahrung der beste Weg, um zu lernen, und natürlich viel billiger. Die meisten Online-Kurse helfen zunächst und sind gut zu befolgen. Sie sollten in der Lage sein, Ihre Fähigkeiten durch echte kommerzielle Erfahrung zu verbessern.

Sich selbst beweisen ?

Zeigen Sie, dass Sie eine Leidenschaft für Ihre Arbeit haben und die Dinge proaktiv verbessern möchten. Jeder Job, den Sie bekommen, hat gute und schlechte Eigenschaften. Versuchen Sie herauszufinden, wie Sie die schlechten Dinge verbessern und die guten Dinge für zukünftige Unternehmungen an Bord nehmen können. Bringen Sie ihnen in einem neuen Job - wenn das so ist - die guten Dinge bei, die Sie zuvor gelernt haben, und versuchen Sie, die neuen schlechten Dinge zu beheben. Wenn Sie das Gefühl haben, nicht mehr zu lernen, ändern Sie die Umstände so, dass Sie es sind. Ihre Fähigkeiten sollten in der Branche immer relevant sein, sonst bleiben Sie zurück. Es ist traurig, aber wahr.

Verkauf dich ?

Finden Sie immer Ausreden, um sie Ihrem LinkedIn hinzuzufügen. Erklären Sie, was Sie in Ihrem Job getan haben (Rollen und Verantwortlichkeiten). Dokumentieren Sie es wie ein Tagebuch, bevor Sie es vergessen. Fügen Sie ein professionelles Foto und eine starke Zusammenfassung hinzu. Das habe ich aktuell. Es hat sich im Laufe der Jahre weiterentwickelt.

Bisher habe ich mehr als 7 Jahre Erfahrung in der Erstellung von Webanwendungen. Ich habe in den Bereichen Automobil, Finanzen und Online-Spiele gearbeitet und war mit der Erstellung und Pflege maßgeschneiderter Webanwendungen für verschiedene Unternehmen befasst, die in den Bereichen Autowert, digitale Unterhaltung, Industriegase, Einzelhandel und Breitbandvergleichsdienste tätig sind. Einige meiner Hauptinteressen sind das Schreiben von Belletristik und Sachbüchern, das Erstellen und Integrieren von APIs, das Automatisieren sich wiederholender Aufgaben, das Erstellen von Handyspielen und Animationen mit Haxe, Unity oder JavaScript / HTML5.

Ich habe nicht nur viele technische Bücher gelesen, sondern auch meine eigenen mit dem Titel Automating with Node.js. Ich lese Artikel auf Plattformen wie Sitepoint, CSSTricks, Egghead, PHPArchitect und Smashing. Ich nehme an Konferenzen wie PHP London teil und behalte Facebook und die Entwicklerkanäle von Google im Auge. Ich bin immer offen für neue Ansätze und suche nach Tipps und Tricks, die ich auf meine eigene Arbeit anwenden kann - die ich auch mit meinen Kollegen teilen kann.

Es ist eine schnelllebige Branche?

Die Front-End-Welt bewegt sich sehr schnell. Bibliotheken / Frameworks scheinen immer von Jahr zu Jahr aufzutauchen. Sie werden sehen, dass viele Rollen Erfahrung mit React (erstellt von Facebook), Angular (von einem Google-Mitarbeiter) oder Vue (von einem intelligenten Typen namens Evan You) erfordern. Es gibt noch viel mehr, aber ich werde jetzt nicht ins Detail gehen.

Versuchen Sie, diese Bibliotheken zu erfassen, da sie sehr gefragt sind. Ich arbeite in meiner Rolle mit React und habe viel Zeit investiert, um es zu beherrschen. Diese Bibliotheken und Frameworks sind eine Ebene, die über der JavaScript-Sprache liegt. Werden Sie zuerst ein Profi in JavaScript.

Sachen bauen ??

Motivieren Sie sich, in Ihrer Freizeit an einem Projekt zu arbeiten. Ich war jahrelang so interessiert an persönlichen Spielentwicklungsprojekten. Sie lernen so viel während des Prozesses. Eines Tages dachte ich zufällig bei der Arbeit: "Wäre es nicht eine gute Idee, ein Spiel wie Schlachtschiffe zu haben, aber stattdessen mit Kaninchen." Ich weiß, richtig ... seltsame Gedanken zu haben .

Also fand ich einen Künstler, sagte ihm, was ich wollte, und arbeitete dann an einem Proof of Concept. Zum Spielen platzieren Sie fünf Hasen und fünf Fallen, lehnen sich dann zurück und schauen zu. Ich werde die Überraschung nicht ruinieren. Spiel hier.

Das war es fürs Erste. Wenn Sie jemals mehr Rat wünschen, können Sie mich gerne kontaktieren! Danke fürs Lesen und viel Glück! Lassen Sie ein paar Klatschen fallen, wenn Sie möchten. ?

Alles Gute,

Shaun Michael Stone. ✌️