astro theme stone

Stein: Astro -Thema

Stone ist ein kostenloses und Open-Source-Astro-Thema, das speziell für Websites für Geschäfts-, Marketing-, SaaS- und Startup-Websites entwickelt wurde.

Schlüsselmerkmale:

• Gebaut mit Rückenwind CSS & Alpine.js
• 5+ Seiten
• 15+ Abschnitte
• Sauberes und modernes Design
• Voll reagiert
• Dunkel- und Lichtmodus
• Schnell und Performant
• Super leicht
• Übergänge anzeigen (experimentell)
• Schönerer Codeformatierer
• Google -Schriftarten
• Remix -Symbole
• Kostenlose Updates

Erste Schritte

Anforderungen

• Grundkenntnisse über Astro, HTML und CSS.
• Texteditor (wir empfehlen Visual Studio Code)
• Node.js 18 oder höher.

Abhängigkeiten installieren

Navigieren Sie zu Ihrem Projektordner und installieren Sie seine Abhängigkeiten:

 npm install

Start

Sobald die Installation abgeschlossen ist, können Sie jetzt Ihre App ausführen:

 npm run dev

Dadurch wird die App im Entwicklungsmodus ausgeführt. Öffnen Sie http: // localhost: 3000, um es im Browser anzuzeigen.

Bauen

 npm run build

Dadurch wird die App für die Produktion in den Ordner ./dist/ erstellt.

Projektstruktur

Im Rahmen des Projekts sehen Sie die folgenden Ordner und Dateien:

 /
├── public/
├── src/
│   ├── components/
│   ├── layouts/
│   └── pages/
├── .prettierrc
├── astro.config.mjs
├── package-lock.json
├── package.json
├── README.md
├── tailwind.config.cjs
└── tsconfig.json

• public/* - alle statischen Assets (Bilder, Schriftarten, Ikonen, ...)
• src/* - Projektquellcode (Komponenten, Seiten, ...)
• src/components/* - Wiederverwendbare Astro -Komponenten, die zum Erstellen von Seiten verwendet werden.
• src/layouts/* - Astro -Komponenten, die die UI -Struktur definieren, die von einer oder mehreren Seiten geteilt wird.
• src/pages/* - Astro -Komponenten, die zum Erstellen neuer Seiten auf Ihrer Website verwendet werden. Jede Seite wird als Route basierend auf ihrem Dateinamen freigelegt.
• .prettierrc - schönere Konfigurationsdatei.
• astro.config.mjs - Astro -Konfigurationsdatei.
• package.json - Datei, die von JavaScript -Paketmanagern verwendet wird, um Ihre Abhängigkeiten zu verwalten. Es definiert auch die Skripte, die üblicherweise zum Ausführen von Astro verwendet werden.
• tailwind.config.cjs - Konfigurationsdatei der Tailwind. Im Abschnitt Thema definieren Sie Ihre Farbpalette und Schriftarten.
• tsconfig.json - TypeScript -Konfigurationsdatei.

Einsatz

Bereit zum Erstellen und Bereitstellen Ihrer Website? Folgen Sie der offiziellen Dokumentation.

Unterstützung

Wenn Sie Fragen oder Vorschläge haben, zögern Sie nicht, mich zu kontaktieren.

Lizenz

Dieses Projekt ist gemäß den Bedingungen der MIT -Lizenz lizenziert.