Wie Chrome Code Snippet zum HTML programmieren nutzen?
Hey,
ich programmiere gerade an einer relativ großen Webseite rum, die mehrere hundert Zeilen Code enthält. Leider ist diese Zeilenanzahl nun so groß, dass mein primäres HTML Programm, Brackets, absolut am ruckeln ist und der Live View nahezu unbenutzbar ist.
Nach ein wenig überlegen, fiel mir ein, dass man zum Beispiel in Chrome mithilfe eines Rechtsklicks und dann "Untersuchen" auch eine Art Code Widget gelangt in dem man relativ einfach und mit Live View eine Webseite bzw. die Index Dateien bearbeiten kann. Jedoch scheitert es immer wieder am Speichern, ich weiß einfach nicht wie ich die bearbeitete HTML Datei dann speichern kann (auch wenn ich sie ja auf meinem PC liegen habe) finde ich keine Möglichkeit die dann bearbeitete Datei zu speichern.
Wenn ihr wisst wie das ganze funktioniert oder wenn ihr eine Alternativen HTML Editor kennt, der etwas leistungsstärker als Brackets ist und Live View unterstützt, würde ich mich natürlich sehr über eine Antwort freuen
3 Antworten
Es ist zwar möglich die durch die Dev-Tools bearbeitete HTML-Datei zu speichern, indem man im Tab Sources unter Workspace einen Ordner hinzufügt.
Als leistungsstarken Code Editor kann ich dir Visual Studio Code (VS Code) empfehlen. VS Code kann man für jede Programmiersprache nutzen, da man mit Erweiterungen mehr Features und Funktionen der Sprache hinzufügen kann.
Für Programmierung mit HTML und der Live Preview kann ich dir diese Erweiterungen empfehlen:
Du kannst natürlich je nach dem was du brauchst auch weitere Erweiterungen installieren, aber das sind so die die deinen Bedürfnissen entsprechen.
lg Suiram1
Hey, vielen Dank für die Antwort.
An Visual Studio Code hatte ich gar nicht gedacht. Das nutze ich eigentlich nur für Java. Da hätte ich selber drauf kommen können hahah
Deswegen vielen Dank, probiere ich gleich aus :)
Leider ist diese Zeilenanzahl nun so groß, (...)
Das deutet auf kein gutes Projektdesign hin. Unabhängig davon, mit welchem Editor du nun arbeitest, würde ich dir empfehlen, möglichst frühzeitig daran etwas zu ändern, da du dir sonst für die Zukunft ein schlecht wartbares Monster heranziehst.
So gut wie jede Code-Ressource kann für die Entwicklungszeit aufgespalten und in separate Dateien ausgelagert werden (modulares Design). Für das Endprodukt fügt man die Ressourcen wieder zusammen.
- HTML kann mittels Backendanwendung zusammengebaut werden. Ob nun mittels Webframework (ASP.NET/Laravel/Rails/...), einer Template-Engine oder über Funktionen, die einige weborientierte Programmiersprachen (wie PHP) bereits in ihrer Standardbibliothek integriert haben.
- CSS und JavaScript kann man in Module aufteilen und später via Bundlingtool wieder zusammenfügen.
(...) dass man zum Beispiel in Chrome mithilfe eines Rechtsklicks und dann "Untersuchen" auch eine Art Code Widget gelangt (...)
Mit Local Overrides kannst du Änderungen an der Webseite vornehmen, die bei Neuladen der Seite (bei dir) nicht direkt wieder verworfen werden. Der Override wird als Datei auf deinem Rechner gespeichert.
(...) wenn ihr eine Alternativen HTML Editor kennt, der etwas leistungsstärker als Brackets ist (...)
Ein paar Vorschläge:
- PhpStorm
- VS Code
- Visual Studio
Hi, einige 100 Zeilen sind, wenn man HTML, CSS, JS usw. zusammenzählt, eigentlich nicht viel. Richtig professionelle Seiten haben in der Regel einige Tausend Zeilen. Die werden allerdings häufig mit automatisierten Systemen erstellt. Dein Programm oder dein Gerät scheint deutlich zu wenig Leistung zu haben. Ich empfehle dir, dass du dir entweder Visual Studio (Community) oder Visual Studio Code herunterlädst.