micro site

Meinungsorientiertes Micro-Frontend, mit dem ein One-Pager erstellt werden kann. Ideal für Landingpages oder Anmeldeseiten. Es nutzt den statischen Site-Generator Eleventy (11ty) unter der Haube und legt allgemeine 11ty-Standardwerte fest.

Merkmale

• Inlines und minimiert CSS mithilfe von clean-css
• Inlines und minimiert JavaScript mithilfe von terser
• Enthält eine globale Datendatei metadata.json
• Enthält eine base.njk Layoutvorlage
• Enthält einen assets folder für statische Dateien (Bilder, Schriftarten usw.)

Dies ist ein *Skelettprojekt , daher enthält es keine Komponenten oder grundlegenden Stil. Es ist ein *bringen Sie Ihr eigenes Frontend mit.

Verwendung

1. Aktualisieren Sie die Datei metadata.json mit Ihren eigenen Site-Details
2. Bearbeiten Sie die Datei index.njk und beginnen Sie mit der Codierung Ihrer Website!
3. Optional: Stellen Sie die Site auf Netlify bereit.

Installieren

Erfordert node.js und npm

Befolgen Sie diese Schritte, um zu beginnen:

1. Klonen Sie das Projekt

 $ git clone https://github.com/systemdes/micro-site.git

2. Installieren Sie die Abhängigkeiten für diese Projekte

 npm i

3. Dann tun Sie es

 npm run dev

um den Live-Reloadzz auf einem lokalen Entwicklungsserver zu starten.

Projektstruktur

 micro-site/
├── _site/                // output folder of 11ty
├── _data/
│   └── metadata.json     // metadata for the website
├── _includes/
│   ├── style.css         // minified and inlined
│   ├── script.js         // minified and inlined
│   └── base.njk          // base layout
├── assets/               // passtrough copy
├── index.njk/            // landing page
└── .eleventy.js          // 11ty configurations

Roadmap

• Bildoptimierung mit eleventy-image
• Asset-Caching mit eleventy-cache-assets
• Unterstützung der Syntaxhervorhebung mit eleventy-plugin-syntaxhiglight

Lizenz

MIT © Danny de Vries