Next js Blog Boilerplate -Download - Next js Blog Boilerplate -Quellcode herunterladen

Next js Blog Boilerplate

AI-Quellcode

1.0.0

Herunterladen

Nächste JS -Blog -Boilerplate mit Rückenwind -CSS

NEXTJS Starter Banner

Next.js Blog BoilerPlate ist Startercode für Ihr Blog basierend auf Next.js 12+ Framework mit Tailwind CSS 3.0. ⚡️ Hergestellt mit Next.js, TypeScript, Eslint, Schöner, Postcss, Rückenwind -CSS.

Klonen Sie dieses Projekt und erstellen Sie es, um Ihr eigenes NEXT.JS -Blog zu erstellen. Sie können eine nächste JS -Blog -Vorlagen überprüfen.

Sponsoren



Fügen Sie hier Ihr Logo hinzu

Merkmale

Blog -Funktion:

? Syntax -Hervorhebung mit Prism.js
? SEO -Metadaten und offene Diagramm -Tags
JSON-LD für die reichere Indizierung
Pagination
? Fügen Sie ein kostenloses minimalistisches Blog -Thema bei
Markdown
? Maximieren Sie die Leuchtturmbewertung

Entwicklererfahrung zuerst:

Weiter.js für statische Site Generator
? Integrieren Sie sich in CSS mit Rückenwind
? Postcs für die Verarbeitung von Rückenwind -CSS
? Geben Sie das Checking typeScript ein
✏️ Linter mit Eslint
? Codeformatierer mit hübscher
? SEO-Metadaten, JSON-LD und Open Graph Tags mit dem nächsten SEO
Bundler -Analysator

Integrierte Funktion von Next.js:

☕ HTML & CSS minifieren
? Live Reload
✅ Cache Busting

Philosophie

Minimaler Code
SEO-freundlich
Produktionsbereit

Anforderungen

Node.js und npm

Sponsoren

Erste Schritte

Führen Sie den folgenden Befehl in Ihrer lokalen Umgebung aus:

 git clone --depth=1 https://github.com/ixartz/Next-js-Blog-Boilerplate.git my-project-name
cd my-project-name
npm install

Anschließend können Sie im Entwicklungsmodus mit Live -Reload lokal laufen:

 npm run dev

Öffnen Sie http: // localhost: 3000 mit Ihrem bevorzugten Browser, um Ihr Projekt zu sehen.

 .
├── _posts            # Your blog posts
├── public            # Static files
│   ├── assets
│   │   └── images
│   │       └── posts # Images used in your blog posts
└── src
    ├── pages         # Next.js pages
    ├── styles        # Your blog CSS files
    └── templates     # Blog templates

Anpassung

Sie können den nächsten JS -Boilerplate problemlos konfigurieren. Bitte ändern Sie die folgende Datei:

public/apple-touch-icon.png , public/favicon.ico , public/favicon-16x16.png und public/favicon-32x32.png : Ihr Blog favicon, Sie können von https://favicon.io/favicon-converter/generieren.
public/assets/images/logo.png , public/assets/images/logo-32x32.png : Ihr Blog-Logo
src/styles/main.css : Ihre Blog -CSS -Datei mit Tailwind CSS
src/utils/Config.ts : Konfigurationsdatei wie Blog -Name, URL usw.
src/templates/Main.tsx : Blog -Thema

Zur Produktion einsetzen

Sie können die Ergebnisse lokal im Produktionsmodus sehen mit:

 $ npm run build
$ npm run start

Die generierten HTML- und CSS-Dateien werden abgebaut (integrierte Funktionen von Next JS). Es wird auch ungenutzte CSS von Rückenwind -CSS entfernt.

Sie können einen optimierten Produktionsbau erstellen mit:

 npm run build-prod

Jetzt ist Ihr Blog bereit für die Bereitstellung. Alle generierten Dateien befinden sich im dist -Ordner, den Sie mit jedem Hosting -Dienst bereitstellen können.

Auf netlify bereitstellen

Klonen Sie dieses Repository auf eigenem GitHub -Konto und stellen Sie sie für Netlify bereit:

Beiträge

Jeder ist herzlich eingeladen, zu diesem Projekt beizutragen. Fühlen Sie sich frei, ein Problem zu öffnen, wenn Sie eine Frage haben oder einen Fehler gefunden haben.