7 coole Dinge, die man mit JavaScript machen kann

7 coole Dinge, die man mit JavaScript machen kann

Die Programmiersprache JavaScript, die erstmals im September 1995 als 'LiveScript' veröffentlicht und im Dezember 1995 in 'JavaScript' umbenannt wurde, hat sich im Laufe der Jahre dramatisch weiterentwickelt.

JavaScript wurde von Netscape und Sun Microsystems entwickelt, um Webdesignern zu ermöglichen, über statische HTML/CSS-Seiten hinauszugehen und einfache Animationen, Benutzerinteraktionen und Formularfunktionen hinzuzufügen.

Netscape/Sun Microsystems träumte zwar davon, das Web durch JavaScript voranzubringen, wollte aber auch sicherstellen, dass der Code einfach zu verwenden ist, damit Designer und Entwickler die Vorteile von JavaScript nutzen können, ohne steile Lernkurven durchlaufen zu müssen.

Aufgrund der Popularität von Netscape/Sun Microsystems' Javascript begannen andere Browser, eigenes JavaScript entwickeln Motoren mit eigenen Standards. Dies erschwerte es den Webentwicklern zu dieser Zeit, das Verhalten von Websites konsistent zu gestalten.

Sun Microsystems hat 1997 ein Board auf den Markt gebracht, um Browser zusammenzubringen und dafür zu sorgen, dass Engines konsistent laufen. Dies ermöglichte es Websites, in allen Browsern konsistenter zu sein und die Benutzererfahrung zu verbessern.

Dieses Board ist auch heute noch aktiv und trägt ständig zur Weiterentwicklung des Webs bei.

Die Fähigkeiten von JavaScript sind im Jahr 2021 unglaublich. In Vanilla JavaScript können Sie ein VR/AR-Erlebnis, Spiele erstellen, JavaScript als serverseitigen Code ausführen, Apps und natürlich tolle Websites!

Das Internet ist wirklich Ihre Auster.

 

Werfen wir einen Blick auf all die erstaunlichen Dinge, die wir mit JavaScript machen können:

Website-Animation

1. Website-Animation

Haben Sie schon einmal eine Website besucht und waren erstaunt über die Anzahl der interaktiven Elemente, die auf der Seite herumflitzen und react zu Ihren Interaktionen? Oder bin ich nur ein Nerd?

Für diejenigen unter Ihnen, die nicht verstehen, was ich meine, hier zwei Beispiele:

Jahresrückblick des grünen Chamäleons . Baunfeuer.

Einfache Animationen können einer Website viel hinzufügen. Sie engagieren sich und machen Lust darauf, weiter zu sehen, was es sonst noch zu bieten hat.

Die Verwendung von Animationen, um Websites cool und ansprechend aussehen zu lassen, ist eine großartige Möglichkeit, sie zu verwenden, aber sie können auch praktischere Vorteile haben, wie zum Beispiel:

Lassen Sie eine Website schneller laden

Wenn eine Webseite viel Inhalt zu laden hat, verlängert sich die Ladezeit der Seite natürlich, was einen Benutzer möglicherweise frustriert, bis er einen Verkauf verliert.

Infolgedessen verwenden viele Websites mit hohem Inhalt Ladeanimationen für Benutzer, z. B. Spinner. Spinner sind oft recht einfach, aber sie lenken den Benutzer vom normalen weißen Bildschirm ab, während die Website Inhalte an Ort und Stelle verschiebt und sich schneller anfühlt.

Die Navigation in einer App flüssiger und verständlicher gestalten

Wenn Sie eine Webanwendung mit vielen Links verwenden, kann es schwierig sein, zu verstehen, wie Sie zu der Webseite navigiert sind, auf der Sie sich befinden.

Das Hinzufügen einfacher Animationen wie Seitenwischen und Elementen, die den Übergang von einer Seite zur anderen hervorheben, kann ausreichen, um die Benutzererfahrung zu verbessern.

Fahrende Aufmerksamkeit

Statischer Inhalt kann langweilig aussehen und macht es leicht für etwas im Hintergrund, die Aufmerksamkeit eines Benutzers von den wichtigen Inhalten abzulenken.

Nur einige einfache Animationen auf Ihrer Seite lenken die Aufmerksamkeit auf kleine Informationen wie einen Call-to-Action und tragen so dazu bei, den Benutzer durch Ihren Geschäftstrichter zu leiten.

Telefon Apps

2. Telefon-Apps

Danke an Firmen wie Apple und Google sind Apps ein Begriff geworden. Was auch immer Sie tun, ich bin sicher, es könnte jemand vorbeigehen und sagen: „Dafür gibt es eine App“.

Mit dem Aufkommen von Smartphones, Entwickler und Unternehmen konnten schnell vom Erfolg des App-Marktplatzes profitieren. Schauen Sie sich nur Facebook, Twitter, Tinder, Angry Birds und viele andere Apps an, die in dieser Branche Millionen gemacht haben.

Die Entwicklung von zwei Apps für jede Plattform erfordert Erfahrung und erfordert ein Team mit mehreren Fähigkeiten sowie einen Projektmanager, um sicherzustellen, dass sich beide Apps konsistent verhalten.

Einige Unternehmen haben sogar mehr als ein Team, um diese Aufgabe zu bewältigen. Hier hat das gute alte JavaScript seine Berufung in der App-Branche gefunden.

Verwendung von JavaScript-Frameworks wie React Nativ, ein Unternehmen kann Apps mit hohem Qualitätsstandard für eine Reihe von App-Betriebssystemen (einschließlich Android, iOS, Apple TV, Chromecast und sogar Windows Phone).

Das Unternehmen spart nicht nur Zeit und Geld, sondern erhält auch eine qualitativ hochwertige App, die auf beiden Plattformen gleich funktioniert und dabei gut funktioniert. Schauen Sie sich einfach die Facebook-App an, die wohl am häufigsten verwendete App, auf der basiert React Eingeborener.

Das ist eine große Sache. Jetzt können sogar kleine Unternehmen Apps entwickeln und im gleichen Bereich wie die großen Unternehmen konkurrieren. Neue Funktionen können auch zu Apps entwickelt werden, da Unternehmen Ressourcen nicht auf zwei verschiedene Betriebssysteme aufteilen müssen.

Open-Source-Community

Da die JavaScript-App-Szene gewachsen ist und bewiesen hat, dass sie lebensfähig ist, hat die JavaScript-Community große Anstrengungen unternommen, um Code zu teilen, um einige großartige Dinge zu erreichen und die Entwicklungszeit zu verkürzen.

Beispiele für Community-Bemühungen:

Expo App/Build-Tools

Expo ermöglicht es Ihnen, Ihren Code während der Codierung in Echtzeit auszuführen und Ihren Code über ein Kabel auf ein Gerät zu streamenless Netzwerk und reduziert somit die Kopfschmerzen beim Kompilieren und Hinzufügen der Möglichkeit, in einer nativen Umgebung über einen virtuellen Emulator zu testen.

npm

npm ist ein für JavaScript entwickelter Paketmanager, der Entwicklern hilft, Open-Source-Pakete in ihrem Projekt zu installieren und zu verwalten.

Mit Tausenden von Entwicklern, die diese Pakete auf der ganzen Welt hinzufügen und verwalten, gibt es fast immer ein Paket, mit dem Sie Ihrer App oder Website eine Funktion hinzufügen können.

Websites, die keinen Server benötigen

3. Websites, die keinen Server benötigen

Serverless Websites sind zwar noch ein relativ neues Konzept, haben aber das Potenzial, eine neue Richtung für das Website-Hosting einzuschlagen. Serverless Websites, die Dienste wie AWS Lambda verwenden, können eine relativ effiziente Möglichkeit zum Hosten einer Website sein.

Die Theorie

Ein Serverless Das Konzept der Website besteht darin, den Benutzern eine statische vorkompilierte HTML-Datei bereitzustellen. Wir reduzieren die Zeit bis zum ersten Byte (die Zeit, die der Server benötigt, um mit dem Senden von Daten zu beginnen) und die Zeit, die der Benutzer benötigt, um auf die Daten zuzugreifen, indem wir eine einzelne HTML-Datei bereitstellen.

Nachdem der Browser die Seite für den Benutzer gerendert hat, gibt JavaScript das Bild ein, um alle dynamischen Inhalte und Medien über APIs und CDNs (Content Delivery Network) zu rendern.

Die dynamischen Daten können sofort nach dem Laden in die Seite animiert werden, was ein reibungsloses Erlebnis bietet und Benutzern den Zugriff auf Daten ermöglicht, während andere Daten verarbeitet werden.

Eine gute Anwendung für dieses Konzept besteht darin, dass eine Website so codiert werden kann, dass Daten basierend darauf geladen werden, wo sie auf der Seite erscheinen, was bedeutet, dass dem Benutzer beim Scrollen Daten zur Verfügung stehen.

Serverless Websites stecken noch in den Kinderschuhen, und ich bin mir sicher, dass wir in den kommenden Jahren noch viel darüber hören werden.

Progressive Webanwendungen

4. Progressive Webanwendungen

Progressive Web Apps (PWAs) sind dank Unternehmen wie Google und Mozilla eine fantastische neue Technologie.

Für diejenigen unter Ihnen, die mit PWAs nicht vertraut sind: Es handelt sich um eine Technologie, die es Benutzern ermöglicht, eine Website auf ihrem Telefon oder Laptop auf die gleiche Weise wie Apps zu installieren, um eine Vielzahl von Vorteilen zu bieten, wie zum Beispiel:

Einfacher Zugriff über die App-Leiste oder den Startbildschirm

Wenn PWAs auf einem Gerät installiert sind, wird dem App-Tray und/oder dem Startbildschirm ein Symbol hinzugefügt. Dadurch können Benutzer die PWA laden, ohne durch einen Webbrowser navigieren zu müssen.

Die Ladezeiten sind im Vergleich zu Websites schneller

Da der Benutzer die Website lokal installiert hat, kann ein Entwickler statische Inhalte auf einem Gerät speichern und mithilfe von JavaScript Service Workers neue Daten abrufen.

Dies bedeutet, dass Ihr Gerät nur dann Daten laden muss, wenn neue Daten verfügbar sind, und die Website möglicherweise ohne Internetverbindung funktioniert (je nach Anwendungsfall).

PWAs eignen sich hervorragend für Unternehmen, da sie von einer Vielzahl verschiedener Funktionen profitieren können, z.

Less teuer zu bauen

Da die PWA auf der Unternehmenswebsite basiert, können Entwickler den Großteil des Codes der Website wiederverwenden und nur bei Bedarf neue Funktionen hinzufügen. Im Gegensatz zu einer App, bei der Entwickler häufig bei Null anfangen müssen.

Wie zu erwarten, kann dies Unternehmen viel Zeit und Geld sparen.

Reduzierter Serververkehr

Benutzer müssen ziehen less Daten von den Servern des Unternehmens dank PWA-Caching. Dies bedeutet, dass Unternehmen kleinere Server haben können, was zu geringeren Kosten führt.

Erhöhte Benutzerbeteiligung

Da die App vom Startbildschirm des Benutzers aus leicht zugänglich ist, ist sie immer sichtbar und erfordert less Marketing, um Benutzer dazu zu bringen, es herunterzuladen.

Videospiele

5. Videospiele

Seit den 1990er Jahren spielen Spiele eine bedeutende Rolle bei der Entwicklung von Webbrowsern. Die ursprünglichen In-Browser-Spiele, die mit Webbrowser-Plugins wie Adobe Flash oder Shockwaves erstellt wurden, waren große Zeitfresser, ähnlich wie es einige App-Spiele heute sind.

Websites, die dem Hosten von Spielen gewidmet sind, wie z Miniclip, hätte eine große Bibliothek von Spielen zur Verfügung.

Aufgrund von Sicherheitsbedenken, schlechter Leistung und einer Vielzahl anderer Faktoren wurde die Verwendung von Web-Plugins mit der Entwicklung des Webs zunehmend verpönt.

JavaScript zur Rettung!

Da Browser-Plugins im Laufe der Zeit veraltet sind, haben sich viele Entwickler JavaScript zugewandt, um die Lücke zu füllen.

Inzwischen wurden Frameworks, benutzerdefinierte Spiele-IDEs (Integrated Development Environments) und andere neue Technologien entwickelt, die es uns ermöglichen, die Möglichkeiten des Browsers voll auszuschöpfen und Entwicklern die Entwicklung einiger ziemlich fortschrittlicher Spiele zu ermöglichen.

Web Design

Vor kurzem wurde eine neue Technologie namens Web Assembly geboren. Dies ermöglicht Browsern die Verwendung traditioneller Programmiersprachen wie C++ über ein API-Client.

Web Assembly und JavaScript bieten jetzt in Kombination das Beste aus nativer Entwicklung und Website-Entwicklung, sodass Unternehmen Anwendungen und Spiele erstellen können, die die native Hardware Ihres Computers verwenden, während sie in einem Webbrowser ausgeführt werden.

Mit Unternehmen wie Google, die browserbasierte Spiele entwickeln Dienste wie Stadia, sieht die Zukunft des Web-Gamings rosig aus.

Drohnen

6 Drohnen

In letzter Zeit wurde viel über Drohnen gesprochen. Hobbyisten genießen es, Drohnen zu fliegen, Filmteams können einzigartige, filmische Aufnahmen machen und Entwickler können mit benutzerdefinierten "Hacks" wild werden.

Die Open-Source-Community wird ständig mit neuen coolen Sachen erweitert, die codiert werden können.

Wenn es um die Programmierung von Drohnen geht, bevorzugen die meisten Entwickler Sprachen wie C oder Python,

ozMwRq-IT2w
.

Ich würde jedoch nicht empfehlen, JavaScript zu verwenden, um Ihre Drohnen über andere Sprachen zu programmieren, da es less Dokumentation und andere Sprachen sind zur Laufzeit oft schneller.

Dies zeigt jedoch, wie vielseitig JavaScript sein kann.

Teilnahme an einer JavaScript-Konferenz

7. Nehmen Sie an einer JavaScript-Konferenz teil

Bei so vielen Entwicklern und Designern, die sich für die Programmiersprache JavaScript begeistern, ist es nur natürlich, dass sie mehr lernen und gleichzeitig ihr Wissen an andere Entwickler weitergeben möchten.

Wir Programmierer engagieren uns im gemeinnützigen Dienst.

Auf der ganzen Welt sind viele JavaScript-Veranstaltungen entstanden, die Entwickler aus allen Lebensbereichen zusammenbringen, um sich über kommende Trends in der Sprache zu informieren. Diese Gruppen sind für die Community sehr wichtig, weil sie neue Technologien voranbringen und Entwicklern eine Stimme in der Zukunft der Sprache geben.

Auch kleinere JavaScript-Events werden immer beliebter, und dank Websites wie Meetup und Eventbrite tauchen in Städten im ganzen Land neue auf.

Diese können neuen Entwicklern dabei helfen, in der Programmiersprache Fuß zu fassen, sowie erfahrenen Entwicklern, die Sprache zu beherrschen.

Wenn Sie sich für JavaScript interessieren, empfehle ich Ihnen, an einer JavaScript-Veranstaltung in Ihrer Nähe teilzunehmen.

JavaScript hat seit seiner Einführung einen langen Weg zurückgelegt, und ich bin zuversichtlich, dass dieser Trend noch viele Jahre anhalten wird.

Momentan erlauben Browser es Webseiten, immer mehr Computerleistung zu nutzen (insbesondere mit der neuen Web Assembly API), was dazu führen könnte, dass Browser und native Apps verschmelzen.

Vor diesem Hintergrund muss sich JavaScript weiterentwickeln, um Schritt zu halten, was in Zukunft zweifellos zu weiteren coolen Dingen in Bezug auf JavaScript führen wird.

Über den Autor
Autor: Daniel Luke
Daniel ist ein WordPress-Webdesigner mit langjähriger Erfahrung in der Arbeit mit verschiedenen WordPress-Themen, der es ihm ermöglicht, verschiedene Themen zu vergleichen und gegenüberzustellen, die Stärken und Schwächen zu verstehen, um sachliche, reale Bewertungen zu entwickeln.

Eine Sache noch... Wussten Sie, dass Leute, die nützliche Dinge wie diesen Beitrag teilen, auch FANTASTISCH aussehen? ;-);
Bitte kontaktieren Sie uns, wenn lass a nützlich Kommentieren Sie mit Ihren Gedanken und teilen Sie dies dann Ihren Facebook-Gruppen mit, die dies nützlich finden würden, und lassen Sie uns gemeinsam die Vorteile nutzen. Vielen Dank für das Teilen und nett zu sein!

Disclosure: Diese Seite enthält möglicherweise Links zu externen Websites für Produkte, die wir lieben und von ganzem Herzen empfehlen. Wenn Sie Produkte kaufen, die wir vorschlagen, können wir eine Empfehlungsgebühr verdienen. Solche Gebühren haben keinen Einfluss auf unsere Empfehlungen und wir akzeptieren keine Zahlungen für positive Bewertungen.

 

Wer sind wir?

CollectiveRay wird von David Attard geleitet - arbeitet seit mehr als 12 Jahren in und um die Webdesign-Nische und bietet umsetzbare Tipps für Leute, die mit und an Websites arbeiten. Wir betreiben auch DronesBuy.net - eine Website für Drohnen-Hobbyisten.

David Attard

 

 

Autor (en) Empfohlen am:  Inc Magazin Logo   Sitepoint-Logo   CSS Tricks Logo    Webdesignerdepot-Logo   WPMU DEV Logo   und viele mehr ...