Neue Ressourcen für Webdesigner und -entwickler (April 2018)

In diesem Monat haben wir einige Ankündigungen von namhaften technischen Namen gesehen. Zum Beispiel hat Apple ein neues Datenbanksystem aus einer Quelle bereitgestellt, Google ein neues Tool veröffentlicht, mit dem Sie die Geschwindigkeit Ihrer Website auf Mobilgeräten messen können, und Github mit einem kostenlosen Kurs, der Ihnen den Einstieg in Git, Github und die Codierung allgemein ermöglicht.

Auch im heutigen Post werde ich auch bieten eine Reihe neuer Tools, die derzeit auf dem Vormarsch sind. Kommen wir zu dem, was wir mehr auf der Liste haben.

VuePress

VuePress ist ein neues Werkzeug des Erstellers von Vue statischer Standortgenerator entworfen für Vue.js. Es generiert statisches HTML für jede Seite und zeigt dieses vor läuft als SPA (Single-Page Application). Es ist mit einigen Funktionen ausgestattet, einschließlich der Möglichkeit, Google Analytics-ID, Suche, nächste und vorherige Navigation, Seitenleiste und PWA.

IMG-2

Eine JavaScript-Bibliothek, die a einführt benutzerdefiniertes Element, img-2. Das neue Element fügt eine Reihe von Optimierungen hinzu, die nicht zum Standard gehören img Element, Verbessern, wie das Bild für die Benutzer geladen wird. Mit dem benutzerdefinierten Element wird das Bild auch vorgespeichert faule Ladung Die Bilder und Aufschläge werden nur aus dem Cache gespeichert, wenn die Bilder in das Ansichtsfenster des Benutzers gelangen. Schauen Sie sich die Demo an.

Tabler

Ein elegantes Dashboard / Admin-Panel basierend auf Bootstrap 4. Das Dashboard enthält vorgefertigte Komponenten wie Diagramme, Formulare, Galerien, eine Preistabelle und eine Übersicht Sammlung von benutzerdefinierten Icons. Ein guter Ausgangspunkt, damit Entwickler schnell ein Admin-Panel erstellen können. Schauen Sie sich die Demo an!

DayJS

DayJS JavaScript-Bibliothek zum Formatieren von Datum und Uhrzeit. Darüber hinaus verfügt DayJS über ähnliche APIs wie Moment.js, die jedoch nur 2 KB groß ist. In Anbetracht dessen könnte es eine sein tolle Alternative zu Moment.js, Wenn Sie eine leichtere Bibliothek wünschen und trotzdem wissen, was Sie bereits gewusst haben.

UnifiedArchive

UnifiedArchive ist eine PHP-Bibliothek für komprimierte Dateien und unterstützt eine Vielzahl von Formaten, einschließlich RAR, Zip, Gzip, Tar, und viele andere Komprimierungsarten. Mit dieser Bibliothek können Sie Dateien oder Verzeichnisse archivieren und extrahieren. Es bietet eine Handvoll APIs zum Bearbeiten von Dateien nachdem es aus dem Archiv extrahiert wurde. UnifiedArchive ist als Composer-Paket verfügbar.

Github Learning Lab

Github hat gerade eine angekündigt freier Kurs, der hauptsächlich Git in Github abdeckt. Momentan gibt es 5 Kurse, in denen Sie ein paar nützliche Dinge lernen können Wie benutzt man Github? um Ihre Codes zu hosten, So verwenden Sie Github-Seiten So erhalten Sie eine kostenlose Website oder ein Blog für Ihr Projekt und erfahren, wie Sie Zusammenführungskonflikte verwalten, die häufig auftreten, wenn Sie mit vielen Entwicklern an einem Projekt arbeiten.

WordPress UnitTest DOM Parser

Ein schöner Tipp von Takayuki Miyauchi an DOMElement testen, wenn UnitTest in WordPress-Anwendungen ausgeführt wird. Ich persönlich fand das sehr nützlich. Ich hoffe, Sie finden es genauso.

Popmotion

Eine JavaScript-Bibliothek für eine flüssige Animation im Web, “Popmotion” bietet eine API mit dem Namen Physics, mit der Sie Animationseffekte mit nahezu realer Realität erstellen können. Es ist unbestimmt; die Bibliothek einfach gibt Werte basierend auf dem spezifischen Satz der Konfiguration aus. Auf diese Weise können Sie diese Ausgaben anwenden, um ein beliebiges Medium zu animieren, einschließlich CSS, SVG, Three.js und sogar React.js.

Driver.js

Eine JavaScript-Bibliothek, die es Ihnen ermöglicht “Fahrt” Benutzer konzentrieren sich auf eine Seite. Dies ist besonders hilfreich, wenn Sie bestimmte Funktionen einführen oder zu bestimmten Aufgaben auf der Seite führen möchten. Driver.js ist nur 4 KB groß, anpassbar und tastaturfreundlich.

Animiertes GIF durch Video ersetzen

GIF ist überall, nachdem es großartig geworden ist. Das Problem bei GIF ist jedoch, dass es normalerweise sehr groß ist. Es ist eine Verschwendung von Bandbreite, aber die Grafikqualität ist oft schrecklich. Diese Guideline von Google zeigt, wie “Video” kann GIF ersetzen, um animierte Grafiken anzuzeigen.

Textmaske

Eine JavaScript-Bibliothek zu wandeln Sie den Text um, der eine spezielle Formatierung erfordert wie eine Telefonnummer, Währung oder eine Kreditkartennummer. Während der Benutzer den Text eingibt, wird der Text automatisch in die entsprechende Formatierung umgewandelt, um die Benutzererfahrung zu verbessern. Textmaske kann mit React, Vue oder einfach mit altem JavaScript verwendet werden.

Vergleichen Sie die Geschwindigkeit von mobilen Sites

Dies ist ein weiteres praktisches Tool von Google. Dieses Tool ermöglicht es Ihnen Überprüfen Sie die Geschwindigkeit Ihrer Website beim Laden vom Handy aus und schätzen Sie den gesamten Umsatzverlust, wenn die Website langsam lädt. Sie können Wählen Sie das Land und die Geschwindigkeit aus davon wird Ihre Website getestet.

VueNut

VueNut ist ein Entwicklungsbegleiter beim Erstellen einer Webanwendung mit Vue.js und Vuex einfacher, den gespeicherten Datenstatus zu untersuchen und ermöglicht es Ihnen, die Daten während der Entwicklung einfach zu bearbeiten. Cooles Zeug!

FoundationDB

Kürzlich hat Apple FoundationDB Open Source in Github erstellt. Es ist ein Schlüsselwertpaardatenbanksystem Das verspricht Skalierbarkeit und Leistung. Es ist cool, wenn große Tech-Unternehmen anfangen, einige ihrer Produkte mit Open Source zu betreiben.

Geschichtsbücher

StoryBooks ist ein Werkzeug dafür Erstellen Sie eine React-Komponente isoliert. Im Browser steht eine Benutzeroberfläche zur Verfügung, in der Sie die verschiedenen Zustände der einzelnen Komponenten sowie anzeigen können Testen Sie die Komponenten.

GhostText

Eine Browser-Erweiterung, die dies tun wird Synchronisieren Sie das, was Sie im Browser schreiben, mit Ihrem Texteditor oder umgekehrt. Ich fand das letztendlich nützlich, wenn Sie auf einer Website mit den Annehmlichkeiten und Funktionen Ihres Code-Editors schreiben möchten. GhostText ist für Chrome, Firefox und Opera verfügbar.

Coala

Coala ist ein CLI bietet eine Schnittstelle zum Flusen und Fixieren von Code unabhängig von den verwendeten Sprachen. Sie können Coala in einem Code-Editor verwenden, mit einem CI (Continuous Integration) integrieren und mit einer Konfigurationssyntax in anpassen .Coafile. Coala unterstützt viele Sprachen wie CSS, JavaScript, PHP. Weitere Informationen finden Sie in diesem Verzeichnis.

ReactStrap

ReactStrap ist eine Sammlung von Bootstrap 4-Komponenten, die in wiederverwendbare React-Komponenten umgewandelt werden. Wenn Sie Ihre alte, auf Bootstrap basierende Website modernisieren möchten, ist diese Bibliothek etwas, was Sie vielleicht näher untersuchen möchten.

Reacto

Ein weiteres auf React bezogenes Werkzeug ist Reacto IDE, die auf Electron basiert und für die Entwicklung von Webanwendungen mit ReactJS entwickelt wurde. Das ist sehr praktisch, wenn sich Ihre Entwicklung hauptsächlich um ReactJS dreht.

PicoJS

Eine JavaScript-Bibliothek das ermöglicht die Gesichtserkennung. Es funktioniert mit einem Foto oder von der integrierten Kamera. Es ist wirklich faszinierend, wie sich die Web-Technologie in den letzten Jahren entwickelt hat.