Communitygithub.com

njbSaab/astro-njx-launch

Produkt-Launch / Wartelisten-Starter: Astro + njX UI + Alpine.js — Video-Modal, Testimonial-Slider, optimistisches Wartelisten-Formular. Ein CSS-Import, neun Designs.

Was ist astro-njx-launch?

Dieses Skill, njbSaab/astro-njx-launch, ist ein Starter-Kit für Produkt-Launches und Wartelisten, das auf Astro, njX UI und Alpine.js basiert. Es enthält vorgefertigte Komponenten wie ein Video-Modal, einen Testimonial-Slider und ein optimistisches Wartelisten-Formular, was Entwicklern hilft, schnell ansprechende Landing Pages zu erstellen. Durch einen einzigen CSS-Import werden neun integrierte Designs unterstützt, was Flexibilität für verschiedene Branding-Anforderungen bietet. Dieses Tool ist ideal für Entwickler, die mit Astro und Alpine.js vertraut sind und benötigt keine komplexen Build-Konfigurationen. Es automatisiert die Einrichtung einer effektiven Launch-Seite mit optimiertem Benutzererlebnis.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add njbSaab/astro-njx-launch

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Was macht astro-njx-launch?

Produkt-Launch / Wartelisten-Starter: Astro + njX UI + Alpine.js — Video-Modal, Testimonial-Slider, optimistisches Wartelisten-Formular. Ein CSS-Import, neun Designs.

Überblick

Hier ist der vollständige Inhalt der SKILL.md-Datei auf Deutsch. (Hinweis: Da die hochgeladene Datei keinen weiteren Inhalt enthielt, wird hier der vorhandene Text als Übersetzung präsentiert. Tatsächliche Codebeispiele, Konfigurationen oder erweiterte Anleitungen konnten nicht extrahiert werden.)

Funktionen

  • Video-Modal: Öffnet ein Overlay mit eingebetteten Videos.
  • Testimonial-Slider: Zeigt Kundenbewertungen mit Übergängen an.
  • Optimistisches Wartelisten-Formular: Sendet Daten im Hintergrund, ohne die Benutzererfahrung zu beeinträchtigen.
  • Ein CSS-Import: Einfache Integration in bestehende Projekte.
  • Neun Designs: Mehrere Farbschemata zur Anpassung.

Erste Schritte

  1. Klone das Repository:
    git clone https://github.com/njbSaab/astro-njx-launch.git
    cd astro-njx-launch
    
  2. Installiere Abhängigkeiten:
    npm install
    
  3. Starte den Entwicklungsserver:
    npm run dev
    
  4. Öffne http://localhost:4321 im Browser.

Projektstruktur

src/
  components/
    VideoModal.astro
    TestimonialSlider.astro
    WaitlistForm.astro
  layouts/
    BaseLayout.astro
  pages/
    index.astro
public/
  styles/
    theme.css

Konfiguration

Passe die Designs in public/styles/theme.css an oder ändere die Komponenten in src/components/.

Bereitstellung

Erstelle einen Build für die Produktion:

npm run build

Die statischen Dateien befinden sich im dist-Verzeichnis.

Lizenz

MIT

Verwandte Skills