Wenn Toolkits besser sind als Frameworks

Beginnen wir mit einer Beobachtung: Ich liebe einige Frameworks. Als Alternative dazu, das Rad komplett neu zu erfinden oder eine Schaltfläche von Grund auf neu zu gestalten, ist es kaum zu übertreffen, eine Komplettlösung für Ihre grundlegenden HTML-/CSS-/JavaScript-Anforderungen zu haben.

Das Problem ist, dass es genau das ist, was ich oben gesagt habe. Frameworks wirklich sind nicht eine All-in-One-Lösung, oder? Obwohl wir sie modular und einfach anpassbar gemacht haben, haben sie manchmal einfach nicht das, was wir brauchen.

Es ist unmöglich, alle möglichen HTML-Snippets, Elementstile oder Javascript-Funktionen einzubinden, die man möglicherweise benötigt. Aber das kann auch eine gute Sache sein.

Ein Framework enthält möglicherweise viele Dinge, die wir einfach nicht benötigen. Zu meinen frustrierendsten Arbeiten überhaupt gehörte das manuelle Durchsuchen der riesigen CSS-Dateien von Bootstrap, um ein kleines Stück Code zu ändern, das mein Design ruiniert hatte.

Nehmen Sie zum Beispiel die Navigationsleistenkomponente von Bootstrap. Es ist großartig, es funktioniert einwandfrei und es sieht gut aus. Wenn Sie jedoch versuchen, das Erscheinungsbild grundlegend zu ändern, müssen Sie eine ganze Reihe von Stilen ändern, und es dauert eine Weile, sie alle zu finden. Wenn Sie nur eine horizontale Liste von Links oben auf der Seite haben möchten, ist es möglicherweise einfacher, eine neue Liste von Grund auf zu programmieren.

Aber hey, die bekannteren Frameworks da draußen, insbesondere Bootstrap, verfügen über viele Anpassungstools, oder? Ja, und das ist eine tolle Sache, aber die Standardoptionen bieten nicht genug Platz zum Arbeiten.

Einfach ausgedrückt: Wenn Ihr Fokus auf Kreativität liegt, ist ein umfangreiches Framework wahrscheinlich nicht der richtige Weg. Sicher, Sie können es hacken, aber das wird viel Zeit in Anspruch nehmen.

Ein weiteres Problem, auf das ich gestoßen bin: JavaScript-Inkompatibilitäten. Als jemand, der eigentlich kein Programmierer ist, war das schmerzhaft.

Konkret gab es dieses eine Mal, als ich versuchte, ein paar jQuery-Plugins in ein auf Foundation basierendes Design zu integrieren. Das allein ist kein entscheidender Faktor, aber es kostet mehr Zeit, Fehler zu beheben.

Das war natürlich irgendwann letztes Jahr. Ich weiß ehrlich gesagt nicht, was passieren würde, wenn ich dasselbe mit den neuen Versionen desselben Frameworks und derselben Plugins versuchen würde, aber es ist trotzdem etwas, das ich in Betracht ziehen sollte.

Lesen:  4 Tipps für die globale Expansion Ihres Unternehmens

Zusammenfassend lässt sich sagen, dass es Zeiten gibt, in denen Frameworks einfach nicht die Antwort sind. Hier kommt das Toolkit ins Spiel, und Sie sollten eines haben.

Was ist also ein Toolkit und wie unterscheidet es sich von einem Framework?

Ein Toolkit im Kontext dieses Artikels ist ein selbst zusammengestellter und kuratierter Satz von Tools, Snippets, Plugins und Ressourcen, mit denen Sie Ihre Projekte viel schneller programmieren können. Menschen werden diese Ressourcen oft im Laufe der Zeit finden und sich an sie binden. Es ist eine persönliche Sache, und Sie müssen wirklich Ihre eigene machen.

Ähnlichkeiten

  • Toolkits und Frameworks bestehen größtenteils aus Code, der Ihnen den Einstieg erleichtern soll.
  • Ihre Aufgabe ist es, Ihnen das Leben zu erleichtern, aber sie können und sollten nicht die ganze Arbeit für Sie erledigen.
  • Beide müssen gewartet und aktualisiert werden, um den neuesten Technologien Rechnung zu tragen.

Unterschiede

  • Toolkits machen keine Design- oder Strukturannahmen, was bei Frameworks oft der Fall ist.
  • Toolkits bestehen normalerweise aus Dingen, die aus völlig unterschiedlichen Quellen stammen.
  • Dabei handelt es sich nicht nur um Code, Toolkits können auch Software, mit Lesezeichen versehene Links usw. enthalten.
  • Toolkits verfügen in der Regel über keine „Standarddateien“, sodass Sie die Wahl haben.

Wann sollte ich welches verwenden?

Der Vorteil eines Toolkits gegenüber einem Framework ist seine Vielseitigkeit. Wie bereits erwähnt, ist ein Framework bei Projekten, bei denen Sie gestalterisch die Grenzen verschieben möchten, oft einfach zu umständlich.

Dieselbe Qualität ist auch der Nachteil des Frameworks bei kleinen bis mittelgroßen Projekten. Erstellen Sie eine Werbe-Landingpage? Eine One-Page-Website? Ein einfacher Blog? Dann ist ein Framework wahrscheinlich einfach unnötig. Es ist besser, wenn Sie bei Null anfangen und jedes Detail des Projekts zu Ihrem eigenen machen.

Ich würde sogar sagen – das ist nur meine Meinung –, dass die meisten inhaltsgesteuerten Websites kein vollwertiges Framework benötigen. Die Ausnahme wären z. B. große Websites ars technica Zum Beispiel. Für etwas so Großes sollten Sie ein Framework verwenden, aber Sie sollten es wahrscheinlich selbst von Grund auf entwickeln, um die genauen Anforderungen der Website zu erfüllen.

Frameworks wie Bootstrap und Foundation glänzen vor allem bei der Entwicklung von Webanwendungen und app-gesteuerten Websites. Bei diesen Projekten erweisen sich die relativ strengen Einschränkungen als nützlich, statt sie auszubremsen.

Lesen:  Wie können wir mit einem Smartphone Geräte finden, die mit WLAN verbunden sind?

So erstellen Sie Ihr eigenes Toolkit.

Die Erstellung eines eigenen Toolkits ist eine Frage von Zeit, Geduld und Erfahrung. Ich meine, klar, Sie könnten einfach nach „Webdesign-Ressourcen“ suchen. Sie würden Tausende und Abertausende von Zugriffen erhalten, und in ein paar Stunden könnten Sie mehr Codebits herunterladen, als Sie jemals verwenden könnten.

Aber das ist kein Toolkit. Das ist eine Bibliothek, die Sie niemals anfassen werden, weil das Durchsuchen viel zu lange dauern würde. Wir sind vielbeschäftigte Menschen, deshalb habe ich einen organischeren Ansatz gewählt: Wenn ich auf ein Problem stoße, google ich es.

Snippets sind oft zu lang, um sie auswendig zu lernen. Wenn ich also immer wieder nach dem Gleichen suche, füge ich es zu meinem Toolkit hinzu. Das Gleiche gilt für Software: Wenn Sie wissen, dass Sie sie häufig verwenden werden, fügen Sie sie hinzu.

Das heißt nicht, dass Sie sich niemals die Zeit nehmen sollten, einfach nur mit ein paar neuen „Spielzeugen“ zu experimentieren … das sollten Sie tun. Wenn Sie von einer bestimmten Ressource hören, die Ihre Arbeitsweise zum Besseren verändern könnte, schauen Sie sich das unbedingt an. Denken Sie jedoch daran, dass Toolkits besser relativ klein gehalten werden sollten. Sie sollten sich darauf konzentrieren, nur das zu behalten, was Sie benötigen, um die Bedürfnisse zu erfüllen, denen Sie regelmäßig begegnen.

Mein Werkzeugkasten

Ich möchte noch einmal betonen, dass Toolkits etwas sind, das man selbst erstellen muss, um seinen eigenen Bedürfnissen gerecht zu werden. Dennoch werde ich die Dinge in meinem Toolkit auflisten, um Ihnen eine bessere Vorstellung davon zu geben, worauf Sie bei der Erstellung Ihres eigenen Toolkits achten müssen.

Ein CSS-Präprozessor

CSS-Präprozessoren mögen WENIGER Und SASS Mach zwei Dinge:

  1. Sie erweitern die CSS-Grundfunktionalität um Variablen, Mixins, verschachtelte Selektoren usw.
  2. Sie beschleunigen das Codieren von CSS.

Wenn Sie noch nicht versucht haben, CSS mit einem Präprozessor zu programmieren, empfehle ich Ihnen dringend, dies jetzt zu tun. Im Augenblick. Ich werde warten.

Lesezeichen

Eine gut organisierte Liste mit Lesezeichen kann von großem Nutzen sein, wenn Sie etwas benötigen, das Sie nicht auf Ihrer lokalen Festplatte speichern können. Ich setze Lesezeichen für Dinge wie CSS3-Generatoren, Sprite-Generatoren, Ersteller von Farbschemataund andere Tools, die mir helfen, Aufgaben schnell zu erledigen, die von Hand viel länger dauern.

Lesen:  Das beste Antivirenprogramm ohne Datenlöschung (Teil 1)

Semantic.gs: eine Layout-Engine

Grid-Systeme sind so 2000er Jahre. Seitdem responsives Webdesign Realität geworden ist, sind Grid-Systeme immer komplexer geworden, um den Anforderungen unzähliger Geräte gerecht zu werden.

Und was ist, wenn Sie ein individuelles Rastersystem benötigen? Sie könnten einen der vielen Online-Generatoren für responsive Grid-Systeme nutzen, diese sind jedoch begrenzt.

Die Lösung kommt in Form von semantic.gs. Während der eigene Autor es als Rastersystem bezeichnet, bezeichne ich es lieber als Layout-Engine, weil es kein einzelnes Raster ist. Es handelt sich um ein Tool, das auf der CSS-Vorverarbeitung basiert (Sie können es mit LESS, SASS und Stylus verwenden) und es Ihnen ermöglicht, im Handumdrehen jedes gewünschte Raster zu generieren, mit fester Breite oder responsiv.

Sie müssen lediglich einige Zahlen in einer .less-Datei (oder SASS usw.) ändern und loslegen.

Emmet – früher bekannt als Zen Coding

Emmet ist eine Sammlung von Plugins, die Abkürzungen in vollständige Codezeilen umwandeln, sowohl in HTML als auch in CSS.

Im Grunde ergibt sich Folgendes:

div>ul>li*3>a

Das mögen:

Wie cool ist das?

Ausschnitte

Snippets sind kleine Codefragmente, die Sie immer wieder verwenden, weil sie einfach so nützlich sind, Sie sie lieben und sich alle außer Ihnen merken möchten kann einfach nicht.

Jeder gute Texteditor verfügt normalerweise über eine Möglichkeit, sie zu speichern und einfach abzurufen. Im Moment müsste es mein Lieblings-Snippet-Snippet sein dieses für WordPress. Die Vorlagenfunktionen und Optionen von WordPress für „functions.php“ können schwer zu merken sein, daher ist dies ein Lebensretter.

jQuery-Plugins

Wie ich bereits sagte, ich bin kein echter Programmierer. Wenn also irgendeine Art von erweiterter Animation oder UI-Funktionalität erforderlich ist, aber nicht so sehr, dass sich ein Framework lohnt, greife ich auf einzelne Plugins zurück.

Einige meiner Favoriten sind:

  • Scrollto.js: ein reibungslos scrollendes Skript.
  • idTabs: für den Fall, dass Sie eine Benutzeroberfläche mit Registerkarten benötigen.
  • Übergroß: für den Fall, dass Sie eine ganzseitige Diashow benötigen.
  • ResponsiveSlides.js: was der Name sagt. Es ist ein responsiver Bildschieberegler. Was will man mehr?

Es ist nie zu früh, eine eigene persönliche Bibliothek mit nützlichen Dingen zu haben.

Welche Tools würden Sie gerne in Ihrem Toolkit sehen? Ohne welche Ressourcen könnten Sie nicht leben? Lass es uns in den Kommentaren wissen.

Ausgewähltes Bild/Miniaturansicht, Bild des Mathematiker-Toolkits über Marc Kjerland.

Aktuelle Artikel:

Empfohlen