Articles

Was ist ein Web-Framework, und warum sollte ich eines verwenden?

← Home

„Framework“ ist ein Wort, das im Zusammenhang mit Code häufig verwendet wird. Aber was ist überhaupt ein Framework? Wenn wir über Frameworks sprechen, fallen diese Frameworks normalerweise in drei verschiedene Kategorien – Frontend-, Backend- und CSS- oder Benutzeroberflächen-Frameworks. Aber selbst wenn Sie wissen, was Frameworks sind, welches sollten Sie lernen oder verwenden und warum? In diesem Beitrag wird erörtert, was ein Framework ist, welche Frameworks es gibt und wie Sie entscheiden können, welche Art von Framework Sie für Ihre Projekte verwenden sollten!

Was sind Frameworks

Wenn wir uns ein paar verschiedene Webanwendungen ansehen, können wir feststellen, dass es eine Menge doppelter Funktionen gibt. Viele haben eine Benutzerauthentifizierung, Seiten, die gerendert werden, sie verbinden sich mit Datenbanken, sie haben Profile, die man sich ansehen kann, sie haben alle stilisierte Informationsfeeds usw. Wenn ich wollte, könnte ich all diese Logik jedes Mal, wenn ich eine neue Anwendung erstellen möchte, selbst schreiben; es gibt jedoch auch viele Tools, die das für uns übernehmen können.

Außerdem möchten wir unseren Code beim Erstellen von Anwendungen oft auf bestimmte Weise formatieren, um effizienter zu werden und anderen Entwicklern zu helfen, unseren Code zu verstehen. Web-Frameworks helfen uns dabei, unsere Anwendungen zu strukturieren, und sie bieten uns zusätzliche Funktionen, die wir ohne allzu viel zusätzliche Arbeit hinzufügen können. Frameworks geben uns einen Ausgangspunkt, so dass wir uns auf die Funktionen und nicht auf die Konfigurationsdetails konzentrieren können.

Code wird viel öfter gelesen als geschrieben, und wenn man mit anderen Entwicklern zusammenarbeitet, ist es sehr wichtig, dass sie wissen, wo der Code für bestimmte Aufgaben geschrieben wird, damit sie ihn in ihrem eigenen Code verwenden können. Die Frameworks haben auch Konventionen dafür, wie der Code geschrieben und strukturiert wird, die standardisieren, wie die Entwickler ihren Code schreiben.

Die meisten Websites haben eine sehr ähnliche (um nicht zu sagen identische) Struktur. Das Ziel von Frameworks ist es, eine gemeinsame Struktur bereitzustellen, damit die Entwickler nicht alles von Grund auf neu machen müssen und den bereitgestellten Code wiederverwenden können. Auf diese Weise können wir uns mit Frameworks einen großen Teil der Arbeit sparen.

Zusammenfassend kann man sagen, dass man das Rad nicht neu erfinden muss.

von Awwwards.

Unter der Haube sind Frameworks nur Code-Bibliotheken (d.h. der Code anderer Leute), und die populären sind Open Source! Du kannst dir also den Code deiner Bibliothek online ansehen!

Backend vs Frontend

  • Das Frontend einer Webanwendung ist der Teil, den du siehst und mit dem du interagierst. Es besteht aus dem Webdesign und der Interaktion auf der Seite. In Bezug auf Programmiersprachen besteht dies fast immer aus CSS, HTML und JavaScript der Seite.

  • Das Backend besteht aus dem Server, der Datenbank und dem Code, der mit ihnen interagiert. Es besteht auch aus dem Code, der dynamische Daten an das Frontend der Seite weitergibt. Dies kann in den meisten Programmiersprachen erledigt werden. Die Sprachen, die wir heute hauptsächlich besprechen werden, sind Python, Ruby und Node JavaScript, aber es gibt unzählige andere.

What I Wish I Knew Before Learning to Code Ebook Cover

Wollen Sie mehr Ratschläge zum Programmieren lernen?

Laden Sie mein kostenloses Ebook herunter!

Benutzeroberflächen-Frameworks

Benutzeroberflächen-Frameworks helfen bei der Erstellung von stilisierten und professionell aussehenden Webanwendungen. Die meisten enthalten eine Art von Rastersystem, damit Sie Elemente ausrichten können, sie haben Farbschemata, die für Sie erledigt werden, und sie stilisieren Ihre HTML-Komponenten mit CSS, damit sie sauber und professionell aussehen. Diese gehören zur Frontend-Domäne, aber wenn wir uns auf Frontend-Frameworks beziehen, meinen wir normalerweise JavaScript-Frameworks.

Einige Frameworks für Benutzeroberflächen umfassen:

  • Bootstrap
    • Sehr bekannt und von Twitter entwickelt
    • Einfach zu erlernen und sieht professionell aus
    • Kann leicht als „Bootstrap Sites“ erkannt werden
    • Kann schwierig sein, Komponenten anzupassen
  • Materialize
    • Sauberes Aussehen
    • Ein bisschen mehr „Spaß“ als Bootstrap
    • Viele Styling- und Farboptionen
    • Folgt Googles Material-Style-Guide
  • Foundation
    • Viele Beispiele
    • Professionell aussehend
  • Semantic UI
    • Viel eingebaut-eingebaut
    • Eingebautein Themes, so dass es anpassbar ist
  • Grommet
    • Hat einen großen Fokus auf Barrierefreiheit
    • Sieht wirklich sauber aus
    • Nicht so verbreitet wie einige der anderen
    • Gemacht für React JS (ein weiteres Framework, das wir uns später ansehen werden)

Auswahl eines UI-Frameworks

Die Auswahl eines Frameworks für die Benutzeroberfläche hängt vor allem von den persönlichen Vorlieben für das Erscheinungsbild und den Zielen der Website ab. Die verschiedenen Stile können verschiedene Branchen ansprechen oder den Benutzern eine andere Botschaft vermitteln.

Frontend-Frameworks

Frontend-Frameworks sind in den meisten Fällen in JavaScript geschrieben und dienen zur Organisation der Funktionalität und Interaktivität Ihrer Website. Einige von ihnen umfassen:

  • Vue
    • Einfach zu erlernen
    • Sehr schnell
    • Alle damit verbundenen Tools sind gut verpackt
    • Nimmt Teile von Angular und React und optimiert sie
    • weniger verbreitet als einige andere
    • Flexibel. man kann es auf verschiedene Arten verwenden
  • AngularJS
    • Gebaut von Google
    • Gut unterstützt
    • Riesengroße Anzahl von Funktionen
    • Verbesserte Skalierbarkeit der Anwendung
    • Schwer zu debuggen
    • Große Lernkurve
  • Angular 2+
    • Gebaut von Google
    • Gut unterstützt
    • Fördert die Wiederverwendbarkeit
    • Verbessert die Skalierbarkeit von Anwendungen
    • Große Lernkurve
  • React
    • Gebaut von Facebook
    • Bündelt Frontend-Code in Komponenten
    • Organisiert Code und Daten, um Code wiederverwendbar zu machen
    • Große Lernkurve
  • Ember
    • Gibt eine große Menge an Funktionalität aus der Box heraus
    • Opinioniert (man muss die Formatierung verwenden)
    • Steile Lernkurve

Auswahl eines Frontend-Frameworks

Die Welt der Frontend-Frameworks entwickelt sich besonders schnell weiter, Es scheint, als ob alle paar Monate ein neues Frontend-Framework auf den Markt kommt. Lernen Sie, was für Sie Sinn macht, und machen Sie sich nicht zu viele Gedanken darüber, was das „heißeste“ Framework im Moment ist.

Einige Leute argumentieren, dass React und Vue eher Bibliotheken als Frameworks sind, aber viele Leute betrachten sie als Frameworks, also habe ich sie mit aufgenommen!

Backend Frameworks

Backend Frameworks sind viel vielfältiger. Sie sind in einer Vielzahl von Programmiersprachen geschrieben und haben eine Vielzahl von Funktionen. Die folgende Liste ist, wie die obige, eine sehr unvollständige Auflistung einiger der Frameworks, die es für die Erstellung von Anwendungs-Backends gibt.

  • Spring MVC
    • Java (schwieriger zu erlernende Sprache)
    • Sehr schnell
    • wenig eigenwillig
  • Django
    • Python (leichter zu erlernende Sprache)
    • Glücklicher Mittelweg zwischen sehr eigenwillig und weniger strukturiert
    • Gibt Ihnen eine Menge an Funktionalität von Haus aus (wie Benutzerauthentifizierung, Datenbankverbindungen und View-Rendering)
    • Kann schwierig sein, ein ausgefallenes Front-End zu integrieren.
    • Pythons Datenverarbeitung ist erstaunlich
  • Flask
    • Python (leichter zu erlernende Sprache)
    • Weniger rechthaberisch und mehr anpassbar als Django
    • Gibt einem weniger „out of the box“ (man muss mehr bauen)
  • Ruby on Rails
    • Ruby (leichter zu erlernende Sprache)
    • Sehr eigenwillig
    • Hat großartige Tools wie Scaffolding, so dass man schnell etwas bauen kann
    • Gibt einem eine Menge an Funktionalität out of the box (wie Benutzerauthentifizierung, Datenbankverbindungen, und View-Rendering)
    • Die Asset-Pipeline hilft bei der Front-End-Entwicklung
    • Ruby braucht länger zum Ausführen von Programmen als einige andere Programmiersprachen
  • Meteor
    • JavaScript (leichter zu erlernende Sprache)
    • Gibt Ihnen eine Menge Funktionalität von Haus aus (wie Benutzerauthentifizierung, Datenbankverbindungen, und View-Rendering)
    • Ist sehr gut mit modernen Front-Ends integrierbar
  • Express
    • JavaScript (leichter zu erlernen)
    • Sehr anpassbar
    • Sehr leichtgewichtig
    • Wenig eingebauteeingebauten Funktionen
    • Node ist sehr schnell

Auswahl eines Backend-Frameworks

Gemeinsam, wählen Sie ein Backend-Framework auf der Grundlage der Programmiersprache aus, in der es geschrieben ist. Berücksichtigen Sie auch, welche Funktionen Sie hinzufügen möchten – wenn Sie beispielsweise eine Authentifizierung (oder Benutzeranmeldung) für Ihre Website wünschen, wird es viel einfacher sein, sie in Django zu schreiben, wo die Authentifizierung eingebaut ist, als in Flask, wo Sie einen zusätzlichen Dienst benötigen würden.

Mehr erfahren

Wenn Sie ein Framework verwenden oder lernen möchten, finden Sie hier eine Reihe von Anwendungen, die mit verschiedenen Frameworks erstellt wurden, damit Sie beurteilen können, welches für Sie am sinnvollsten ist. Es gibt noch viele weitere Frameworks unterschiedlicher Größe und Beliebtheit, aber dieser Artikel gibt einen kurzen Überblick über einige der populären Frameworks und zeigt, wo man anfangen kann. Es gibt keine richtige Antwort darauf, was man zuerst lernen sollte! Alles hat seine Vor- und Nachteile, also wägen Sie ab, was für Sie am wichtigsten ist, und entscheiden Sie dann. Frameworks sind sehr hilfreich und machen das Schreiben von Code in den meisten Fällen sehr viel schneller, aber eine solide Programmiergrundlage ist auch sehr wichtig – stellen Sie also sicher, dass Sie die Sprache, in der Ihr Framework geschrieben ist, zuerst gut kennen. Frameworks sind super hilfreich beim Schreiben von Webseiten, weil sie eine Struktur erzwingen, die andere Entwickler im Framework verstehen, und sie geben dir gemeinsame Funktionen, so dass du das Rad nicht neu erfinden musst!

Wo mit dem Lernen beginnen…

  • Django Girls Tutorial – Ich habe mein erstes Framework durch ihr Online-Tutorial gelernt!
  • Code Academy
  • TodoMVC
  • CodeNewbie Podcast

Und wenn du eine Idee für eine Anwendung brauchst…

  • Gute App-Ideen
  • 15+ APP-Ideen, die du bauen kannst, um deine Programmierfähigkeiten zu verbessern

Werde als Erster über meine Beiträge informiert!