Warum die JavaScript-Entwicklung so wahnsinnig detaillierter Code ist
Webentwicklung ist so interessant! Aber JavaScript ist... entmutigend.
Alles andere in der Webentwicklung ist für Sie ein Kinderspiel, aber wenn Sie tiefer in JavaScript eintauchen, werden Sie nicht umhin können, das tragische Gefühl zu verspüren: „Alle sind wach, aber Sie sind allein.“ - Genau wie bei anderen Jeder kennt einige wichtige Grundwissensinhalte, die Sie nicht kennen, und diese Inhalte können Ihnen helfen, das gesamte Wissen zu verstehen.
Die Wahrheit ist, dass Ihnen tatsächlich einige wichtige Teile zur Lösung des Problems fehlen.
Außerdem ist die Frontend-Entwicklung tatsächlich verrückt geworden.
Es geht nicht nur um dich.
Stellen Sie sich einen Stuhl hoch und setzen Sie sich. Es ist Zeit, eine JavaScript-Anwendung zu schreiben.
Der erste Schritt besteht darin, Ihre lokale Entwicklungsumgebung vorzubereiten und auszuführen. Also Gulp oder Grunt, warte, nein... NPM-Skripte auch!
WebPACK oder Browserify verwenden? Require.js? Upgrade auf ES6? Oder Babel zu sehr zu Ihrer Vorverarbeitung hinzufügen?
BDD oder regelmäßige Unit-Tests? Welches Assertion-Framework sollte verwendet werden? Natürlich wäre es schön, die Tests über die Befehlszeile auszuführen, also würde PhantomJS vielleicht auch funktionieren?
Angular oder React? Glut? Rückgrat?
Sie haben einige React-Dokumentationen gelesen: „Redux ist ein vorhersehbarer Zustandscontainer für JavaScript-Apps.“ So eins brauchst du auf jeden Fall.
Warum ist es so verrückt, JavaScript-Anwendungen zu erstellen? ! ?
Lassen Sie mich Ihnen helfen zu verstehen, warum ich sage, dass das alles so verrückt ist. Beginnen wir mit einem Beispiel und gehen dann zu hübschen Bildern über.
Dies ist eine „Hallo Welt!“-Anwendung für React.
// main.js var React = require('react'); var ReactDOM = require('react-dom'); ReactDOM.render( <h1>Hello, world!</h1>, document.getElementById('example') );
Noch nicht ganz fertig.
$ npm install --save react react-dom babelify babel-preset-react $ browserify -t [ babelify --presets [ react ] ] main.js -o bundle.js
Hier fehlen tatsächlich ein paar Schritte, wie die Installation von browserify und was Sie eigentlich tun müssen, um es im Web zum Laufen zu bringen, wenn Sie das getan haben, denn das erzeugt eigentlich keine Welchen Inhalt hat die Seite? ¯ _（ツ）_ /¯
Nachdem Sie dies abgeschlossen haben, benötigen Sie schließlich eine Datei namens bundle.js, die die neue React Hello World-Anwendung enthält – Das Programm hat 19.374 Zeilen von Code. Und Sie müssen nur Browserify, Babelify und React-Dom installieren und Tausende unbekannter Codezeilen berücksichtigen.
Im Grunde ist das also…
Marc ist fast bereit, seine „Hello World“-React-App zu implementieren pic.twitter.com/ptdg4yteF1
—— Thomas Fuchs (@thomasfuchs) 12. März 2016
Schreiben wir eine Hello World-App mit einfachem JavaScript-Code.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>Hello World</title>
</head>
<body>
<p id="container"></p>
<script>
document.body.onload = function(){
var container = document.getElementById("container");
container.innerHTML = '<h1>"Hello, world!"</h1>';
}
</script>
</body>
</html>Das ist es. 18 Zeilen Code. Sie können die Datei index.html kopieren/einfügen, darauf doppelklicken und sie in Ihren Browser laden. Beenden.
Wenn Sie an diesem Punkt denken: „Warten Sie, React kann mehr als diese kleine Sache, die Sie gerade geschrieben haben, und auf diese Weise können Sie keine JavaScript-App schreiben!“ Zeit) stimmt, aber man muss noch einen kleinen Schritt machen, um zu verstehen, warum alles verrückt ist.
Hier sind die Bilder, die ich versprochen habe.
Die überwiegende Mehrheit der JavaScript-Webanwendungen, an denen Sie arbeiten werden, wird irgendwo in der Mitte der Glockenkurve liegen. Und wenn Sie mit einem vollständigen React-Stack beginnen, überarbeiten Sie Ihre Anwendung von Anfang an massiv.
Deswegen spielt alles verrückt. Die meisten dieser Tools halten Sie für notwendig, um Probleme zu lösen, aber Sie sind noch nie auf ein solches Problem gestoßen und werden auch in Zukunft nie auf ein solches Problem stoßen.
Gleiches Bild:
Da standardmäßig jeder seine Apps überdesignt und dies erkennt, ist der Stand der Javascript-Entwicklung zu ausführlich geworden.
Wie sollte man eine JavaScript-Anwendung starten? Sollte ich ein Tool wie React oder Angular verwenden? Sollte ich einen Paketmanager verwenden? Wenn nicht, was sollten Sie tun? Ist ein Test notwendig? Soll das Markup in Javascript generiert werden? All dies sind Fragen, die Sie sich stellen sollten, bevor Sie einen riesigen Technologie-Stack auf den Markt bringen, der standardmäßig mitgeliefert wird.
Wenn Sie eine JavaScript-Anwendung starten, besteht der Schlüssel darin, einen Punkt auf der Glockenkurve auszuwählen, der knapp über dem Komplexitätsgrad liegt, den die App Ihrer Meinung nach irgendwann erreichen wird.
Ich werde nicht lügen, es braucht Erfahrung, um das zu bestätigen. Aber es gibt hier einen ziemlich großen Sweet Spot, mit dem Sie die meisten JavaScript-Apps starten können: jQuery plus clientseitige Vorlagen und supereinfache Build-Tools zum Verketten und Minimieren von Produktdateien (vorausgesetzt, Ihre Backend-Architektur verfügt nicht bereits darüber), wenn Sie fertig sind ).
Wenn Sie wissen, wie man eine Javascript-App richtig erstellt, werden Sie beginnen zu verstehen, wie, wann und warum Sie ein Framework oder npm/requir/webPack oder ES6 verwenden, wann Sie Tests schreiben und wann Sie sich die Mühe machen sollten, Ihre zu erstellen Tests lokaler Ausführung vs. Ausführung im Browser usw., all diese Fragen tauchen auf.
Möchten Sie diese Lücken mit Ihrem JavaScript-Entwicklungswissen schließen? Möchten Sie vermeiden, dass Sie sich überfordert fühlen und dabei Ihre JavaScript-Anwendungen massiv überarbeiten? Darauf werde ich mich später konzentrieren, also bleiben Sie dran!
Das obige ist der detaillierte Inhalt vonWarum die JavaScript-Entwicklung so wahnsinnig detaillierter Code ist. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
1382
52
Vier empfohlene KI-gestützte Programmiertools
Apr 22, 2024 pm 05:34 PM
Dieses KI-gestützte Programmiertool hat in dieser Phase der schnellen KI-Entwicklung eine große Anzahl nützlicher KI-gestützter Programmiertools zu Tage gefördert. KI-gestützte Programmiertools können die Entwicklungseffizienz verbessern, die Codequalität verbessern und Fehlerraten reduzieren. Sie sind wichtige Helfer im modernen Softwareentwicklungsprozess. Heute wird Dayao Ihnen 4 KI-gestützte Programmiertools vorstellen (und alle unterstützen die C#-Sprache). https://github.com/YSGStudyHards/DotNetGuide1.GitHubCopilotGitHubCopilot ist ein KI-Codierungsassistent, der Ihnen hilft, Code schneller und mit weniger Aufwand zu schreiben, sodass Sie sich mehr auf Problemlösung und Zusammenarbeit konzentrieren können. Git
Welcher KI-Programmierer ist der beste? Entdecken Sie das Potenzial von Devin, Tongyi Lingma und SWE-Agent
Apr 07, 2024 am 09:10 AM
Am 3. März 2022, weniger als einen Monat nach der Geburt von Devin, dem weltweit ersten KI-Programmierer, entwickelte das NLP-Team der Princeton University einen Open-Source-KI-Programmierer-SWE-Agenten. Es nutzt das GPT-4-Modell, um Probleme in GitHub-Repositorys automatisch zu lösen. Die Leistung des SWE-Agenten auf dem SWE-Bench-Testsatz ist ähnlich wie die von Devin, er benötigt durchschnittlich 93 Sekunden und löst 12,29 % der Probleme. Durch die Interaktion mit einem dedizierten Terminal kann der SWE-Agent Dateiinhalte öffnen und durchsuchen, die automatische Syntaxprüfung verwenden, bestimmte Zeilen bearbeiten sowie Tests schreiben und ausführen. (Hinweis: Der obige Inhalt stellt eine geringfügige Anpassung des Originalinhalts dar, die Schlüsselinformationen im Originaltext bleiben jedoch erhalten und überschreiten nicht die angegebene Wortbeschränkung.) SWE-A
Erfahren Sie, wie Sie mobile Anwendungen mit der Go-Sprache entwickeln
Mar 28, 2024 pm 10:00 PM
Tutorial zur Entwicklung mobiler Anwendungen in der Go-Sprache Da der Markt für mobile Anwendungen weiterhin boomt, beginnen immer mehr Entwickler damit, sich mit der Verwendung der Go-Sprache für die Entwicklung mobiler Anwendungen zu befassen. Als einfache und effiziente Programmiersprache hat die Go-Sprache auch großes Potenzial für die Entwicklung mobiler Anwendungen gezeigt. In diesem Artikel wird detailliert beschrieben, wie die Go-Sprache zum Entwickeln mobiler Anwendungen verwendet wird, und es werden spezifische Codebeispiele angehängt, um den Lesern den schnellen Einstieg und die Entwicklung eigener mobiler Anwendungen zu erleichtern. 1. Vorbereitung Bevor wir beginnen, müssen wir die Entwicklungsumgebung und die Tools vorbereiten. Kopf
Zusammenfassung der fünf beliebtesten Go-Sprachbibliotheken: wesentliche Tools für die Entwicklung
Feb 22, 2024 pm 02:33 PM
Zusammenfassung der fünf beliebtesten Go-Sprachbibliotheken: wesentliche Werkzeuge für die Entwicklung, die spezifische Codebeispiele erfordern Seit ihrer Geburt hat die Go-Sprache große Aufmerksamkeit und Anwendung gefunden. Als aufstrebende effiziente und prägnante Programmiersprache ist die schnelle Entwicklung von Go untrennbar mit der Unterstützung umfangreicher Open-Source-Bibliotheken verbunden. In diesem Artikel werden fünf beliebte Go-Sprachbibliotheken vorgestellt. Diese Bibliotheken spielen eine wichtige Rolle bei der Go-Entwicklung und bieten Entwicklern leistungsstarke Funktionen und praktische Entwicklungserfahrung. Um die Verwendung und Funktion dieser Bibliotheken besser zu verstehen, werden wir sie gleichzeitig anhand konkreter Codebeispiele erläutern.
Welche Linux-Distribution eignet sich am besten für die Android-Entwicklung?
Mar 14, 2024 pm 12:30 PM
Die Android-Entwicklung ist eine arbeitsreiche und spannende Aufgabe, und die Auswahl einer geeigneten Linux-Distribution für die Entwicklung ist besonders wichtig. Welche der vielen Linux-Distributionen eignet sich am besten für die Android-Entwicklung? In diesem Artikel wird dieses Problem unter verschiedenen Aspekten untersucht und spezifische Codebeispiele aufgeführt. Werfen wir zunächst einen Blick auf einige derzeit beliebte Linux-Distributionen: Ubuntu, Fedora, Debian, CentOS usw. Sie alle haben ihre eigenen Vorteile und Eigenschaften.
VSCode verstehen: Wofür wird dieses Tool verwendet?
Mar 25, 2024 pm 03:06 PM
„VSCode verstehen: Wofür wird dieses Tool verwendet?“ „Als Programmierer, egal ob Sie Anfänger oder erfahrener Entwickler sind, können Sie auf den Einsatz von Codebearbeitungstools nicht verzichten.“ Unter vielen Bearbeitungstools ist Visual Studio Code (kurz VSCode) bei Entwicklern als Open-Source-, leichter und leistungsstarker Code-Editor sehr beliebt. Wofür genau wird VSCode verwendet? Dieser Artikel befasst sich mit den Funktionen und Verwendungsmöglichkeiten von VSCode und stellt spezifische Codebeispiele bereit, um den Lesern zu helfen
Erkundung der Front-End-Technologie der Go-Sprache: eine neue Vision für die Front-End-Entwicklung
Mar 28, 2024 pm 01:06 PM
Als schnelle und effiziente Programmiersprache erfreut sich Go im Bereich der Backend-Entwicklung großer Beliebtheit. Allerdings assoziieren nur wenige Menschen die Go-Sprache mit der Front-End-Entwicklung. Tatsächlich kann die Verwendung der Go-Sprache für die Front-End-Entwicklung nicht nur die Effizienz verbessern, sondern Entwicklern auch neue Horizonte eröffnen. In diesem Artikel wird die Möglichkeit der Verwendung der Go-Sprache für die Front-End-Entwicklung untersucht und spezifische Codebeispiele bereitgestellt, um den Lesern ein besseres Verständnis dieses Bereichs zu erleichtern. In der traditionellen Frontend-Entwicklung werden häufig JavaScript, HTML und CSS zum Erstellen von Benutzeroberflächen verwendet
Ist PHP Front-End oder Back-End in der Webentwicklung?
Mar 24, 2024 pm 02:18 PM
PHP gehört zum Backend in der Webentwicklung. PHP ist eine serverseitige Skriptsprache, die hauptsächlich zur Verarbeitung serverseitiger Logik und zur Generierung dynamischer Webinhalte verwendet wird. Im Vergleich zur Front-End-Technologie wird PHP eher für Back-End-Vorgänge wie die Interaktion mit Datenbanken, die Verarbeitung von Benutzeranfragen und die Generierung von Seiteninhalten verwendet. Anschließend wird anhand konkreter Codebeispiele die Anwendung von PHP in der Backend-Entwicklung veranschaulicht. Schauen wir uns zunächst ein einfaches PHP-Codebeispiel zum Herstellen einer Verbindung zu einer Datenbank und zum Abfragen von Daten an:
