Übersetzungen dieser Seite:
  • de

Developer Notes Übersicht

Web-Entwicklung mit Visual Studio Code

PHP

Erweiterungen:

  • PHP by DEVSENSE
  • Laravel Blade Formatter
  • Laravel Blade Snipperts
  • Laravel Extra Intellisense
  • Laravel goto view
  • Auto Rename Tag
  • Highlight Matching Tag
  • Prettier - Code formatter
  • Intellisense for CSS class names in HTML
  • Tailwind CSS IntelliSense

Emmet

Zweck Code
HTML-Grundgerüst einfügen !
div-Tag div
div-Tag mit Klasse und ID-Attribut .klasse#ID
Mehrere gleiche Elemente a.klasse*3
Komplexe Struktur .container>(header>h2)+(nav>a.nav-el*3)+section+footer
Tag mit Inhalt h1{Überschrift}
Head/Link-Tag link:css

HTTP Server

VSCode-Extension: Live Server

Button: [Go Live]

CSS-SASS-Compiler

VSCode-Extension: Live Sass Compiler

Button: [Watch SASS]

.vscode/settings.json
{"liveSassCompile.settings.formats": [
    {
        "format": "compressed",
        "extensionName": ".min.css",
        "savePath": null,
        "savePathReplacementPairs": null
    }
]}